[hardikkaurani]

Pre-flight checklist

• I have read the Contributing Guidelines on pull requests.
• If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
• If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

Fixes #12646.

When a user has dismissed an announcement bar and the site updates to a new announcement with a different themeConfig.announcementBar.id, the new bar remains hidden on the first page load and only appears upon a second page reload.

Root Cause:

1. getAnnouncementBarInlineScript previously set <html data-announcement-bar-initially-dismissed> based solely on docusaurus.announcement.dismiss === 'true', without comparing docusaurus.announcement.id against the configured announcement bar id.
2. As a result, users with a previously dismissed announcement bar had data-announcement-bar-initially-dismissed="true" applied to <html>, and the stylesheet (html[data-announcement-bar-initially-dismissed='true'] .announcementBar { display: none; }) kept the announcement hidden.
3. React's AnnouncementBarProvider resets dismiss in storage on hydration when the id differs, but does not reset the HTML attribute, so the rendered bar remains visually hidden until the user refreshes a second time.

Fix:

• Passed the configured announcementBar into getAnnouncementBarInlineScript from packages/docusaurus-theme-classic/src/index.ts.
• In getAnnouncementBarInlineScript, read docusaurus.announcement.id, apply backward compatibility for the legacy misspelled annoucement-bar default id (matching AnnouncementBarProvider), and only treat the announcement bar as dismissed if the stored id matches the configured id.

Test Plan

• Added unit tests in packages/docusaurus-theme-classic/src/__tests__/inlineScripts.test.ts verifying:
  • Fresh visitors without stored state -> false
  • Same announcement id dismissed -> true
  • Previously dismissed announcement id, new id configured -> false (solves Announcement bar with a new id stays hidden on first page load for users who dismissed the previous one #12646)
  • Legacy annoucement-bar misspelled id compatibility -> true

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

• Fixes Announcement bar with a new id stays hidden on first page load for users who dismissed the previous one #12646
• Related to Spelling Mistake  #3338

[coderabbitai]

Important

Draft PR not reviewed

Draft PRs are not automatically reviewed by default.

• Trigger a manual review

To automatically review draft PRs, update your CodeRabbit configuration:

reviews:
  auto_review:
    drafts: true

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

_{Comment @coderabbitai help to get the list of available commands.}

[hardikkaurani]

Hi @slorber, @lex111, @Josh-Cena, @yangshun! 👋

When an announcement bar's id is updated in hemeConfig.announcementBar.id, users who had dismissed the previous announcement had the bar hidden on their first page load because getAnnouncementBarInlineScript set data-announcement-bar-initially-dismissed='true' without checking if the stored id matches the newly configured id (#12646).

This PR passes �nnouncementBar into the inline script and verifies docusaurus.announcement.id (with backward compatibility for the legacy misspelled �nnoucement-bar default id), ensuring new announcements display immediately on the first visit with comprehensive unit test coverage. Whenever you have a chance, I'd appreciate your review! Thank you!

[netlify]

✅ [V2]

Built without sensitive environment variables

Name	Link
🔨 Latest commit	73bc899
🔍 Latest deploy log	https://app.netlify.com/projects/docusaurus-2/deploys/6ad8807e15fd5c8f3c4b5282
😎 Deploy Preview	https://deploy-preview-12749--docusaurus-2.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[hardikkaurani]

🔍 Why This PR is Merge-Ready

Hi team, here is a detailed breakdown of why this PR is complete, minimal, and ready to merge:

1. Clear Problem & Root Cause Analysis

• Reported in: Announcement bar with a new id stays hidden on first page load for users who dismissed the previous one #12646
• Root Cause: When an existing user has previously dismissed an announcement bar and the site author updates the announcement with a new id:
  1. getAnnouncementBarInlineScript was setting data-announcement-bar-initially-dismissed="true" on <html> purely based on docusaurus.announcement.dismiss === 'true', without checking docusaurus.announcement.id.
  2. The CSS rule html[data-announcement-bar-initially-dismissed='true'] .announcementBar { display: none; } hid the banner.
  3. Although React's AnnouncementBarProvider resets the dismiss flag in localStorage upon hydration when IDs differ, it does not mutate the static data-announcement-bar-initially-dismissed attribute on the <html> tag. As a result, returning users never saw the new announcement on first load—it only appeared after a second page refresh.

2. Surgical Fix with Full Compatibility

• Minimal diff in theme-classic:
  • packages/docusaurus-theme-classic/src/index.ts: Passed announcementBar configuration to getAnnouncementBarInlineScript.
  • packages/docusaurus-theme-classic/src/inlineScripts.ts: Reads docusaurus.announcement.id and verifies it matches the configured id before applying initial dismissal.
• Backwards Compatibility: Maintained exact compatibility with the historical misspelled default ID annoucement-bar (matching the fallback logic in AnnouncementBarProvider.tsx).
• Resilient: Storage access remains safely guarded in a try/catch block for incognito or restricted browser contexts.

3. Edge Cases & Regressions Handled

• ✅ Fresh visitors: No stored dismissal -> banner renders immediately on first load.
• ✅ Same announcement ID dismissed: id === storedId and dismiss === 'true' -> dismissed immediately before hydration to prevent banner flash / layout shift.
• ✅ New announcement ID: id !== storedId -> initial dismissal is NOT applied, banner displays immediately on first load.
• ✅ Legacy storage key compatibility: Sites migrating from legacy default annoucement-bar are correctly recognized.

4. Test Coverage & CI Status

• Added 100 lines of unit tests in packages/docusaurus-theme-classic/src/__tests__/inlineScripts.test.ts covering fresh visits, same ID, changed ID, and legacy keys.
• ✅ Meta CLA Check: Passed
• ✅ Netlify Deploy Preview: Built and passing (deploy preview)
• ✅ Socket Security: Passed
• ✅ Zero Breaking Changes: Non-breaking enhancement to the inline pre-hydration script.

Ready for maintainer sign-off! 🚀