Update attribute-behavior fixture app to latest React

fixtures/attribute-behavior/AttributeTableSnapshot.md

@@ -294,7 +294,7 @@
 | `action=(string 'on')`| (changed)| `"http://localhost:3000/on"` |
 | `action=(string 'off')`| (changed)| `"http://localhost:3000/off"` |
 | `action=(symbol)`| (initial, warning)| `"http://localhost:3000/"` |
-| `action=(function)`| (initial, warning)| `"http://localhost:3000/"` |
+| `action=(function)`| (changed, ssr mismatch)| `"javascript:throw new Error('A React form was unexpectedly submitted. If you called form.submit() manually, consider using form.requestSubmit() instead. If you\'re trying to use event.stopPropagation() in a submit event handler, consider also calling event.preventDefault().')"` |
 | `action=(null)`| (initial)| `"http://localhost:3000/"` |
 | `action=(undefined)`| (initial)| `"http://localhost:3000/"` |
 
@@ -2568,8 +2568,8 @@
 | `defaultChecked=(string 'false')`| (changed)| `<boolean: true>` |
 | `defaultChecked=(string 'on')`| (changed)| `<boolean: true>` |
 | `defaultChecked=(string 'off')`| (changed)| `<boolean: true>` |
-| `defaultChecked=(symbol)`| (changed, ssr mismatch)| `<boolean: true>` |
-| `defaultChecked=(function)`| (changed, ssr mismatch)| `<boolean: true>` |
+| `defaultChecked=(symbol)`| (initial)| `<boolean: false>` |
+| `defaultChecked=(function)`| (initial)| `<boolean: false>` |
 | `defaultChecked=(null)`| (initial)| `<boolean: false>` |
 | `defaultChecked=(undefined)`| (initial)| `<boolean: false>` |
 
@@ -4176,25 +4176,25 @@
 ## `formAction` (on `<input>` inside `<div>`)
 | Test Case | Flags | Result |
 | --- | --- | --- |
-| `formAction=(string)`| (changed)| `"https://reactjs.com/"` |
-| `formAction=(empty string)`| (initial)| `"http://localhost:3000/"` |
-| `formAction=(array with string)`| (changed)| `"https://reactjs.com/"` |
-| `formAction=(empty array)`| (initial)| `"http://localhost:3000/"` |
-| `formAction=(object)`| (changed)| `"http://localhost:3000/result%20of%20toString()"` |
-| `formAction=(numeric string)`| (changed)| `"http://localhost:3000/42"` |
-| `formAction=(-1)`| (changed)| `"http://localhost:3000/-1"` |
-| `formAction=(0)`| (changed)| `"http://localhost:3000/0"` |
-| `formAction=(integer)`| (changed)| `"http://localhost:3000/1"` |
+| `formAction=(string)`| (changed, warning)| `"https://reactjs.com/"` |
+| `formAction=(empty string)`| (initial, warning)| `"http://localhost:3000/"` |
+| `formAction=(array with string)`| (changed, warning)| `"https://reactjs.com/"` |
+| `formAction=(empty array)`| (initial, warning)| `"http://localhost:3000/"` |
+| `formAction=(object)`| (changed, warning)| `"http://localhost:3000/result%20of%20toString()"` |
+| `formAction=(numeric string)`| (changed, warning)| `"http://localhost:3000/42"` |
+| `formAction=(-1)`| (changed, warning)| `"http://localhost:3000/-1"` |
+| `formAction=(0)`| (changed, warning)| `"http://localhost:3000/0"` |
+| `formAction=(integer)`| (changed, warning)| `"http://localhost:3000/1"` |
 | `formAction=(NaN)`| (changed, warning)| `"http://localhost:3000/NaN"` |
-| `formAction=(float)`| (changed)| `"http://localhost:3000/99.99"` |
+| `formAction=(float)`| (changed, warning)| `"http://localhost:3000/99.99"` |
 | `formAction=(true)`| (initial, warning)| `"http://localhost:3000/"` |
 | `formAction=(false)`| (initial, warning)| `"http://localhost:3000/"` |
-| `formAction=(string 'true')`| (changed)| `"http://localhost:3000/true"` |
-| `formAction=(string 'false')`| (changed)| `"http://localhost:3000/false"` |
-| `formAction=(string 'on')`| (changed)| `"http://localhost:3000/on"` |
-| `formAction=(string 'off')`| (changed)| `"http://localhost:3000/off"` |
+| `formAction=(string 'true')`| (changed, warning)| `"http://localhost:3000/true"` |
+| `formAction=(string 'false')`| (changed, warning)| `"http://localhost:3000/false"` |
+| `formAction=(string 'on')`| (changed, warning)| `"http://localhost:3000/on"` |
+| `formAction=(string 'off')`| (changed, warning)| `"http://localhost:3000/off"` |
 | `formAction=(symbol)`| (initial, warning)| `"http://localhost:3000/"` |
