[{"data":1,"prerenderedAt":1759},["ShallowReactive",2],{"site-header-nav":3,"page-\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing\u002Ftesting-aria-live-regions-with-jest-and-testing-library\u002F":156,"content-navigation":1685},[4,66,70],{"title":5,"path":6,"stem":7,"children":8},"Core Accessibility Principles For Modern Frameworks","\u002Fcore-accessibility-principles-for-modern-frameworks","core-accessibility-principles-for-modern-frameworks",[9,12,18,24,36,48,60],{"title":10,"path":6,"stem":11},"Core Accessibility Principles for Modern Frameworks","core-accessibility-principles-for-modern-frameworks\u002Findex",{"title":13,"path":14,"stem":15,"children":16},"Accessible Color Contrast & Theming","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Faccessible-color-contrast-theming","core-accessibility-principles-for-modern-frameworks\u002Faccessible-color-contrast-theming\u002Findex",[17],{"title":13,"path":14,"stem":15},{"title":19,"path":20,"stem":21,"children":22},"Accessible Form Validation & Error States in Modern Frameworks","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Faccessible-form-validation-error-states","core-accessibility-principles-for-modern-frameworks\u002Faccessible-form-validation-error-states\u002Findex",[23],{"title":19,"path":20,"stem":21},{"title":25,"path":26,"stem":27,"children":28},"Focus Management Strategies for SPAs","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Ffocus-management-strategies-for-spas","core-accessibility-principles-for-modern-frameworks\u002Ffocus-management-strategies-for-spas\u002Findex",[29,30],{"title":25,"path":26,"stem":27},{"title":31,"path":32,"stem":33,"children":34},"Handling Focus Restoration After Dynamic Route Changes","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Ffocus-management-strategies-for-spas\u002Fhandling-focus-restoration-after-dynamic-route-changes","core-accessibility-principles-for-modern-frameworks\u002Ffocus-management-strategies-for-spas\u002Fhandling-focus-restoration-after-dynamic-route-changes\u002Findex",[35],{"title":31,"path":32,"stem":33},{"title":37,"path":38,"stem":39,"children":40},"Keyboard Navigation Patterns for Modals","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fkeyboard-navigation-patterns-for-modals","core-accessibility-principles-for-modern-frameworks\u002Fkeyboard-navigation-patterns-for-modals\u002Findex",[41,42],{"title":37,"path":38,"stem":39},{"title":43,"path":44,"stem":45,"children":46},"Building Accessible Dropdowns Without External UI Kits","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fkeyboard-navigation-patterns-for-modals\u002Fbuilding-accessible-dropdowns-without-external-ui-kits","core-accessibility-principles-for-modern-frameworks\u002Fkeyboard-navigation-patterns-for-modals\u002Fbuilding-accessible-dropdowns-without-external-ui-kits\u002Findex",[47],{"title":43,"path":44,"stem":45},{"title":49,"path":50,"stem":51,"children":52},"Screen Reader Compatibility Testing for Modern Frameworks","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing","core-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing\u002Findex",[53,54],{"title":49,"path":50,"stem":51},{"title":55,"path":56,"stem":57,"children":58},"Testing ARIA Live Regions with Jest and Testing Library","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing\u002Ftesting-aria-live-regions-with-jest-and-testing-library","core-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing\u002Ftesting-aria-live-regions-with-jest-and-testing-library\u002Findex",[59],{"title":55,"path":56,"stem":57},{"title":61,"path":62,"stem":63,"children":64},"Semantic HTML vs ARIA in Component Trees","\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fsemantic-html-vs-aria-in-component-trees","core-accessibility-principles-for-modern-frameworks\u002Fsemantic-html-vs-aria-in-component-trees\u002Findex",[65],{"title":61,"path":62,"stem":63},{"title":67,"path":68,"stem":69},"Modern Framework Accessibility","\u002F","index",{"title":71,"path":72,"stem":73,"children":74},"React Nextjs Accessibility Patterns","\u002Freact-nextjs-accessibility-patterns","react-nextjs-accessibility-patterns",[75,78,90,102,108,126,144],{"title":76,"path":72,"stem":77},"React & Next.js Accessibility Patterns","react-nextjs-accessibility-patterns\u002Findex",{"title":79,"path":80,"stem":81,"children":82},"Accessible Component Libraries in React","\u002Freact-nextjs-accessibility-patterns\u002Faccessible-component-libraries-in-react","react-nextjs-accessibility-patterns\u002Faccessible-component-libraries-in-react\u002Findex",[83,84],{"title":79,"path":80,"stem":81},{"title":85,"path":86,"stem":87,"children":88},"Building Accessible Tabs in React Without Radix UI","\u002Freact-nextjs-accessibility-patterns\u002Faccessible-component-libraries-in-react\u002Fbuilding-accessible-tabs-in-react-without-radix-ui","react-nextjs-accessibility-patterns\u002Faccessible-component-libraries-in-react\u002Fbuilding-accessible-tabs-in-react-without-radix-ui\u002Findex",[89],{"title":85,"path":86,"stem":87},{"title":91,"path":92,"stem":93,"children":94},"Dynamic Content & State Announcements in React & Next.js","\u002Freact-nextjs-accessibility-patterns\u002Fdynamic-content-state-announcements","react-nextjs-accessibility-patterns\u002Fdynamic-content-state-announcements\u002Findex",[95,96],{"title":91,"path":92,"stem":93},{"title":97,"path":98,"stem":99,"children":100},"Implementing React Context for Global Accessibility Preferences","\u002Freact-nextjs-accessibility-patterns\u002Fdynamic-content-state-announcements\u002Freact-context-for-global-accessibility-preferences","react-nextjs-accessibility-patterns\u002Fdynamic-content-state-announcements\u002Freact-context-for-global-accessibility-preferences\u002Findex",[101],{"title":97,"path":98,"stem":99},{"title":103,"path":104,"stem":105,"children":106},"Form Handling with React Hook Form & Accessibility","\u002Freact-nextjs-accessibility-patterns\u002Fform-handling-with-react-hook-form-a11y","react-nextjs-accessibility-patterns\u002Fform-handling-with-react-hook-form-a11y\u002Findex",[107],{"title":103,"path":104,"stem":105},{"title":109,"path":110,"stem":111,"children":112},"Next.js App Router & A11y: Implementation Guide for Modern Frameworks","\u002Freact-nextjs-accessibility-patterns\u002Fnextjs-app-router-a11y","react-nextjs-accessibility-patterns\u002Fnextjs-app-router-a11y\u002Findex",[113,114,120],{"title":109,"path":110,"stem":111},{"title":115,"path":116,"stem":117,"children":118},"Implementing Skip Links in Next.js App Router: A Step-by-Step Guide","\u002Freact-nextjs-accessibility-patterns\u002Fnextjs-app-router-a11y\u002Fimplementing-skip-links-in-nextjs-app-router","react-nextjs-accessibility-patterns\u002Fnextjs-app-router-a11y\u002Fimplementing-skip-links-in-nextjs-app-router\u002Findex",[119],{"title":115,"path":116,"stem":117},{"title":121,"path":122,"stem":123,"children":124},"Next.js Dynamic Imports and Keyboard Navigation: A Complete A11y Implementation Guide","\u002Freact-nextjs-accessibility-patterns\u002Fnextjs-app-router-a11y\u002Fnextjs-dynamic-imports-and-keyboard-navigation","react-nextjs-accessibility-patterns\u002Fnextjs-app-router-a11y\u002Fnextjs-dynamic-imports-and-keyboard-navigation\u002Findex",[125],{"title":121,"path":122,"stem":123},{"title":127,"path":128,"stem":129,"children":130},"React Hooks for Accessibility: Implementation Patterns & State Management","\u002Freact-nextjs-accessibility-patterns\u002Freact-hooks-for-accessibility","react-nextjs-accessibility-patterns\u002Freact-hooks-for-accessibility\u002Findex",[131,132,138],{"title":127,"path":128,"stem":129},{"title":133,"path":134,"stem":135,"children":136},"Fixing Focus Trap Issues in React Portals","\u002Freact-nextjs-accessibility-patterns\u002Freact-hooks-for-accessibility\u002Ffixing-focus-trap-issues-in-react-portals","react-nextjs-accessibility-patterns\u002Freact-hooks-for-accessibility\u002Ffixing-focus-trap-issues-in-react-portals\u002Findex",[137],{"title":133,"path":134,"stem":135},{"title":139,"path":140,"stem":141,"children":142},"Making React useEffect Accessible for Screen Readers","\u002Freact-nextjs-accessibility-patterns\u002Freact-hooks-for-accessibility\u002Fmaking-react-useeffect-accessible-for-screen-readers","react-nextjs-accessibility-patterns\u002Freact-hooks-for-accessibility\u002Fmaking-react-useeffect-accessible-for-screen-readers\u002Findex",[143],{"title":139,"path":140,"stem":141},{"title":145,"path":146,"stem":147,"children":148},"Server Components & Client-Side Interactivity","\u002Freact-nextjs-accessibility-patterns\u002Fserver-components-client-side-interactivity","react-nextjs-accessibility-patterns\u002Fserver-components-client-side-interactivity\u002Findex",[149,150],{"title":145,"path":146,"stem":147},{"title":151,"path":152,"stem":153,"children":154},"Handling Accessible Modals in Next.js 14 Server Components","\u002Freact-nextjs-accessibility-patterns\u002Fserver-components-client-side-interactivity\u002Fhandling-accessible-modals-in-nextjs-14-server-components","react-nextjs-accessibility-patterns\u002Fserver-components-client-side-interactivity\u002Fhandling-accessible-modals-in-nextjs-14-server-components\u002Findex",[155],{"title":151,"path":152,"stem":153},{"id":157,"title":55,"body":158,"date":1678,"description":1679,"extension":1680,"image":1678,"meta":1681,"modifiedAt":1678,"navigation":482,"noindex":1682,"path":56,"publishedAt":1678,"seo":1683,"stem":57,"updatedAt":1678,"__hash__":1684},"content\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing\u002Ftesting-aria-live-regions-with-jest-and-testing-library\u002Findex.md",{"type":159,"value":160,"toc":1660},"minimark",[161,165,192,198,219,224,252,257,260,265,300,304,311,318,433,437,440,447,510,524,528,539,543,560,567,722,729,895,910,914,923,927,952,959,1284,1295,1299,1302,1306,1349,1356,1565,1570,1574,1609,1613,1627,1640,1656],[162,163,55],"h1",{"id":164},"testing-aria-live-regions-with-jest-and-testing-library",[166,167,168,169,173,174,178,179,182,183,186,187,191],"p",{},"This guide provides a reproducible methodology for validating dynamic content announcements using ",[170,171,10],"a",{"href":172},"\u002Fcore-accessibility-principles-for-modern-frameworks\u002F"," as a foundational reference. By combining Jest with Testing Library’s ",[175,176,177],"code",{},"waitFor"," and ",[175,180,181],{},"getByRole"," utilities, frontend engineers can programmatically assert that ",[175,184,185],{},"aria-live"," regions correctly broadcast state changes to assistive technologies, reducing reliance on manual ",[170,188,190],{"href":189},"\u002Fcore-accessibility-principles-for-modern-frameworks\u002Fscreen-reader-compatibility-testing\u002F","Screen Reader Compatibility Testing"," during rapid iteration cycles.",[166,193,194],{},[195,196,197],"strong",{},"WCAG Compliance Mapping",[199,200,201,208,214],"ul",{},[202,203,204,207],"li",{},[175,205,206],{},"4.1.3 Status Messages"," (Level AA)",[202,209,210,213],{},[175,211,212],{},"1.3.1 Info and Relationships"," (Level A)",[202,215,216,213],{},[175,217,218],{},"3.3.1 Error Identification",[166,220,221],{},[195,222,223],{},"Core Implementation Principles",[199,225,226,229,235,249],{},[202,227,228],{},"Isolate live region DOM nodes before asserting text content",[202,230,231,232,234],{},"Use ",[175,233,177],{}," to handle asynchronous DOM mutations",[202,236,237,238,240,241,244,245,248],{},"Validate ",[175,239,185],{}," politeness levels (",[175,242,243],{},"polite"," vs ",[175,246,247],{},"assertive",")",[202,250,251],{},"Mock timers to control announcement timing in test environments",[253,254,256],"h2",{"id":255},"environment-configuration-setup","Environment Configuration & Setup",[166,258,259],{},"Configure Jest and Testing Library to correctly parse ARIA roles and handle asynchronous DOM updates in component trees.",[261,262,264],"h3",{"id":263},"_1-install-required-dependencies","1. Install Required Dependencies",[266,267,272],"pre",{"className":268,"code":269,"language":270,"meta":271,"style":271},"language-bash shiki shiki-themes github-light github-dark","npm install --save-dev @testing-library\u002Freact @testing-library\u002Fjest-dom jest\n","bash","",[175,273,274],{"__ignoreMap":271},[275,276,279,283,287,291,294,297],"span",{"class":277,"line":278},"line",1,[275,280,282],{"class":281},"sScJk","npm",[275,284,286],{"class":285},"sZZnC"," install",[275,288,290],{"class":289},"sj4cs"," --save-dev",[275,292,293],{"class":285}," @testing-library\u002Freact",[275,295,296],{"class":285}," @testing-library\u002Fjest-dom",[275,298,299],{"class":285}," jest\n",[261,301,303],{"id":302},"_2-configure-jest-environment","2. Configure Jest Environment",[166,305,306,307,310],{},"Set the test environment to ",[175,308,309],{},"jsdom"," to simulate browser APIs required for DOM manipulation and accessibility tree resolution.",[166,312,313],{},[195,314,315],{},[175,316,317],{},"jest.config.js",[266,319,323],{"className":320,"code":321,"language":322,"meta":271,"style":271},"language-javascript shiki shiki-themes github-light github-dark","module.exports = {\n testEnvironment: 'jsdom',\n setupFilesAfterEnv: ['\u003CrootDir>\u002Ftest-setup.js'],\n transform: {\n '^.+\\\\.(js|jsx|ts|tsx)$': 'babel-jest',\n },\n moduleFileExtensions: ['js', 'jsx', 'json', 'node'],\n};\n","javascript",[175,324,325,344,356,368,374,394,400,427],{"__ignoreMap":271},[275,326,327,330,334,337,341],{"class":277,"line":278},[275,328,329],{"class":289},"module",[275,331,333],{"class":332},"sVt8B",".",[275,335,336],{"class":289},"exports",[275,338,340],{"class":339},"szBVR"," =",[275,342,343],{"class":332}," {\n",[275,345,347,350,353],{"class":277,"line":346},2,[275,348,349],{"class":332}," testEnvironment: ",[275,351,352],{"class":285},"'jsdom'",[275,354,355],{"class":332},",\n",[275,357,359,362,365],{"class":277,"line":358},3,[275,360,361],{"class":332}," setupFilesAfterEnv: [",[275,363,364],{"class":285},"'\u003CrootDir>\u002Ftest-setup.js'",[275,366,367],{"class":332},"],\n",[275,369,371],{"class":277,"line":370},4,[275,372,373],{"class":332}," transform: {\n",[275,375,377,380,383,386,389,392],{"class":277,"line":376},5,[275,378,379],{"class":285}," '^.+",[275,381,382],{"class":289},"\\\\",[275,384,385],{"class":285},".(js|jsx|ts|tsx)$'",[275,387,388],{"class":332},": ",[275,390,391],{"class":285},"'babel-jest'",[275,393,355],{"class":332},[275,395,397],{"class":277,"line":396},6,[275,398,399],{"class":332}," },\n",[275,401,403,406,409,412,415,417,420,422,425],{"class":277,"line":402},7,[275,404,405],{"class":332}," moduleFileExtensions: [",[275,407,408],{"class":285},"'js'",[275,410,411],{"class":332},", ",[275,413,414],{"class":285},"'jsx'",[275,416,411],{"class":332},[275,418,419],{"class":285},"'json'",[275,421,411],{"class":332},[275,423,424],{"class":285},"'node'",[275,426,367],{"class":332},[275,428,430],{"class":277,"line":429},8,[275,431,432],{"class":332},"};\n",[261,434,436],{"id":435},"_3-initialize-testing-library-matchers","3. Initialize Testing Library Matchers",[166,438,439],{},"Extend Jest with DOM-specific assertions and configure global cleanup.",[166,441,442],{},[195,443,444],{},[175,445,446],{},"test-setup.js",[266,448,450],{"className":320,"code":449,"language":322,"meta":271,"style":271},"import '@testing-library\u002Fjest-dom';\nimport { cleanup } from '@testing-library\u002Freact';\n\nafterEach(() => {\n cleanup();\n});\n",[175,451,452,463,478,484,497,505],{"__ignoreMap":271},[275,453,454,457,460],{"class":277,"line":278},[275,455,456],{"class":339},"import",[275,458,459],{"class":285}," '@testing-library\u002Fjest-dom'",[275,461,462],{"class":332},";\n",[275,464,465,467,470,473,476],{"class":277,"line":346},[275,466,456],{"class":339},[275,468,469],{"class":332}," { cleanup } ",[275,471,472],{"class":339},"from",[275,474,475],{"class":285}," '@testing-library\u002Freact'",[275,477,462],{"class":332},[275,479,480],{"class":277,"line":358},[275,481,483],{"emptyLinePlaceholder":482},true,"\n",[275,485,486,489,492,495],{"class":277,"line":370},[275,487,488],{"class":281},"afterEach",[275,490,491],{"class":332},"(() ",[275,493,494],{"class":339},"=>",[275,496,343],{"class":332},[275,498,499,502],{"class":277,"line":376},[275,500,501],{"class":281}," cleanup",[275,503,504],{"class":332},"();\n",[275,506,507],{"class":277,"line":396},[275,508,509],{"class":332},"});\n",[166,511,512,515,516,519,520,523],{},[195,513,514],{},"Testing Note:"," Ensure ",[175,517,518],{},"jest.useFakeTimers()"," is available if your component relies on ",[175,521,522],{},"setTimeout"," or debounced state updates before triggering live region announcements.",[253,525,527],{"id":526},"component-implementation-dom-structure","Component Implementation & DOM Structure",[166,529,530,531,534,535,538],{},"Build a framework-agnostic notification component that correctly applies ",[175,532,533],{},"role=\"status\""," or ",[175,536,537],{},"aria-live=\"polite\""," without disrupting the accessibility tree.",[261,540,542],{"id":541},"implementation-guidelines","Implementation Guidelines",[199,544,545,551,554],{},[202,546,547,548,550],{},"Avoid redundant ",[175,549,185],{}," attributes on parent and child elements.",[202,552,553],{},"Keep the live region permanently mounted in the DOM to prevent focus loss or tree fragmentation.",[202,555,231,556,559],{},[175,557,558],{},"aria-atomic=\"true\""," to ensure full string replacement on updates.",[166,561,562],{},[195,563,564],{},[175,565,566],{},"LiveRegion.jsx",[266,568,572],{"className":569,"code":570,"language":571,"meta":271,"style":271},"language-jsx shiki shiki-themes github-light github-dark","import React, { useState } from 'react';\n\nexport const StatusNotifier = ({ message }) => {\n return (\n \u003Cdiv\n role=\"status\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n className=\"sr-only-live-region\"\n >\n {message || 'No updates'}\n \u003C\u002Fdiv>\n );\n};\n","jsx",[175,573,574,588,592,619,627,636,647,657,667,678,684,699,711,717],{"__ignoreMap":271},[275,575,576,578,581,583,586],{"class":277,"line":278},[275,577,456],{"class":339},[275,579,580],{"class":332}," React, { useState } ",[275,582,472],{"class":339},[275,584,585],{"class":285}," 'react'",[275,587,462],{"class":332},[275,589,590],{"class":277,"line":346},[275,591,483],{"emptyLinePlaceholder":482},[275,593,594,597,600,603,605,608,612,615,617],{"class":277,"line":358},[275,595,596],{"class":339},"export",[275,598,599],{"class":339}," const",[275,601,602],{"class":281}," StatusNotifier",[275,604,340],{"class":339},[275,606,607],{"class":332}," ({ ",[275,609,611],{"class":610},"s4XuR","message",[275,613,614],{"class":332}," }) ",[275,616,494],{"class":339},[275,618,343],{"class":332},[275,620,621,624],{"class":277,"line":370},[275,622,623],{"class":339}," return",[275,625,626],{"class":332}," (\n",[275,628,629,632],{"class":277,"line":376},[275,630,631],{"class":332}," \u003C",[275,633,635],{"class":634},"s9eBZ","div\n",[275,637,638,641,644],{"class":277,"line":396},[275,639,640],{"class":281}," role",[275,642,643],{"class":339},"=",[275,645,646],{"class":285},"\"status\"\n",[275,648,649,652,654],{"class":277,"line":402},[275,650,651],{"class":281}," aria-live",[275,653,643],{"class":339},[275,655,656],{"class":285},"\"polite\"\n",[275,658,659,662,664],{"class":277,"line":429},[275,660,661],{"class":281}," aria-atomic",[275,663,643],{"class":339},[275,665,666],{"class":285},"\"true\"\n",[275,668,670,673,675],{"class":277,"line":669},9,[275,671,672],{"class":281}," className",[275,674,643],{"class":339},[275,676,677],{"class":285},"\"sr-only-live-region\"\n",[275,679,681],{"class":277,"line":680},10,[275,682,683],{"class":332}," >\n",[275,685,687,690,693,696],{"class":277,"line":686},11,[275,688,689],{"class":332}," {message ",[275,691,692],{"class":339},"||",[275,694,695],{"class":285}," 'No updates'",[275,697,698],{"class":332},"}\n",[275,700,702,705,708],{"class":277,"line":701},12,[275,703,704],{"class":332}," \u003C\u002F",[275,706,707],{"class":634},"div",[275,709,710],{"class":332},">\n",[275,712,714],{"class":277,"line":713},13,[275,715,716],{"class":332}," );\n",[275,718,720],{"class":277,"line":719},14,[275,721,432],{"class":332},[166,723,724],{},[195,725,726],{},[175,727,728],{},"LiveRegion.test.jsx",[266,730,732],{"className":569,"code":731,"language":571,"meta":271,"style":271},"import { render, screen } from '@testing-library\u002Freact';\nimport { StatusNotifier } from '.\u002FLiveRegion';\n\ntest('renders with correct ARIA attributes', () => {\n render(\u003CStatusNotifier message=\"Ready\" \u002F>);\n const region = screen.getByRole('status');\n \n expect(region).toHaveAttribute('aria-live', 'polite');\n expect(region).toHaveAttribute('aria-atomic', 'true');\n expect(region).toHaveTextContent('Ready');\n});\n",[175,733,734,747,761,765,783,805,827,832,855,875,891],{"__ignoreMap":271},[275,735,736,738,741,743,745],{"class":277,"line":278},[275,737,456],{"class":339},[275,739,740],{"class":332}," { render, screen } ",[275,742,472],{"class":339},[275,744,475],{"class":285},[275,746,462],{"class":332},[275,748,749,751,754,756,759],{"class":277,"line":346},[275,750,456],{"class":339},[275,752,753],{"class":332}," { StatusNotifier } ",[275,755,472],{"class":339},[275,757,758],{"class":285}," '.\u002FLiveRegion'",[275,760,462],{"class":332},[275,762,763],{"class":277,"line":358},[275,764,483],{"emptyLinePlaceholder":482},[275,766,767,770,773,776,779,781],{"class":277,"line":370},[275,768,769],{"class":281},"test",[275,771,772],{"class":332},"(",[275,774,775],{"class":285},"'renders with correct ARIA attributes'",[275,777,778],{"class":332},", () ",[275,780,494],{"class":339},[275,782,343],{"class":332},[275,784,785,788,791,794,797,799,802],{"class":277,"line":376},[275,786,787],{"class":281}," render",[275,789,790],{"class":332},"(\u003C",[275,792,793],{"class":289},"StatusNotifier",[275,795,796],{"class":281}," message",[275,798,643],{"class":339},[275,800,801],{"class":285},"\"Ready\"",[275,803,804],{"class":332}," \u002F>);\n",[275,806,807,809,812,814,817,819,821,824],{"class":277,"line":396},[275,808,599],{"class":339},[275,810,811],{"class":289}," region",[275,813,340],{"class":339},[275,815,816],{"class":332}," screen.",[275,818,181],{"class":281},[275,820,772],{"class":332},[275,822,823],{"class":285},"'status'",[275,825,826],{"class":332},");\n",[275,828,829],{"class":277,"line":402},[275,830,831],{"class":332}," \n",[275,833,834,837,840,843,845,848,850,853],{"class":277,"line":429},[275,835,836],{"class":281}," expect",[275,838,839],{"class":332},"(region).",[275,841,842],{"class":281},"toHaveAttribute",[275,844,772],{"class":332},[275,846,847],{"class":285},"'aria-live'",[275,849,411],{"class":332},[275,851,852],{"class":285},"'polite'",[275,854,826],{"class":332},[275,856,857,859,861,863,865,868,870,873],{"class":277,"line":669},[275,858,836],{"class":281},[275,860,839],{"class":332},[275,862,842],{"class":281},[275,864,772],{"class":332},[275,866,867],{"class":285},"'aria-atomic'",[275,869,411],{"class":332},[275,871,872],{"class":285},"'true'",[275,874,826],{"class":332},[275,876,877,879,881,884,886,889],{"class":277,"line":680},[275,878,836],{"class":281},[275,880,839],{"class":332},[275,882,883],{"class":281},"toHaveTextContent",[275,885,772],{"class":332},[275,887,888],{"class":285},"'Ready'",[275,890,826],{"class":332},[275,892,893],{"class":277,"line":686},[275,894,509],{"class":332},[166,896,897,899,900,178,903,905,906,909],{},[195,898,514],{}," Verify the element renders with the correct ",[175,901,902],{},"role",[175,904,185],{}," attributes before triggering any state changes. Use ",[175,907,908],{},"getByRole('status')"," for reliable querying.",[253,911,913],{"id":912},"writing-async-assertions-for-announcements","Writing Async Assertions for Announcements",[166,915,916,917,178,919,922],{},"Leverage ",[175,918,177],{},[175,920,921],{},"findByRole"," to capture DOM mutations triggered by user interactions or API responses.",[261,924,926],{"id":925},"execution-strategy","Execution Strategy",[199,928,929,942,949],{},[202,930,931,932,411,935,411,938,941],{},"Query by semantic role (",[175,933,934],{},"status",[175,936,937],{},"alert",[175,939,940],{},"log",") instead of CSS selectors.",[202,943,944,945,948],{},"Assert ",[175,946,947],{},"textContent"," after the component finishes rendering.",[202,950,951],{},"Handle throttled or debounced updates by advancing fake timers.",[166,953,954],{},[195,955,956],{},[175,957,958],{},"async-assertion.test.jsx",[266,960,962],{"className":569,"code":961,"language":571,"meta":271,"style":271},"import { render, screen, fireEvent, waitFor } from '@testing-library\u002Freact';\nimport StatusNotifier from '.\u002FStatusNotifier';\n\ntest('announces status update to screen readers', async () => {\n render(\u003CStatusNotifier \u002F>);\n \n \u002F\u002F Trigger state change\n fireEvent.click(screen.getByRole('button', { name: \u002Ftrigger update\u002Fi }));\n \n \u002F\u002F Wait for DOM mutation and assert content\n await waitFor(() => {\n expect(screen.getByRole('status')).toHaveTextContent('Operation successful');\n });\n});\n\ntest('assertive region interrupts politely queued messages', async () => {\n render(\u003CNotificationSystem \u002F>);\n \n fireEvent.click(screen.getByRole('button', { name: \u002Fcritical error\u002Fi }));\n \n await waitFor(() => {\n const alert = screen.getByRole('alert');\n expect(alert).toHaveAttribute('aria-live', 'assertive');\n expect(alert).toHaveTextContent('Connection lost');\n });\n});\n",[175,963,964,977,991,995,1016,1026,1030,1036,1072,1076,1081,1095,1119,1124,1128,1133,1153,1165,1170,1198,1203,1216,1237,1258,1274,1279],{"__ignoreMap":271},[275,965,966,968,971,973,975],{"class":277,"line":278},[275,967,456],{"class":339},[275,969,970],{"class":332}," { render, screen, fireEvent, waitFor } ",[275,972,472],{"class":339},[275,974,475],{"class":285},[275,976,462],{"class":332},[275,978,979,981,984,986,989],{"class":277,"line":346},[275,980,456],{"class":339},[275,982,983],{"class":332}," StatusNotifier ",[275,985,472],{"class":339},[275,987,988],{"class":285}," '.\u002FStatusNotifier'",[275,990,462],{"class":332},[275,992,993],{"class":277,"line":358},[275,994,483],{"emptyLinePlaceholder":482},[275,996,997,999,1001,1004,1006,1009,1012,1014],{"class":277,"line":370},[275,998,769],{"class":281},[275,1000,772],{"class":332},[275,1002,1003],{"class":285},"'announces status update to screen readers'",[275,1005,411],{"class":332},[275,1007,1008],{"class":339},"async",[275,1010,1011],{"class":332}," () ",[275,1013,494],{"class":339},[275,1015,343],{"class":332},[275,1017,1018,1020,1022,1024],{"class":277,"line":376},[275,1019,787],{"class":281},[275,1021,790],{"class":332},[275,1023,793],{"class":289},[275,1025,804],{"class":332},[275,1027,1028],{"class":277,"line":396},[275,1029,831],{"class":332},[275,1031,1032],{"class":277,"line":402},[275,1033,1035],{"class":1034},"sJ8bj"," \u002F\u002F Trigger state change\n",[275,1037,1038,1041,1044,1047,1049,1051,1054,1057,1060,1064,1066,1069],{"class":277,"line":429},[275,1039,1040],{"class":332}," fireEvent.",[275,1042,1043],{"class":281},"click",[275,1045,1046],{"class":332},"(screen.",[275,1048,181],{"class":281},[275,1050,772],{"class":332},[275,1052,1053],{"class":285},"'button'",[275,1055,1056],{"class":332},", { name:",[275,1058,1059],{"class":285}," \u002F",[275,1061,1063],{"class":1062},"sA_wV","trigger update",[275,1065,68],{"class":285},[275,1067,1068],{"class":339},"i",[275,1070,1071],{"class":332}," }));\n",[275,1073,1074],{"class":277,"line":669},[275,1075,831],{"class":332},[275,1077,1078],{"class":277,"line":680},[275,1079,1080],{"class":1034}," \u002F\u002F Wait for DOM mutation and assert content\n",[275,1082,1083,1086,1089,1091,1093],{"class":277,"line":686},[275,1084,1085],{"class":339}," await",[275,1087,1088],{"class":281}," waitFor",[275,1090,491],{"class":332},[275,1092,494],{"class":339},[275,1094,343],{"class":332},[275,1096,1097,1099,1101,1103,1105,1107,1110,1112,1114,1117],{"class":277,"line":701},[275,1098,836],{"class":281},[275,1100,1046],{"class":332},[275,1102,181],{"class":281},[275,1104,772],{"class":332},[275,1106,823],{"class":285},[275,1108,1109],{"class":332},")).",[275,1111,883],{"class":281},[275,1113,772],{"class":332},[275,1115,1116],{"class":285},"'Operation successful'",[275,1118,826],{"class":332},[275,1120,1121],{"class":277,"line":713},[275,1122,1123],{"class":332}," });\n",[275,1125,1126],{"class":277,"line":719},[275,1127,509],{"class":332},[275,1129,1131],{"class":277,"line":1130},15,[275,1132,483],{"emptyLinePlaceholder":482},[275,1134,1136,1138,1140,1143,1145,1147,1149,1151],{"class":277,"line":1135},16,[275,1137,769],{"class":281},[275,1139,772],{"class":332},[275,1141,1142],{"class":285},"'assertive region interrupts politely queued messages'",[275,1144,411],{"class":332},[275,1146,1008],{"class":339},[275,1148,1011],{"class":332},[275,1150,494],{"class":339},[275,1152,343],{"class":332},[275,1154,1156,1158,1160,1163],{"class":277,"line":1155},17,[275,1157,787],{"class":281},[275,1159,790],{"class":332},[275,1161,1162],{"class":289},"NotificationSystem",[275,1164,804],{"class":332},[275,1166,1168],{"class":277,"line":1167},18,[275,1169,831],{"class":332},[275,1171,1173,1175,1177,1179,1181,1183,1185,1187,1189,1192,1194,1196],{"class":277,"line":1172},19,[275,1174,1040],{"class":332},[275,1176,1043],{"class":281},[275,1178,1046],{"class":332},[275,1180,181],{"class":281},[275,1182,772],{"class":332},[275,1184,1053],{"class":285},[275,1186,1056],{"class":332},[275,1188,1059],{"class":285},[275,1190,1191],{"class":1062},"critical error",[275,1193,68],{"class":285},[275,1195,1068],{"class":339},[275,1197,1071],{"class":332},[275,1199,1201],{"class":277,"line":1200},20,[275,1202,831],{"class":332},[275,1204,1206,1208,1210,1212,1214],{"class":277,"line":1205},21,[275,1207,1085],{"class":339},[275,1209,1088],{"class":281},[275,1211,491],{"class":332},[275,1213,494],{"class":339},[275,1215,343],{"class":332},[275,1217,1219,1221,1224,1226,1228,1230,1232,1235],{"class":277,"line":1218},22,[275,1220,599],{"class":339},[275,1222,1223],{"class":289}," alert",[275,1225,340],{"class":339},[275,1227,816],{"class":332},[275,1229,181],{"class":281},[275,1231,772],{"class":332},[275,1233,1234],{"class":285},"'alert'",[275,1236,826],{"class":332},[275,1238,1240,1242,1245,1247,1249,1251,1253,1256],{"class":277,"line":1239},23,[275,1241,836],{"class":281},[275,1243,1244],{"class":332},"(alert).",[275,1246,842],{"class":281},[275,1248,772],{"class":332},[275,1250,847],{"class":285},[275,1252,411],{"class":332},[275,1254,1255],{"class":285},"'assertive'",[275,1257,826],{"class":332},[275,1259,1261,1263,1265,1267,1269,1272],{"class":277,"line":1260},24,[275,1262,836],{"class":281},[275,1264,1244],{"class":332},[275,1266,883],{"class":281},[275,1268,772],{"class":332},[275,1270,1271],{"class":285},"'Connection lost'",[275,1273,826],{"class":332},[275,1275,1277],{"class":277,"line":1276},25,[275,1278,1123],{"class":332},[275,1280,1282],{"class":277,"line":1281},26,[275,1283,509],{"class":332},[166,1285,1286,1288,1289,1291,1292,1294],{},[195,1287,514],{}," ",[175,1290,177],{}," automatically polls the DOM at 50ms intervals. Avoid hardcoding ",[175,1293,522],{}," delays in tests to prevent flaky CI\u002FCD pipeline results.",[253,1296,1298],{"id":1297},"debugging-silent-failures-false-positives","Debugging Silent Failures & False Positives",[166,1300,1301],{},"Identify why automated tests pass but screen readers ignore or misinterpret announcements.",[261,1303,1305],{"id":1304},"debugging-workflow","Debugging Workflow",[1307,1308,1309,1319,1335,1343],"ol",{},[202,1310,1311,1314,1315,1318],{},[195,1312,1313],{},"Inspect DOM State:"," Use ",[175,1316,1317],{},"screen.debug()"," to print the current accessibility tree and verify node presence.",[202,1320,1321,1324,1325,411,1328,1331,1332,333],{},[195,1322,1323],{},"Check CSS Visibility:"," Confirm the element is not hidden via ",[175,1326,1327],{},"display: none",[175,1329,1330],{},"visibility: hidden",", or ",[175,1333,1334],{},"opacity: 0",[202,1336,1337,1340,1341,333],{},[195,1338,1339],{},"Validate Nesting:"," Ensure no interactive elements (buttons, links, inputs) are nested inside ",[175,1342,533],{},[202,1344,1345,1348],{},[195,1346,1347],{},"Cross-Reference Output:"," Pair automated assertions with actual NVDA\u002FVoiceOver output.",[166,1350,1351],{},[195,1352,1353],{},[175,1354,1355],{},"debug-live-region.test.jsx",[266,1357,1359],{"className":569,"code":1358,"language":571,"meta":271,"style":271},"import { render, screen, fireEvent, waitFor } from '@testing-library\u002Freact';\nimport NotificationSystem from '.\u002FNotificationSystem';\n\ntest('debugs live region visibility and structure', async () => {\n render(\u003CNotificationSystem \u002F>);\n \n fireEvent.click(screen.getByRole('button', { name: \u002Fshow alert\u002Fi }));\n \n await waitFor(() => {\n const region = screen.getByRole('alert');\n \n \u002F\u002F Verify computed styles and ARIA structure\n expect(region).toBeVisible();\n expect(region).toHaveAttribute('aria-live', 'assertive');\n expect(region).not.toHaveAttribute('aria-hidden', 'true');\n \n \u002F\u002F Output DOM tree for manual inspection if assertion fails\n \u002F\u002F screen.debug(region);\n });\n});\n",[175,1360,1361,1373,1387,1391,1410,1420,1424,1451,1455,1467,1485,1489,1494,1505,1523,1543,1547,1552,1557,1561],{"__ignoreMap":271},[275,1362,1363,1365,1367,1369,1371],{"class":277,"line":278},[275,1364,456],{"class":339},[275,1366,970],{"class":332},[275,1368,472],{"class":339},[275,1370,475],{"class":285},[275,1372,462],{"class":332},[275,1374,1375,1377,1380,1382,1385],{"class":277,"line":346},[275,1376,456],{"class":339},[275,1378,1379],{"class":332}," NotificationSystem ",[275,1381,472],{"class":339},[275,1383,1384],{"class":285}," '.\u002FNotificationSystem'",[275,1386,462],{"class":332},[275,1388,1389],{"class":277,"line":358},[275,1390,483],{"emptyLinePlaceholder":482},[275,1392,1393,1395,1397,1400,1402,1404,1406,1408],{"class":277,"line":370},[275,1394,769],{"class":281},[275,1396,772],{"class":332},[275,1398,1399],{"class":285},"'debugs live region visibility and structure'",[275,1401,411],{"class":332},[275,1403,1008],{"class":339},[275,1405,1011],{"class":332},[275,1407,494],{"class":339},[275,1409,343],{"class":332},[275,1411,1412,1414,1416,1418],{"class":277,"line":376},[275,1413,787],{"class":281},[275,1415,790],{"class":332},[275,1417,1162],{"class":289},[275,1419,804],{"class":332},[275,1421,1422],{"class":277,"line":396},[275,1423,831],{"class":332},[275,1425,1426,1428,1430,1432,1434,1436,1438,1440,1442,1445,1447,1449],{"class":277,"line":402},[275,1427,1040],{"class":332},[275,1429,1043],{"class":281},[275,1431,1046],{"class":332},[275,1433,181],{"class":281},[275,1435,772],{"class":332},[275,1437,1053],{"class":285},[275,1439,1056],{"class":332},[275,1441,1059],{"class":285},[275,1443,1444],{"class":1062},"show alert",[275,1446,68],{"class":285},[275,1448,1068],{"class":339},[275,1450,1071],{"class":332},[275,1452,1453],{"class":277,"line":429},[275,1454,831],{"class":332},[275,1456,1457,1459,1461,1463,1465],{"class":277,"line":669},[275,1458,1085],{"class":339},[275,1460,1088],{"class":281},[275,1462,491],{"class":332},[275,1464,494],{"class":339},[275,1466,343],{"class":332},[275,1468,1469,1471,1473,1475,1477,1479,1481,1483],{"class":277,"line":680},[275,1470,599],{"class":339},[275,1472,811],{"class":289},[275,1474,340],{"class":339},[275,1476,816],{"class":332},[275,1478,181],{"class":281},[275,1480,772],{"class":332},[275,1482,1234],{"class":285},[275,1484,826],{"class":332},[275,1486,1487],{"class":277,"line":686},[275,1488,831],{"class":332},[275,1490,1491],{"class":277,"line":701},[275,1492,1493],{"class":1034}," \u002F\u002F Verify computed styles and ARIA structure\n",[275,1495,1496,1498,1500,1503],{"class":277,"line":713},[275,1497,836],{"class":281},[275,1499,839],{"class":332},[275,1501,1502],{"class":281},"toBeVisible",[275,1504,504],{"class":332},[275,1506,1507,1509,1511,1513,1515,1517,1519,1521],{"class":277,"line":719},[275,1508,836],{"class":281},[275,1510,839],{"class":332},[275,1512,842],{"class":281},[275,1514,772],{"class":332},[275,1516,847],{"class":285},[275,1518,411],{"class":332},[275,1520,1255],{"class":285},[275,1522,826],{"class":332},[275,1524,1525,1527,1530,1532,1534,1537,1539,1541],{"class":277,"line":1130},[275,1526,836],{"class":281},[275,1528,1529],{"class":332},"(region).not.",[275,1531,842],{"class":281},[275,1533,772],{"class":332},[275,1535,1536],{"class":285},"'aria-hidden'",[275,1538,411],{"class":332},[275,1540,872],{"class":285},[275,1542,826],{"class":332},[275,1544,1545],{"class":277,"line":1135},[275,1546,831],{"class":332},[275,1548,1549],{"class":277,"line":1155},[275,1550,1551],{"class":1034}," \u002F\u002F Output DOM tree for manual inspection if assertion fails\n",[275,1553,1554],{"class":277,"line":1167},[275,1555,1556],{"class":1034}," \u002F\u002F screen.debug(region);\n",[275,1558,1559],{"class":277,"line":1172},[275,1560,1123],{"class":332},[275,1562,1563],{"class":277,"line":1200},[275,1564,509],{"class":332},[166,1566,1567,1569],{},[195,1568,514],{}," Automated tests verify DOM state, not speech synthesis output. Always pair Jest assertions with periodic manual validation to catch edge cases in assistive technology behavior.",[253,1571,1573],{"id":1572},"common-pitfalls","Common Pitfalls",[199,1575,1576,1585,1592,1599,1606],{},[202,1577,1578,1579,1581,1582,1584],{},"Testing ",[175,1580,185],{}," without ",[175,1583,177],{}," leads to false negatives due to async DOM updates.",[202,1586,1587,1588,1591],{},"Applying ",[175,1589,1590],{},"aria-hidden=\"true\""," to live regions breaks screen reader announcements.",[202,1593,1594,1595,1598],{},"Nesting interactive controls (buttons, links) inside ",[175,1596,1597],{},"role='status'"," causes focus traps.",[202,1600,1601,1602,1605],{},"Overusing ",[175,1603,1604],{},"aria-live='assertive'"," degrades user experience and causes test flakiness.",[202,1607,1608],{},"Relying solely on automated tests without verifying actual assistive technology output.",[253,1610,1612],{"id":1611},"frequently-asked-questions","Frequently Asked Questions",[166,1614,1615,1618,1619,1621,1622,534,1624,1626],{},[195,1616,1617],{},"Why do my Jest tests pass but screen readers don't announce the content?","\nJest only validates the DOM state. Ensure the element is visible, not hidden by CSS ",[175,1620,1327],{},", and uses valid ",[175,1623,902],{},[175,1625,185],{}," attributes. Cross-check with actual assistive technology to verify speech output.",[166,1628,1629,1632,1633,534,1636,1639],{},[195,1630,1631],{},"How do I test dynamically injected live regions in SPAs?","\nUse ",[175,1634,1635],{},"screen.findByRole()",[175,1637,1638],{},"waitFor()"," to poll for the element after route changes or async data fetches. Mock network requests to control timing and avoid race conditions in your test suite.",[166,1641,1642,1652,1653,1655],{},[195,1643,1644,1645,178,1648,1651],{},"Should I test ",[175,1646,1647],{},"aria-atomic",[175,1649,1650],{},"aria-relevant"," in my test suite?","\nYes, if your component relies on partial updates. Assert that the DOM reflects the expected substring or full replacement based on your configuration, and verify that ",[175,1654,1650],{}," matches your state management logic.",[1657,1658,1659],"style",{},"html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sA_wV, html code.shiki .sA_wV{--shiki-default:#032F62;--shiki-dark:#DBEDFF}",{"title":271,"searchDepth":346,"depth":346,"links":1661},[1662,1667,1670,1673,1676,1677],{"id":255,"depth":346,"text":256,"children":1663},[1664,1665,1666],{"id":263,"depth":358,"text":264},{"id":302,"depth":358,"text":303},{"id":435,"depth":358,"text":436},{"id":526,"depth":346,"text":527,"children":1668},[1669],{"id":541,"depth":358,"text":542},{"id":912,"depth":346,"text":913,"children":1671},[1672],{"id":925,"depth":358,"text":926},{"id":1297,"depth":346,"text":1298,"children":1674},[1675],{"id":1304,"depth":358,"text":1305},{"id":1572,"depth":346,"text":1573},{"id":1611,"depth":346,"text":1612},null,"Validate ARIA live region behavior with Jest and Testing Library to catch silent failures and announcement regressions before release.","md",{},false,{"title":55,"description":1679},"E94HHvls8fzzLyhSlILFW9froJj9tUsnL4SPtBmSdGc",[1686,1716,1717],{"title":5,"path":6,"stem":7,"children":1687},[1688,1689,1692,1695,1701,1707,1713],{"title":10,"path":6,"stem":11},{"title":13,"path":14,"stem":15,"children":1690},[1691],{"title":13,"path":14,"stem":15},{"title":19,"path":20,"stem":21,"children":1693},[1694],{"title":19,"path":20,"stem":21},{"title":25,"path":26,"stem":27,"children":1696},[1697,1698],{"title":25,"path":26,"stem":27},{"title":31,"path":32,"stem":33,"children":1699},[1700],{"title":31,"path":32,"stem":33},{"title":37,"path":38,"stem":39,"children":1702},[1703,1704],{"title":37,"path":38,"stem":39},{"title":43,"path":44,"stem":45,"children":1705},[1706],{"title":43,"path":44,"stem":45},{"title":49,"path":50,"stem":51,"children":1708},[1709,1710],{"title":49,"path":50,"stem":51},{"title":55,"path":56,"stem":57,"children":1711},[1712],{"title":55,"path":56,"stem":57},{"title":61,"path":62,"stem":63,"children":1714},[1715],{"title":61,"path":62,"stem":63},{"title":67,"path":68,"stem":69},{"title":71,"path":72,"stem":73,"children":1718},[1719,1720,1726,1732,1735,1744,1753],{"title":76,"path":72,"stem":77},{"title":79,"path":80,"stem":81,"children":1721},[1722,1723],{"title":79,"path":80,"stem":81},{"title":85,"path":86,"stem":87,"children":1724},[1725],{"title":85,"path":86,"stem":87},{"title":91,"path":92,"stem":93,"children":1727},[1728,1729],{"title":91,"path":92,"stem":93},{"title":97,"path":98,"stem":99,"children":1730},[1731],{"title":97,"path":98,"stem":99},{"title":103,"path":104,"stem":105,"children":1733},[1734],{"title":103,"path":104,"stem":105},{"title":109,"path":110,"stem":111,"children":1736},[1737,1738,1741],{"title":109,"path":110,"stem":111},{"title":115,"path":116,"stem":117,"children":1739},[1740],{"title":115,"path":116,"stem":117},{"title":121,"path":122,"stem":123,"children":1742},[1743],{"title":121,"path":122,"stem":123},{"title":127,"path":128,"stem":129,"children":1745},[1746,1747,1750],{"title":127,"path":128,"stem":129},{"title":133,"path":134,"stem":135,"children":1748},[1749],{"title":133,"path":134,"stem":135},{"title":139,"path":140,"stem":141,"children":1751},[1752],{"title":139,"path":140,"stem":141},{"title":145,"path":146,"stem":147,"children":1754},[1755,1756],{"title":145,"path":146,"stem":147},{"title":151,"path":152,"stem":153,"children":1757},[1758],{"title":151,"path":152,"stem":153},1778094796356]