Add unit tests for props to attribute mapping in SSR. (#9106)

* Added a handful of SSR unit tests, ported from a previous pull request.

* Fixing linting errors

* Fixed a test helper function to properly report errors.

* Un-nested the new rendering tests. Updated the fiber test passing/not passing lists.

* Edited to comply with the react/jsx-space-before-closing eslint rule, which will soon be merged into master.

* Response to code review from @spicyj. Moved tests to separate file, reworked wording of test names, corrected use of canUseDom, and simplified tests against tagName. Thanks for the help, @spicyj!

* Converted the unit tests to use async-await style.

* Moved async-await babel transform for tests from .babelrc to preprocessor.js.

* Response to code review in PR #9089. Thanks, @spicyj!

* Fixing some bugs in the SSR unit tests.

* Missed deleting some repeated code in the last commit.

* Adding unit tests for property to attribute mapping in SSR.

* Removing some redundant unit tests.

* Oops. I forgot to re-run record-tests after c593dbc; fixing that here.

* Reformatting for prettier so that the build will pass.

scripts/fiber/tests-failing.txt

@@ -6,6 +6,47 @@ src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
 * gives source code refs for unknown prop warning for exact elements (ssr)
 * gives source code refs for unknown prop warning for exact elements in composition (ssr)
 
+src/renderers/dom/shared/__tests__/ReactDOMServerIntegration-test.js
+* renders a blank div with client render on top of good server markup
+* renders a div with inline styles with client render on top of good server markup
+* renders a self-closing tag with client render on top of good server markup
+* renders a self-closing tag as a child with client render on top of good server markup
+* renders simple numbers with client render on top of good server markup
+* renders simple strings with client render on top of good server markup
+* renders string prop with true value with client render on top of good server markup
+* renders string prop with false value with client render on top of good server markup
+* renders boolean prop with true value with client render on top of good server markup
+* renders boolean prop with false value with client render on top of good server markup
+* renders boolean prop with self value with client render on top of good server markup
+* renders boolean prop with "" value with client render on top of good server markup
+* renders boolean prop with string value with client render on top of good server markup
+* renders boolean prop with array value with client render on top of good server markup
+* renders boolean prop with object value with client render on top of good server markup
+* renders boolean prop with non-zero number value with client render on top of good server markup
+* renders boolean prop with zero value with client render on top of good server markup
+* renders download prop with true value with client render on top of good server markup
+* renders download prop with false value with client render on top of good server markup
+* renders download prop with string value with client render on top of good server markup
+* renders download prop with string "true" value with client render on top of good server markup
+* renders className prop with string value with client render on top of good server markup
+* renders className prop with empty string value with client render on top of good server markup
+* renders className prop with true value with client render on top of good server markup
+* renders className prop with false value with client render on top of good server markup
+* renders htmlFor with string value with client render on top of good server markup
+* renders htmlFor with an empty string with client render on top of good server markup
+* renders className prop with true value with client render on top of good server markup
+* renders className prop with false value with client render on top of good server markup
+* renders no ref attribute with client render on top of good server markup
+* renders no children attribute with client render on top of good server markup
+* renders no key attribute with client render on top of good server markup
+* renders no dangerouslySetInnerHTML attribute with client render on top of good server markup
+* renders no unknown attributes with client render on top of good server markup
+* renders unknown data- attributes with client render on top of good server markup
+* renders no unknown attributes for non-standard elements with client render on top of good server markup
+* renders unknown attributes for custom elements with client render on top of good server markup
+* renders unknown attributes for custom elements using is with client render on top of good server markup
+* renders no HTML events with client render on top of good server markup
+
 src/renderers/dom/shared/__tests__/ReactDOMTextComponent-test.js
 * can reconcile text merged by Node.normalize() alongside other elements
 * can reconcile text merged by Node.normalize()

scripts/fiber/tests-passing-except-dev.txt

@@ -10,6 +10,43 @@ src/renderers/dom/shared/__tests__/ReactDOMServerIntegration-test.js
 * renders a div with inline styles with client render on top of bad server markup
 * renders a self-closing tag with client render on top of bad server markup
 * renders a self-closing tag as a child with client render on top of bad server markup
+* renders simple numbers with client render on top of bad server markup
+* renders simple strings with client render on top of bad server markup
+* renders string prop with true value with client render on top of bad server markup
+* renders string prop with false value with client render on top of bad server markup
+* renders boolean prop with true value with client render on top of bad server markup
+* renders boolean prop with false value with client render on top of bad server markup
+* renders boolean prop with self value with client render on top of bad server markup
+* renders boolean prop with "" value with client render on top of bad server markup
+* renders boolean prop with string value with client render on top of bad server markup
+* renders boolean prop with array value with client render on top of bad server markup
+* renders boolean prop with object value with client render on top of bad server markup
+* renders boolean prop with non-zero number value with client render on top of bad server markup
+* renders boolean prop with zero value with client render on top of bad server markup
+* renders download prop with true value with client render on top of bad server markup
+* renders download prop with false value with client render on top of bad server markup
+* renders download prop with string value with client render on top of bad server markup
+* renders download prop with string "true" value with client render on top of bad server markup
+* renders className prop with string value with client render on top of bad server markup
+* renders className prop with empty string value with client render on top of bad server markup
+* renders className prop with true value with client render on top of bad server markup
+* renders className prop with false value with client render on top of bad server markup
+* renders htmlFor with string value with client render on top of bad server markup
+* renders htmlFor with an empty string with client render on top of bad server markup
+* renders className prop with true value with client render on top of bad server markup
+* renders className prop with false value with client render on top of bad server markup
+* renders no ref attribute with client render on top of bad server markup
+* renders no children attribute with client render on top of bad server markup
+* renders no key attribute with client render on top of bad server markup
+* renders no dangerouslySetInnerHTML attribute with client render on top of bad server markup
+* renders no unknown attributes with server string render
+* renders no unknown attributes with client render on top of bad server markup
+* renders unknown data- attributes with client render on top of bad server markup
+* renders no unknown attributes for non-standard elements with server string render
+* renders no unknown attributes for non-standard elements with client render on top of bad server markup
+* renders unknown attributes for custom elements with client render on top of bad server markup
+* renders unknown attributes for custom elements using is with client render on top of bad server markup
+* renders no HTML events with client render on top of bad server markup
 
 src/renderers/dom/shared/__tests__/ReactMount-test.js
 * should warn if mounting into dirty rendered markup

scripts/fiber/tests-passing.txt

@@ -1064,16 +1064,80 @@ src/renderers/dom/shared/__tests__/ReactDOMSVG-test.js
 src/renderers/dom/shared/__tests__/ReactDOMServerIntegration-test.js
 * renders a blank div with server string render
 * renders a blank div with clean client render
-* renders a blank div with client render on top of good server markup
 * renders a div with inline styles with server string render
 * renders a div with inline styles with clean client render
-* renders a div with inline styles with client render on top of good server markup
 * renders a self-closing tag with server string render
 * renders a self-closing tag with clean client render
-* renders a self-closing tag with client render on top of good server markup
 * renders a self-closing tag as a child with server string render
 * renders a self-closing tag as a child with clean client render
-* renders a self-closing tag as a child with client render on top of good server markup
+* renders simple numbers with server string render
+* renders simple numbers with clean client render
+* renders simple strings with server string render
+* renders simple strings with clean client render
+* renders string prop with true value with server string render
+* renders string prop with true value with clean client render
+* renders string prop with false value with server string render
+* renders string prop with false value with clean client render
+* renders boolean prop with true value with server string render
+* renders boolean prop with true value with clean client render
+* renders boolean prop with false value with server string render
+* renders boolean prop with false value with clean client render
+* renders boolean prop with self value with server string render
+* renders boolean prop with self value with clean client render
+* renders boolean prop with "" value with server string render
+* renders boolean prop with "" value with clean client render
+* renders boolean prop with string value with server string render
+* renders boolean prop with string value with clean client render
+* renders boolean prop with array value with server string render
+* renders boolean prop with array value with clean client render
+* renders boolean prop with object value with server string render
+* renders boolean prop with object value with clean client render
+* renders boolean prop with non-zero number value with server string render
+* renders boolean prop with non-zero number value with clean client render
+* renders boolean prop with zero value with server string render
+* renders boolean prop with zero value with clean client render
+* renders download prop with true value with server string render
+* renders download prop with true value with clean client render
+* renders download prop with false value with server string render
+* renders download prop with false value with clean client render
+* renders download prop with string value with server string render
+* renders download prop with string value with clean client render
+* renders download prop with string "true" value with server string render
+* renders download prop with string "true" value with clean client render
+* renders className prop with string value with server string render
+* renders className prop with string value with clean client render
+* renders className prop with empty string value with server string render
+* renders className prop with empty string value with clean client render
+* renders className prop with true value with server string render
+* renders className prop with true value with clean client render
+* renders className prop with false value with server string render
+* renders className prop with false value with clean client render
+* renders htmlFor with string value with server string render
+* renders htmlFor with string value with clean client render
+* renders htmlFor with an empty string with server string render
+* renders htmlFor with an empty string with clean client render
+* renders className prop with true value with server string render
+* renders className prop with true value with clean client render
+* renders className prop with false value with server string render
+* renders className prop with false value with clean client render
+* renders no ref attribute with server string render
+* renders no ref attribute with clean client render
+* renders no children attribute with server string render
+* renders no children attribute with clean client render
+* renders no key attribute with server string render
+* renders no key attribute with clean client render
+* renders no dangerouslySetInnerHTML attribute with server string render
+* renders no dangerouslySetInnerHTML attribute with clean client render
+* renders no unknown attributes with clean client render
+* renders unknown data- attributes with server string render
+* renders unknown data- attributes with clean client render
+* renders no unknown attributes for non-standard elements with clean client render
+* renders unknown attributes for custom elements with server string render
+* renders unknown attributes for custom elements with clean client render
+* renders unknown attributes for custom elements using is with server string render
+* renders unknown attributes for custom elements using is with clean client render
+* renders no HTML events with server string render
+* renders no HTML events with clean client render
 
 src/renderers/dom/shared/__tests__/ReactDOMTextComponent-test.js
 * updates a mounted text component in place