-| `formAction=(function)`| (initial, warning)| `"http://localhost:3000/"` |
+| `formAction=(function)`| (changed, warning, ssr mismatch)| `"javascript:throw new Error('A React form was unexpectedly submitted. If you called form.submit() manually, consider using form.requestSubmit() instead. If you\'re trying to use event.stopPropagation() in a submit event handler, consider also calling event.preventDefault().')"` |
 | `formAction=(null)`| (initial)| `"http://localhost:3000/"` |
 | `formAction=(undefined)`| (initial)| `"http://localhost:3000/"` |
 
@@ -5052,7 +5052,7 @@
 | Test Case | Flags | Result |
 | --- | --- | --- |
 | `href=(string)`| (changed)| `"https://reactjs.com/"` |
-| `href=(empty string)`| (changed)| `"http://localhost:3000/"` |
+| `href=(empty string)`| (initial, warning)| `<empty string>` |
 | `href=(array with string)`| (changed)| `"https://reactjs.com/"` |
 | `href=(empty array)`| (changed)| `"http://localhost:3000/"` |
 | `href=(object)`| (changed)| `"http://localhost:3000/result%20of%20toString()"` |
@@ -9876,23 +9876,23 @@
 ## `src` (on `<img>` inside `<div>`)
 | Test Case | Flags | Result |
 | --- | --- | --- |
-| `src=(string)`| (changed)| `"https://reactjs.com/"` |
-| `src=(empty string)`| (changed)| `"http://localhost:3000/"` |
+| `src=(string)`| (changed, ssr error, ssr mismatch)| `"https://reactjs.com/"` |
+| `src=(empty string)`| (initial, warning)| `<empty string>` |
 | `src=(array with string)`| (changed)| `"https://reactjs.com/"` |
 | `src=(empty array)`| (changed)| `"http://localhost:3000/"` |
 | `src=(object)`| (changed)| `"http://localhost:3000/result%20of%20toString()"` |
-| `src=(numeric string)`| (changed)| `"http://localhost:3000/42"` |
+| `src=(numeric string)`| (changed, ssr error, ssr mismatch)| `"http://localhost:3000/42"` |
 | `src=(-1)`| (changed)| `"http://localhost:3000/-1"` |
 | `src=(0)`| (changed)| `"http://localhost:3000/0"` |
 | `src=(integer)`| (changed)| `"http://localhost:3000/1"` |
 | `src=(NaN)`| (changed, warning)| `"http://localhost:3000/NaN"` |
 | `src=(float)`| (changed)| `"http://localhost:3000/99.99"` |
 | `src=(true)`| (changed, warning, ssr mismatch)| `"http://localhost:3000/true"` |
 | `src=(false)`| (initial, warning)| `<empty string>` |
-| `src=(string 'true')`| (changed)| `"http://localhost:3000/true"` |
-| `src=(string 'false')`| (changed)| `"http://localhost:3000/false"` |
-| `src=(string 'on')`| (changed)| `"http://localhost:3000/on"` |
-| `src=(string 'off')`| (changed)| `"http://localhost:3000/off"` |
+| `src=(string 'true')`| (changed, ssr error, ssr mismatch)| `"http://localhost:3000/true"` |
+| `src=(string 'false')`| (changed, ssr error, ssr mismatch)| `"http://localhost:3000/false"` |
+| `src=(string 'on')`| (changed, ssr error, ssr mismatch)| `"http://localhost:3000/on"` |
+| `src=(string 'off')`| (changed, ssr error, ssr mismatch)| `"http://localhost:3000/off"` |
 | `src=(symbol)`| (changed, error, warning, ssr mismatch)| `` |
 | `src=(function)`| (changed, warning, ssr mismatch)| `"http://localhost:3000/function%20f()%20%7B%7D"` |
 | `src=(null)`| (initial)| `<empty string>` |
@@ -10001,23 +10001,23 @@
 ## `srcSet` (on `<img>` inside `<div>`)
 | Test Case | Flags | Result |
 | --- | --- | --- |
