Update mui #395

mdfleury-wbd · 2024-12-18T16:03:22Z

Updating Material UI to latest version

How Has This Been Tested?

Tested in nonprod

Types of changes

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to change)
Documentation change

Checklist

My code follows conforms to the coding standards.
My change requires a change to the documentation.
I have updated the documentation accordingly.
I have added tests to cover my changes.
All new and existing tests passed.

Pic

mdfleury-wbd · 2025-01-17T18:33:57Z

ui/package.json

@@ -31,7 +30,6 @@
    "axios": "^1.7.9",
    "formik": "^2.4.6",
    "formik-mui": "5.0.0-alpha.0",
-    "formik-mui-lab": "^1.0.0",


Removing some unused libraries

mdfleury-wbd · 2025-01-17T18:35:31Z

ui/package.json

@@ -52,6 +50,7 @@
    "yup": "^1.5.0"
  },
  "devDependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",


npm gave me a warning that this was needed now.

mdfleury-wbd · 2025-01-17T18:36:17Z

ui/src/App.tsx

-				<Router>
+				<Router
+					future={{
+						v7_startTransition: true,


These were recommended for react router during testing.

mdfleury-wbd · 2025-01-17T18:39:38Z

ui/src/pages/MainPage.tsx

@@ -1321,7 +1321,7 @@ export const PluginsSelector = ({
 						id={`scan-features-${name}-header`}
 						className={classes.pluginsSelectorAccordionSummary}
 					>
-						<Typography className={classes.heading}>
+						<Typography component="div" className={classes.heading}>


Fixes a validateDOMNesting warning in React

ZoogieZork

Getting this error when I resize the window to be smaller.

Running locally with npm start:
http://localhost:3000/?repo=test-vs&submitContext=view&vcsOrg=goodVcs%2FgoodOrg

Uncaught runtime errors:

ResizeObserver loop completed with undelivered notifications.
    at handleError (http://localhost:3000/static/js/bundle.js:120792:58)
    at http://localhost:3000/static/js/bundle.js:120811:7

ZoogieZork

(not a blocker)

Getting a unit-test failure, but it appears to be a bug in Jest.

Here's what I'm getting when I run: npx react-scripts test --watchAll=false --env=jsdom --testPathPattern SearchPageMeta:

 RUNS  src/custom/__tests__/SearchPageMeta.test.tsx
/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:1564
        return doc.body;
                   ^

TypeError: Cannot read properties of null (reading 'body')
    at getActiveElement (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:1731:16)
    at getActiveElementDeep (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:8443:17)
    at getSelectionInformation (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:8476:21)
    at prepareForCommit (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:10912:26)
    at commitBeforeMutationEffects (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:22980:27)
    at commitRootImpl (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:26840:45)
    at commitRoot (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:26721:5)
    at finishConcurrentRender (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:26020:9)
    at callback (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:25848:7)
    at flushActQueue (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react/cjs/react.development.js:2667:24)
    at recursivelyFlushAsyncActWork (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react/cjs/react.development.js:2633:9)
    at Immediate.<anonymous> (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react/cjs/react.development.js:2641:13)
    at processImmediate (node:internal/timers:478:21)

jestjs/jest#12670 suggests that this is a Jest/jsdom issue, which is fixed in Jest 29.5.0.

Since the unit tests are completing successfully in CI, not treating this as a blocker.

mdfleury-wbd · 2025-01-23T12:23:48Z

(not a blocker)

Getting a unit-test failure, but it appears to be a bug in Jest.

Here's what I'm getting when I run: npx react-scripts test --watchAll=false --env=jsdom --testPathPattern SearchPageMeta:

 RUNS  src/custom/__tests__/SearchPageMeta.test.tsx
/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:1564
        return doc.body;
                   ^

TypeError: Cannot read properties of null (reading 'body')
    at getActiveElement (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:1731:16)
    at getActiveElementDeep (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:8443:17)
    at getSelectionInformation (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:8476:21)
    at prepareForCommit (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:10912:26)
    at commitBeforeMutationEffects (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:22980:27)
    at commitRootImpl (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:26840:45)
    at commitRoot (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:26721:5)
    at finishConcurrentRender (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:26020:9)
    at callback (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react-dom/cjs/react-dom.development.js:25848:7)
    at flushActQueue (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react/cjs/react.development.js:2667:24)
    at recursivelyFlushAsyncActWork (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react/cjs/react.development.js:2633:9)
    at Immediate.<anonymous> (/home/zoogie/gitroot/artemis-ui/dev/node_modules/react/cjs/react.development.js:2641:13)
    at processImmediate (node:internal/timers:478:21)

jestjs/jest#12670 suggests that this is a Jest/jsdom issue, which is fixed in Jest 29.5.0.

Since the unit tests are completing successfully in CI, not treating this as a blocker.

I spent time digging into this and found that it can sometimes be masking another error, but sometimes not. I'll try running the tests again and see if I can reproduce it. That's the same file it was happening to me in.

mdfleury-wbd · 2025-01-23T12:24:47Z

Getting this error when I resize the window to be smaller.

Running locally with npm start: http://localhost:3000/?repo=test-vs&submitContext=view&vcsOrg=goodVcs%2FgoodOrg
Uncaught runtime errors:

ResizeObserver loop completed with undelivered notifications.
    at handleError (http://localhost:3000/static/js/bundle.js:120792:58)
    at http://localhost:3000/static/js/bundle.js:120811:7

I cannot reproduce this. I can't find any code where we're using ResizeObserver directly.

mdfleury-wbd · 2025-01-23T12:42:03Z

I ran tests again locally and got some errors about validateDOMNesting and keys not being passed into props properly. Going to take a look at those. No doc.body errors though.

ZoogieZork · 2025-01-23T17:01:39Z

Getting this error when I resize the window to be smaller.

Running locally with npm start: http://localhost:3000?repo=test-vs&submitContext=view&vcsOrg=goodVcs%2FgoodOrg
Uncaught runtime errors:

ResizeObserver loop completed with undelivered notifications.
    at handleError (http://localhost:3000/static/js/bundle.js:120792:58)
    at http://localhost:3000/static/js/bundle.js:120811:7

Related: webpack/webpack-dev-server#4812 & webpack/webpack-dev-server#4771

From what I can tell, this is a benign warning that can be ignored. I've added a backlog item to filter out the warning from the WDS overlay (after we've ejected from CRA).

ZoogieZork

Since the flaky test suite seems to running fine in CI, let's go ahead and get this merged. We can dig into the issues with that test suite later.

The code changes look good to me, and all of my manual UI testing has completed successfully (aside from the the benign ResizeObserver warnings).

mdfleury-wbd added 12 commits December 17, 2024 13:26

updating mui

4ee9879

upgrading grids

ac36fea

fixing datepickers

14debc9

updating tests

6c3ac25

Merge remote-tracking branch 'origin/main' into update-mui

6b91010

updating lock

ef4cdf3

fixing imports

a65444c

fixing tests

4a1ff4b

fixing more tests

ef64b5f

fixing more tests

0f5db5f

fixing search tests

4c061d3

fixing search page tests

a32c401

mdfleury-wbd marked this pull request as ready for review January 17, 2025 18:31

mdfleury-wbd requested a review from a team as a code owner January 17, 2025 18:31

mdfleury-wbd commented Jan 17, 2025

View reviewed changes

adding back tests

174168c

mdfleury-wbd commented Jan 17, 2025

View reviewed changes

ZoogieZork reviewed Jan 22, 2025

View reviewed changes

ZoogieZork approved these changes Jan 23, 2025

View reviewed changes

mdfleury-wbd merged commit fb1cfb5 into main Jan 23, 2025
6 checks passed

mdfleury-wbd deleted the update-mui branch January 23, 2025 18:11

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update mui #395

Update mui #395

mdfleury-wbd commented Dec 18, 2024 •

edited

Loading

mdfleury-wbd Jan 17, 2025

mdfleury-wbd Jan 17, 2025

mdfleury-wbd Jan 17, 2025

mdfleury-wbd Jan 17, 2025

ZoogieZork left a comment •

edited

Loading

ZoogieZork left a comment

mdfleury-wbd commented Jan 23, 2025

mdfleury-wbd commented Jan 23, 2025

mdfleury-wbd commented Jan 23, 2025

ZoogieZork commented Jan 23, 2025

ZoogieZork left a comment

Update mui #395

Update mui #395

Conversation

mdfleury-wbd commented Dec 18, 2024 • edited Loading

How Has This Been Tested?

Types of changes

Checklist

Pic

mdfleury-wbd Jan 17, 2025

Choose a reason for hiding this comment

mdfleury-wbd Jan 17, 2025

Choose a reason for hiding this comment

mdfleury-wbd Jan 17, 2025

Choose a reason for hiding this comment

mdfleury-wbd Jan 17, 2025

Choose a reason for hiding this comment

ZoogieZork left a comment • edited Loading

Choose a reason for hiding this comment

ZoogieZork left a comment

Choose a reason for hiding this comment

mdfleury-wbd commented Jan 23, 2025

mdfleury-wbd commented Jan 23, 2025

mdfleury-wbd commented Jan 23, 2025

ZoogieZork commented Jan 23, 2025

ZoogieZork left a comment

Choose a reason for hiding this comment

mdfleury-wbd commented Dec 18, 2024 •

edited

Loading

ZoogieZork left a comment •

edited

Loading