From 5ad952f0fea7789af4dd5c649ba411f9db59bfe3 Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 22 Feb 2023 21:00:21 -0500 Subject: [PATCH 1/8] chore: explicitly export withFluentProvider decorator from react-storybook-addon --- .../react-storybook-addon/etc/react-storybook-addon.api.md | 3 +++ packages/react-components/react-storybook-addon/src/index.ts | 1 + 2 files changed, 4 insertions(+) diff --git a/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md b/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md index 9785ca69a1eb52..490d266b20fda5 100644 --- a/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md +++ b/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md @@ -76,6 +76,9 @@ export const themes: readonly [{ readonly theme: Theme; }]; +// @public (undocumented) +export const withFluentProvider: (StoryFn: () => JSX.Element, context: FluentStoryContext) => JSX.Element; + // (No @packageDocumentation comment for this package) ``` diff --git a/packages/react-components/react-storybook-addon/src/index.ts b/packages/react-components/react-storybook-addon/src/index.ts index 7e02b8967b3eaa..896c36bc54a6c1 100644 --- a/packages/react-components/react-storybook-addon/src/index.ts +++ b/packages/react-components/react-storybook-addon/src/index.ts @@ -3,3 +3,4 @@ export type { ThemeIds } from './theme'; export { themes } from './theme'; export { THEME_ID } from './constants'; export { parameters } from './hooks'; +export { withFluentProvider } from './decorators/withFluentProvider'; From 31985e8895541ad759145e1cc905b705276ad341 Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 22 Feb 2023 21:25:48 -0500 Subject: [PATCH 2/8] chore: explicitly use withFluentProvider in vr-tests-react-components package --- apps/vr-tests-react-components/.storybook/preview.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/apps/vr-tests-react-components/.storybook/preview.js b/apps/vr-tests-react-components/.storybook/preview.js index 32dfd46958c75d..7cfff3551802f6 100644 --- a/apps/vr-tests-react-components/.storybook/preview.js +++ b/apps/vr-tests-react-components/.storybook/preview.js @@ -4,6 +4,7 @@ import * as React from 'react'; import { setAddon } from '@storybook/react'; import { webLightTheme, teamsHighContrastTheme, webDarkTheme } from '@fluentui/react-theme'; import { FluentProvider } from '@fluentui/react-provider'; +import { withFluentProvider } from '@fluentui/react-storybook-addon'; /** * @deprecated https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-setaddon @@ -69,3 +70,6 @@ setAddon({ /** @type {import("@fluentui/react-storybook-addon").FluentParameters} */ export const parameters = { layout: 'none', mode: 'vr-test' }; + +/** @type {((StoryFn: () => JSX.Element, context: import('@fluentui/react-storybook-addon').FluentStoryContext) => JSX.Element)[]} */ +export const decorators = [withFluentProvider]; From 4e3fbd982f1ae53fd294543d8e605d0417569556 Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 22 Feb 2023 21:35:58 -0500 Subject: [PATCH 3/8] chore: pin puppeteer version to 19 to force flamegrill to use newer version of chrome --- package.json | 3 ++- yarn.lock | 46 +++++----------------------------------------- 2 files changed, 7 insertions(+), 42 deletions(-) diff --git a/package.json b/package.json index 390e046a03636b..c28f588dbf4cc3 100644 --- a/package.json +++ b/package.json @@ -378,7 +378,8 @@ "jest-axe/axe-core": "4.4.3", "eslint": "7.25.0", "@mdx-js/loader/loader-utils": "~2.0.4", - "swc-loader": "^0.2.3" + "swc-loader": "^0.2.3", + "puppeteer": "19.6.0" }, "syncpack": { "prod": true, diff --git a/yarn.lock b/yarn.lock index 96a6fc7aaec098..6d0e6a6ae2eaf6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7343,11 +7343,6 @@ async-each@^1.0.1: resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.3.tgz#b727dbf87d7651602f06f4d4ac387f47d91b0cbf" integrity sha512-z/WhQ5FPySLdvREByI2vZiTWwCnF0moMJ1hK9YQwDTHKh6I7/uSckMetoRGb5UBZPC1z0jlw+n/XCgjeH7y1AQ== -async-limiter@~1.0.0: - version "1.0.1" - resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.1.tgz#dd379e94f0db8310b08291f9d64c3209766617fd" - integrity sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ== - async-retry@1.2.3: version "1.2.3" resolved "https://registry.yarnpkg.com/async-retry/-/async-retry-1.2.3.tgz#a6521f338358d322b1a0012b79030c6f411d1ce0" @@ -12309,16 +12304,6 @@ extract-zip@2.0.1: optionalDependencies: "@types/yauzl" "^2.9.1" -extract-zip@^1.6.6: - version "1.7.0" - resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.7.0.tgz#556cc3ae9df7f452c493a0cfb51cc30277940927" - integrity sha512-xoh5G1W/PB0/27lXgMQyIhP5DSY/LhoCsOyZgb+6iMmRtCwVBo55uKaMoEYrDCKQhWvqEip5ZPKAc6eFNyf/MA== - dependencies: - concat-stream "^1.6.2" - debug "^2.6.9" - mkdirp "^0.5.4" - yauzl "^2.10.0" - extsprintf@1.3.0, extsprintf@^1.2.0: version "1.3.0" resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05" @@ -18141,7 +18126,7 @@ mime@1.6.0: resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1" integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg== -mime@^2.0.3, mime@^2.3.1, mime@^2.4.4, mime@^2.5.2: +mime@^2.3.1, mime@^2.4.4, mime@^2.5.2: version "2.6.0" resolved "https://registry.yarnpkg.com/mime/-/mime-2.6.0.tgz#a2a682a95cd4d0cb1d6257e28f83da7e35800367" integrity sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg== @@ -18369,7 +18354,7 @@ mkdirp-infer-owner@^2.0.0: infer-owner "^1.0.4" mkdirp "^1.0.3" -mkdirp@0.5.5, mkdirp@0.5.x, "mkdirp@>=0.5 0", mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.4, mkdirp@^0.5.5: +mkdirp@0.5.5, mkdirp@0.5.x, "mkdirp@>=0.5 0", mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.5: version "0.5.5" resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def" integrity sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ== @@ -20544,7 +20529,7 @@ process@^0.11.10: resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182" integrity sha1-czIwDoQBYb2j5podHZGn1LwW8YI= -progress@2.0.3, progress@^2.0.0, progress@^2.0.1, progress@^2.0.3: +progress@2.0.3, progress@^2.0.0, progress@^2.0.3: version "2.0.3" resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8" integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA== @@ -20659,7 +20644,7 @@ proxy-from-env@1.0.0: resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.0.0.tgz#33c50398f70ea7eb96d21f7b817630a55791c7ee" integrity sha1-M8UDmPcOp+uW0h97gXYwpVeRx+4= -proxy-from-env@1.1.0, proxy-from-env@^1.0.0: +proxy-from-env@1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2" integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg== @@ -20742,7 +20727,7 @@ puppeteer-core@19.6.0: unbzip2-stream "1.4.3" ws "8.11.0" -puppeteer@19.6.0: +puppeteer@19.6.0, puppeteer@^1.13.0: version "19.6.0" resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-19.6.0.tgz#89a0bfa7da3db12b40ff9fe6c48cbc0eb149e03b" integrity sha512-KpRjn/bosTWe8xOQ/F5J1UmQ4inR77ADddn8G6MqMPp/y9Tl+7EycXgrjO0/3i/OQfHi5bsvkTKXRkm0ieo/ew== @@ -20753,20 +20738,6 @@ puppeteer@19.6.0: proxy-from-env "1.1.0" puppeteer-core "19.6.0" -puppeteer@^1.13.0: - version "1.17.0" - resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-1.17.0.tgz#371957d227a2f450fa74b78e78a2dadb2be7f14f" - integrity sha512-3EXZSximCzxuVKpIHtyec8Wm2dWZn1fc5tQi34qWfiUgubEVYHjUvr0GOJojqf3mifI6oyKnCdrGxaOI+lWReA== - dependencies: - debug "^4.1.0" - extract-zip "^1.6.6" - https-proxy-agent "^2.2.1" - mime "^2.0.3" - progress "^2.0.1" - proxy-from-env "^1.0.0" - rimraf "^2.6.1" - ws "^6.1.0" - q@^1.5.1: version "1.5.1" resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" @@ -25940,13 +25911,6 @@ ws@8.11.0, ws@>=8.7.0, ws@^8.2.3, ws@^8.4.2: resolved "https://registry.yarnpkg.com/ws/-/ws-8.11.0.tgz#6a0d36b8edfd9f96d8b25683db2f8d7de6e8e143" integrity sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg== -ws@^6.1.0: - version "6.2.1" - resolved "https://registry.yarnpkg.com/ws/-/ws-6.2.1.tgz#442fdf0a47ed64f59b6a5d8ff130f4748ed524fb" - integrity sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA== - dependencies: - async-limiter "~1.0.0" - ws@^7.2.0, ws@^7.3.1, ws@^7.4.6: version "7.5.6" resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.6.tgz#e59fc509fb15ddfb65487ee9765c5a51dec5fe7b" From c6c4afa67ba8e6935fb3262e9e0b739708fbfabd Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 22 Feb 2023 21:41:23 -0500 Subject: [PATCH 4/8] temp fix: don't run perf test on TeachingBubble --- apps/perf-test/tasks/perf-test.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/apps/perf-test/tasks/perf-test.ts b/apps/perf-test/tasks/perf-test.ts index ffe9d0c3364731..8ece8d87fb919e 100644 --- a/apps/perf-test/tasks/perf-test.ts +++ b/apps/perf-test/tasks/perf-test.ts @@ -141,7 +141,9 @@ export async function getPerfRegressions() { } }); - const scenarioList = scenariosArg.length > 0 ? scenariosArg : scenariosAvailable; + let scenarioList = scenariosArg.length > 0 ? scenariosArg : scenariosAvailable; + // TeachingBubble perf test is hanging after puppeteer pin to v19. Disabling for now to unblock SWC migration work. + scenarioList = scenarioList.filter(scenario => scenario !== 'TeachingBubble'); const scenarios: Scenarios = {}; const scenarioSettings: ScenarioSetting = {}; From bb48ad42578986a5e42ba1d269d03ccecc432997 Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 1 Mar 2023 09:07:13 -0500 Subject: [PATCH 5/8] Revert "chore: explicitly export withFluentProvider decorator from react-storybook-addon" This reverts commit 5ad952f0fea7789af4dd5c649ba411f9db59bfe3. --- .../react-storybook-addon/etc/react-storybook-addon.api.md | 3 --- packages/react-components/react-storybook-addon/src/index.ts | 1 - 2 files changed, 4 deletions(-) diff --git a/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md b/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md index 490d266b20fda5..9785ca69a1eb52 100644 --- a/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md +++ b/packages/react-components/react-storybook-addon/etc/react-storybook-addon.api.md @@ -76,9 +76,6 @@ export const themes: readonly [{ readonly theme: Theme; }]; -// @public (undocumented) -export const withFluentProvider: (StoryFn: () => JSX.Element, context: FluentStoryContext) => JSX.Element; - // (No @packageDocumentation comment for this package) ``` diff --git a/packages/react-components/react-storybook-addon/src/index.ts b/packages/react-components/react-storybook-addon/src/index.ts index 896c36bc54a6c1..7e02b8967b3eaa 100644 --- a/packages/react-components/react-storybook-addon/src/index.ts +++ b/packages/react-components/react-storybook-addon/src/index.ts @@ -3,4 +3,3 @@ export type { ThemeIds } from './theme'; export { themes } from './theme'; export { THEME_ID } from './constants'; export { parameters } from './hooks'; -export { withFluentProvider } from './decorators/withFluentProvider'; From a0d862234586af81eced15f82a2bde8ddc0818cb Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 1 Mar 2023 09:07:28 -0500 Subject: [PATCH 6/8] Revert "chore: explicitly use withFluentProvider in vr-tests-react-components package" This reverts commit 31985e8895541ad759145e1cc905b705276ad341. --- apps/vr-tests-react-components/.storybook/preview.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/apps/vr-tests-react-components/.storybook/preview.js b/apps/vr-tests-react-components/.storybook/preview.js index 7cfff3551802f6..32dfd46958c75d 100644 --- a/apps/vr-tests-react-components/.storybook/preview.js +++ b/apps/vr-tests-react-components/.storybook/preview.js @@ -4,7 +4,6 @@ import * as React from 'react'; import { setAddon } from '@storybook/react'; import { webLightTheme, teamsHighContrastTheme, webDarkTheme } from '@fluentui/react-theme'; import { FluentProvider } from '@fluentui/react-provider'; -import { withFluentProvider } from '@fluentui/react-storybook-addon'; /** * @deprecated https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-setaddon @@ -70,6 +69,3 @@ setAddon({ /** @type {import("@fluentui/react-storybook-addon").FluentParameters} */ export const parameters = { layout: 'none', mode: 'vr-test' }; - -/** @type {((StoryFn: () => JSX.Element, context: import('@fluentui/react-storybook-addon').FluentStoryContext) => JSX.Element)[]} */ -export const decorators = [withFluentProvider]; From 03cd8c9ad2073a9fc1c6b1e0755aea03b8d2e301 Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Wed, 1 Mar 2023 09:15:45 -0500 Subject: [PATCH 7/8] remove unintended changes caused by linting after merge with master --- .../src/components/DonutChart/DonutChart.base.tsx | 2 +- .../src/components/DonutChart/DonutChart.styles.ts | 4 ++-- .../src/components/DonutChart/DonutChart.test.tsx | 2 +- .../GroupedVerticalBarChart/GroupedVerticalBarChart.base.tsx | 2 +- .../src/components/VerticalBarChart/VerticalBarChart.base.tsx | 4 ++-- .../VerticalStackedBarChart/VerticalStackedBarChart.base.tsx | 4 ++-- 6 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/react-charting/src/components/DonutChart/DonutChart.base.tsx b/packages/react-charting/src/components/DonutChart/DonutChart.base.tsx index d20d7bbf490da1..d59615b66e97e2 100644 --- a/packages/react-charting/src/components/DonutChart/DonutChart.base.tsx +++ b/packages/react-charting/src/components/DonutChart/DonutChart.base.tsx @@ -203,7 +203,7 @@ export class DonutChartBase extends React.Component { if (this.state.selectedLegend === point.legend) { this.setState({ selectedLegend: '' }); diff --git a/packages/react-charting/src/components/DonutChart/DonutChart.styles.ts b/packages/react-charting/src/components/DonutChart/DonutChart.styles.ts index 9bb722dcb2649b..14abedfd6e864d 100644 --- a/packages/react-charting/src/components/DonutChart/DonutChart.styles.ts +++ b/packages/react-charting/src/components/DonutChart/DonutChart.styles.ts @@ -16,8 +16,8 @@ export const getStyles = (props: IDonutChartStyleProps): IDonutChartStyles => { className, ], chart: { - width, - height, + width: width, + height: height, boxSizing: 'content-box', overflow: 'visible', alignmentAdjust: 'center', diff --git a/packages/react-charting/src/components/DonutChart/DonutChart.test.tsx b/packages/react-charting/src/components/DonutChart/DonutChart.test.tsx index 2ddec1c3018473..d6ca50995241cd 100644 --- a/packages/react-charting/src/components/DonutChart/DonutChart.test.tsx +++ b/packages/react-charting/src/components/DonutChart/DonutChart.test.tsx @@ -37,7 +37,7 @@ const points: IChartDataPoint[] = [ const chartTitle = 'Stacked Bar chart example'; const chartPoints: IChartProps = { - chartTitle, + chartTitle: chartTitle, chartData: points, }; diff --git a/packages/react-charting/src/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.tsx b/packages/react-charting/src/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.tsx index b90fd7dcea823e..ab8458b0145141 100644 --- a/packages/react-charting/src/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.tsx +++ b/packages/react-charting/src/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.tsx @@ -487,7 +487,7 @@ export class GroupedVerticalBarChartBase extends React.Component< } const legend: ILegend = { title: point.legend, - color, + color: color, action: () => { this._onLegendClick(point.legend); }, diff --git a/packages/react-charting/src/components/VerticalBarChart/VerticalBarChart.base.tsx b/packages/react-charting/src/components/VerticalBarChart/VerticalBarChart.base.tsx index 60c0d76731924c..d375c675ac3768 100644 --- a/packages/react-charting/src/components/VerticalBarChart/VerticalBarChart.base.tsx +++ b/packages/react-charting/src/components/VerticalBarChart/VerticalBarChart.base.tsx @@ -494,7 +494,7 @@ export class VerticalBarChartBase extends React.Component { this._onLegendClick(point.legend!); }, diff --git a/packages/react-charting/src/components/VerticalStackedBarChart/VerticalStackedBarChart.base.tsx b/packages/react-charting/src/components/VerticalStackedBarChart/VerticalStackedBarChart.base.tsx index cdc166d1cc2de5..fd6d11de38ae0a 100644 --- a/packages/react-charting/src/components/VerticalStackedBarChart/VerticalStackedBarChart.base.tsx +++ b/packages/react-charting/src/components/VerticalStackedBarChart/VerticalStackedBarChart.base.tsx @@ -502,7 +502,7 @@ export class VerticalStackedBarChartBase extends React.Component< const legend: ILegend = { title: point.legend, - color, + color: color, action: () => { this._onLegendClick(point.legend); }, @@ -741,7 +741,7 @@ export class VerticalStackedBarChartBase extends React.Component< const shouldHighlight = this._legendHighlighted(point.legend) || this._noLegendHighlighted() ? true : false; this._classNames = getClassNames(this.props.styles!, { theme: this.props.theme!, - shouldHighlight, + shouldHighlight: shouldHighlight, href: this.props.href, }); const rectFocusProps = !shouldFocusWholeStack && { From 04bdf30ce7c58fffb4499232a7b7539dd0c0e150 Mon Sep 17 00:00:00 2001 From: Tristan Watanabe Date: Thu, 9 Mar 2023 12:56:58 -0500 Subject: [PATCH 8/8] chore: use rollup v2.68.0 to address commonjs rollup plugin error that occurs after swc tranpilation migration --- packages/fluentui/projects-test/src/rollup.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/fluentui/projects-test/src/rollup.ts b/packages/fluentui/projects-test/src/rollup.ts index 567ab5d871950a..db992e4e96be7a 100644 --- a/packages/fluentui/projects-test/src/rollup.ts +++ b/packages/fluentui/projects-test/src/rollup.ts @@ -20,7 +20,7 @@ export async function rollup() { logger('STEP 1. Add dependencies to test project'); - const rollupVersion = '2.7.3'; + const rollupVersion = '2.68.0'; const dependencies = [ `rollup@${rollupVersion}`, 'rollup-plugin-replace',