[attribute-behavior] Snapshot test

fixtures/attribute-behavior/src/headless.js

@@ -0,0 +1,73 @@
+/* eslint-disable */
+
+import {
+  getCanonicalizedValue,
+  getRenderedAttributeValue,
+  attributes,
+  types,
+} from './attributeBehavior';
+
+const React = global.React;
+const {Component} = React;
+
+const ReactDOM16 = global.ReactDOM16;
+const ReactDOMServer16 = global.ReactDOMServer16;
+
+function getUniqueKey(t, key, depth = 1) {
+  if (depth !== 1) {
+    key = `${key} (variant ${depth})`;
+  }
+  if (t.has(key)) {
+    return getUniqueKey(t, key, depth + 1);
+  }
+  return key;
+}
+
+function test() {
+  let log = '';
+  for (let attribute of attributes) {
+    log += `${attribute.name}\n`;
+    for (let type of types) {
+      const result = getRenderedAttributeValue(
+        React,
+        ReactDOM16,
+        ReactDOMServer16,
+        attribute,
+        type
+      );
+
+      const {
+        didError,
+        didWarn,
+        canonicalResult,
+        canonicalDefaultValue,
+        ssrHasSameBehavior,
+        ssrHasSameBehaviorExceptWarnings,
+      } = result;
+
+      let descriptions = [];
+      if (canonicalResult === canonicalDefaultValue) {
+        descriptions.push('NO CHANGE');
+      }
+      if (didError) {
+        descriptions.push('ERROR');
+      }
+      if (didWarn) {
+        descriptions.push('WARN');
+      }
+      if (!ssrHasSameBehavior) {
+        if (ssrHasSameBehaviorExceptWarnings) {
+          descriptions.push('SSR WARNS');
+        } else {
+          descriptions.push('SSR DEVIATION');
+        }
+      }
+
+      log += `\t${type.name} -> ${canonicalResult} ${descriptions.join(', ')}\n`;
+    }
+  }
+
+  return log;
+}
+
+window.test = test;

fixtures/attribute-behavior/src/index.js

@@ -22,6 +22,11 @@ import './index.css';
   const ReactDOM = (window.ReactDOM16 = window.ReactDOM);
   window.ReactDOMServer16 = window.ReactDOMServer;
 
+  if (window.location.pathname === '/headless') {
+    import('./headless');
+    return;
+  }
+
   const App = await import('./App');
 
   ReactDOM.render(

package.json

@@ -72,6 +72,7 @@
     "platform": "^1.1.0",
     "prettier": "1.2.2",
     "prop-types": "^15.5.8",
+    "puppeteer": "^0.10.1",
     "rimraf": "^2.6.1",
     "rollup": "^0.41.6",
     "rollup-plugin-alias": "^1.2.1",

src/renderers/dom/shared/__tests__/DOMAttributeBehavior-test.js

@@ -0,0 +1,82 @@
+/**
+ * Copyright 2013-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @emails react-core
+ */
+
+'use strict';
+
+const ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
+const puppeteer = require('puppeteer');
+
+let child;
+
+describe('DOMAttributeBehavior', () => {
+  beforeEach(() => {
+    jest.resetModules();
+  });
+
+  afterEach(() => {
+    if (child) {
+      // Kill the child process and its subprocesses
+      process.kill(-child.pid, 'SIGINT');
+    }
+  });
+
+  async function testAttributeBehavior(url) {
+    const browser = await puppeteer.launch();
+    const page = await browser.newPage();
+    await page.goto(url);
+    const result = await page.evaluate(() => {
+      return window.test();
+    });
+    expect(result).toMatchSnapshot();
+  }
+
+  it(
+    'works',
+    done => {
+      if (!ReactDOMFeatureFlags.useFiber) {
+        done();
+        return;
+      }
+      const path = require('path');
+      const {execSync, spawn} = require('child_process');
+
+      const cwd = path.resolve(process.cwd(), 'fixtures/attribute-behavior');
+
+      execSync('yarn', {cwd});
+
+      process.env.BROWSER = 'none';
+      process.env.PORT = 9292;
+
+      child = spawn('yarn', ['start'], {cwd, detached: true});
+
+      let didStartTest = false;
+      child.stdout.on('data', data => {
+        const str = data.toString('utf8');
+        if (str.includes('Failed')) {
+          console.error('Failure on CRA startup');
+          done();
+          return;
+        }
+
+        if (!didStartTest && str.includes('http://localhost:9292/')) {
+          didStartTest = true;
+          testAttributeBehavior('http://localhost:9292/headless')
+            .then(() => done())
+            .catch(error => {
+              console.error(error);
+              done();
+            });
+        }
+      });
+    },
+    30000,
+  );
+});