-| `srcSet=(string)`| (initial)| `<undefined>` |
+| `srcSet=(string)`| (initial, ssr error, ssr mismatch)| `<undefined>` |
 | `srcSet=(empty string)`| (initial)| `<undefined>` |
 | `srcSet=(array with string)`| (initial)| `<undefined>` |
 | `srcSet=(empty array)`| (initial)| `<undefined>` |
 | `srcSet=(object)`| (initial)| `<undefined>` |
-| `srcSet=(numeric string)`| (initial)| `<undefined>` |
+| `srcSet=(numeric string)`| (initial, ssr error, ssr mismatch)| `<undefined>` |
 | `srcSet=(-1)`| (initial)| `<undefined>` |
 | `srcSet=(0)`| (initial)| `<undefined>` |
 | `srcSet=(integer)`| (initial)| `<undefined>` |
 | `srcSet=(NaN)`| (initial, warning)| `<undefined>` |
 | `srcSet=(float)`| (initial)| `<undefined>` |
 | `srcSet=(true)`| (initial, warning)| `<undefined>` |
 | `srcSet=(false)`| (initial, warning)| `<undefined>` |
-| `srcSet=(string 'true')`| (initial)| `<undefined>` |
-| `srcSet=(string 'false')`| (initial)| `<undefined>` |
-| `srcSet=(string 'on')`| (initial)| `<undefined>` |
-| `srcSet=(string 'off')`| (initial)| `<undefined>` |
+| `srcSet=(string 'true')`| (initial, ssr error, ssr mismatch)| `<undefined>` |
+| `srcSet=(string 'false')`| (initial, ssr error, ssr mismatch)| `<undefined>` |
+| `srcSet=(string 'on')`| (initial, ssr error, ssr mismatch)| `<undefined>` |
+| `srcSet=(string 'off')`| (initial, ssr error, ssr mismatch)| `<undefined>` |
 | `srcSet=(symbol)`| (initial, warning)| `<undefined>` |
 | `srcSet=(function)`| (initial, warning)| `<undefined>` |
 | `srcSet=(null)`| (initial)| `<undefined>` |

fixtures/attribute-behavior/package.json

@@ -4,18 +4,28 @@
   "private": true,
   "dependencies": {
     "file-saver": "^1.3.3",
-    "glamor": "^2.20.40",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "react-scripts": "1.0.11",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-scripts": "5.0.1",
     "react-virtualized": "^9.9.0"
   },
   "scripts": {
-    "predev":
-      "cp ../../build/oss-experimental/react/umd/react.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom-server-legacy.browser.development.js public/",
-    "dev": "react-scripts start",
+    "predev": "cp ../../build/oss-experimental/react/umd/react.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom.development.js public/ && cp ../../build/oss-experimental/react-dom/umd/react-dom-server-legacy.browser.development.js public/",
+    "dev": "DISABLE_ESLINT_PLUGIN=true react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
   }
 }

fixtures/attribute-behavior/src/App.js

@@ -1,16 +1,9 @@
 import React from 'react';
-import {createElement} from 'glamor/react'; // eslint-disable-line
-/* @jsx createElement */
 
 import {MultiGrid, AutoSizer} from 'react-virtualized';
 import 'react-virtualized/styles.css';
 import FileSaver from 'file-saver';
 
-import {
-  inject as injectErrorOverlay,
-  uninject as uninjectErrorOverlay,
-} from 'react-error-overlay/lib/overlay';
-
 import attributes from './attributes';
 
 const types = [
@@ -444,8 +437,6 @@ function prepareState(initGlobals) {
   const table = new Map();
   const rowPatternHashes = new Map();
 
-  // Disable error overlay while testing each attribute
-  uninjectErrorOverlay();
   for (let attribute of attributes) {
     const results = new Map();
     let hasSameBehaviorForAll = true;
@@ -480,9 +471,6 @@ function prepareState(initGlobals) {
     table.set(attribute, row);
   }
 
-  // Renable error overlay
-  injectErrorOverlay();
-
   return {
     table,
     rowPatternHashes,
@@ -829,7 +817,7 @@ class App extends React.Component {
     });
   }
 
-  componentWillUpdate(nextProps, nextState) {
+  UNSAFE_componentWillUpdate(nextProps, nextState) {
     if (
       nextState.sortOrder !== this.state.sortOrder ||
       nextState.filter !== this.state.filter ||

fixtures/attribute-behavior/src/index.js

@@ -1,6 +1,8 @@
 import './index.css';
 import React from 'react';
-import ReactDOM from 'react-dom';
+import ReactDOM from 'react-dom/client';
 import App from './App';
 
-ReactDOM.render(<App />, document.getElementById('root'));
+const root = ReactDOM.createRoot(document.getElementById('root'));
+
+root.render(<App />);