STCOM-1532 - Add content-visibility usage to accordion

[JohnC-80]

This is pending more work with React's own optimization and improving the experience of opening an accordion containing heavy components.

• functional accordion status
• content-visibility: hidden on closed accordion (any and all browser-calculation/layout within won't happen (unless JS demands))
• placeholder for lengthy content renders on open.

Draft for now.

[github-actions]

Bigtest Unit Test Results

    1 files  ±0      1 suites  ±0   47s ⏱️ +22s
1 634 tests  - 3  1 614 ✅  - 15  8 💤 ±0  12 ❌ +12 
1 638 runs  ±0  1 618 ✅  - 12  8 💤 ±0  12 ❌ +12 

For more details on these failures, see this check.

Results for commit 95b5ebb. ± Comparison against base commit 9f214e6.

This pull request removes 1637 and adds 1634 tests. Note that renamed tests count towards both.

Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet contents ready for interaction following open ‑ Accordion - as part of an AccordionSet contents ready for interaction following open Child element was filled out successfully
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: first accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: first accordion First accordion is in focus
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: last accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: last accordion Last accordion is in focus
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: next accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: next accordion second accordion is in focus
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: previous accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: previous accordion first accordion is in focus
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet ‑ Accordion - as part of an AccordionSet has a button
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet ‑ Accordion - as part of an AccordionSet has no axe errors
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet ‑ Accordion - as part of an AccordionSet should call onRegisterAccordion callback
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - updating state of parent component opening the closed accordion changing the text value/parent state ‑ Accordion - updating state of parent component opening the closed accordion changing the text value/parent state renders second accordion as open
Chrome_150_0_0_0_(Linux_0_0_0).Accordion - updating state of parent component opening the closed accordion changing the text value/parent state ‑ Accordion - updating state of parent component opening the closed accordion changing the text value/parent state renders state value in textField
…

Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet contents ready for interaction following open ‑ Accordion - as part of an AccordionSet contents ready for interaction following open Child element was filled out successfully
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: first accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: first accordion First accordion is in focus
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: last accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: last accordion Last accordion is in focus
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: next accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: next accordion second accordion is in focus
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet keyboard navigation: previous accordion ‑ Accordion - as part of an AccordionSet keyboard navigation: previous accordion first accordion is in focus
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet ‑ Accordion - as part of an AccordionSet has a button
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet ‑ Accordion - as part of an AccordionSet has no axe errors
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - as part of an AccordionSet ‑ Accordion - as part of an AccordionSet should call onRegisterAccordion callback
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - updating state of parent component opening the closed accordion changing the text value/parent state ‑ Accordion - updating state of parent component opening the closed accordion changing the text value/parent state renders second accordion as open
Chrome_151_0_0_0_(Linux_0_0_0).Accordion - updating state of parent component opening the closed accordion changing the text value/parent state ‑ Accordion - updating state of parent component opening the closed accordion changing the text value/parent state renders state value in textField
…

This pull request removes 8 skipped tests and adds 8 skipped tests. Note that renamed tests count towards both.

Chrome_150_0_0_0_(Linux_0_0_0).Datepicker defaultOutputFormatter converts non-Latn input to Latn-output ‑ Datepicker defaultOutputFormatter converts non-Latn input to Latn-output returns a Latn (Arabic, 0-9) string
Chrome_150_0_0_0_(Linux_0_0_0).Datepicker with Redux Form integration exclude prop selecting excluded date navigation on excluded date ‑ Datepicker with Redux Form integration exclude prop selecting excluded date navigation on excluded date changed cursor to April 2, 2018
Chrome_150_0_0_0_(Linux_0_0_0).Editor rendering a basic Editor ‑ Editor rendering a basic Editor has no axe errors. - Editor
Chrome_150_0_0_0_(Linux_0_0_0).Popover If the legacy component API is used When the toggle is clicked again ‑ Popover If the legacy component API is used When the toggle is clicked again Hides the popover overlay
Chrome_150_0_0_0_(Linux_0_0_0).Popover If the legacy component API is used ‑ Popover If the legacy component API is used Renders the legacy popover and opens the overlay when the toggle is clicked
Chrome_150_0_0_0_(Linux_0_0_0).childrenOf propType validator Passing a type that isn't allowed ‑ childrenOf propType validator Passing a type that isn't allowed triggers a propType error
Chrome_150_0_0_0_(Linux_0_0_0).childrenOf propType validator Passing a type that isn't allowed ‑ childrenOf propType validator Passing a type that isn't allowed triggers no proptype error
Chrome_150_0_0_0_(Linux_0_0_0).childrenOf propType validator not providing a required prop ‑ childrenOf propType validator not providing a required prop triggers a required propType error

Chrome_151_0_0_0_(Linux_0_0_0).Datepicker defaultOutputFormatter converts non-Latn input to Latn-output ‑ Datepicker defaultOutputFormatter converts non-Latn input to Latn-output returns a Latn (Arabic, 0-9) string
Chrome_151_0_0_0_(Linux_0_0_0).Datepicker with Redux Form integration exclude prop selecting excluded date navigation on excluded date ‑ Datepicker with Redux Form integration exclude prop selecting excluded date navigation on excluded date changed cursor to April 2, 2018
Chrome_151_0_0_0_(Linux_0_0_0).Editor rendering a basic Editor ‑ Editor rendering a basic Editor has no axe errors. - Editor
Chrome_151_0_0_0_(Linux_0_0_0).Popover If the legacy component API is used When the toggle is clicked again ‑ Popover If the legacy component API is used When the toggle is clicked again Hides the popover overlay
Chrome_151_0_0_0_(Linux_0_0_0).Popover If the legacy component API is used ‑ Popover If the legacy component API is used Renders the legacy popover and opens the overlay when the toggle is clicked
Chrome_151_0_0_0_(Linux_0_0_0).childrenOf propType validator Passing a type that isn't allowed ‑ childrenOf propType validator Passing a type that isn't allowed triggers a propType error
Chrome_151_0_0_0_(Linux_0_0_0).childrenOf propType validator Passing a type that isn't allowed ‑ childrenOf propType validator Passing a type that isn't allowed triggers no proptype error
Chrome_151_0_0_0_(Linux_0_0_0).childrenOf propType validator not providing a required prop ‑ childrenOf propType validator not providing a required prop triggers a required propType error

[sonarqubecloud]

Quality Gate passed

Issues
6 New issues
0 Accepted issues

Measures
0 Security Hotspots
97.8% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud