This feature is to bind V8 theme for existing Fluent ui components and V9 for new Fluent Ui components (next feature).
So as part of Fluent UI V9 migration, we will not migrate entire components from V8 to V9, as we are following migration in incremental approach as V9 is also in development from fluent team.
So to accommodate V8 and V9 components UI designs, we created V8 and V9 theme wrapped in root. So that V8 components will pickup v8 theme and V9 components (NEXT FEATURE) will pickup V9 theme.
This feature also covers, high contrast themes for both v8 and v9 themes.
Updated to latest V9 Fluent version @fluentui/react-components to 9.x.x
Removed loadTheme from V8, as we are using theme as Wrapper instead of calling function.
Created custom V9 Dark theme to accommodate high contrast option.
Updated below test cases :
src/tests/end-to-end/tests/details-view/headings.test.ts
src/tests/end-to-end/tests/details-view/reflow-ui.test.ts
During e2e test cases encountered below errors for above 2 files:
So from investigation, we can observe its false positive for high contrast, and there is existing issues reported for transparent background.
https://github.com/dequelabs/axe-core/issues/3464
And the issue we are seeing is with Assessment link in high contrast mode, inspecting this link in high contrast mode, we can see background is in transparent.
Removed loadTheme test case, as we are not using loadTheme anymore.
Motivation
To keep AI Web to accommodate both V8 and V9 components with respective theme.
Context
Pull request checklist
[ ] Addresses an existing issue: #0000
[x] Ran yarn fastpass
[x] Added/updated relevant unit test(s) (and ran yarn test)
[x] Verified code coverage for the changes made. Check coverage report at: <rootDir>/test-results/unit/coverage
[x] PR title AND final merge commit title both start with a semantic tag (fix:, chore:, feat(feature-name):, refactor:). See CONTRIBUTING.md.
[x] (UI changes only) Added screenshots/GIFs to description above
[ ] (UI changes only) Verified usability with NVDA/JAWS
Details
This feature is to bind V8 theme for existing Fluent ui components and V9 for new Fluent Ui components (next feature).
Updated below test cases : src/tests/end-to-end/tests/details-view/headings.test.ts src/tests/end-to-end/tests/details-view/reflow-ui.test.ts
During e2e test cases encountered below errors for above 2 files:
So from investigation, we can observe its false positive for high contrast, and there is existing issues reported for transparent background. https://github.com/dequelabs/axe-core/issues/3464 And the issue we are seeing is with Assessment link in high contrast mode, inspecting this link in high contrast mode, we can see background is in transparent.
Motivation
To keep AI Web to accommodate both V8 and V9 components with respective theme.
Context
Pull request checklist
yarn fastpass
yarn test
)<rootDir>/test-results/unit/coverage
fix:
,chore:
,feat(feature-name):
,refactor:
). SeeCONTRIBUTING.md
.