Skip to content

Commit

Permalink
Add snapshot test for attribute table
Browse files Browse the repository at this point in the history
Same data as the attribute table, but in the form of a snapshot. Uses
puppeteer to run headless Chromium.
  • Loading branch information
acdlite committed Sep 1, 2017
1 parent 7ff2cba commit 4744ca9
Show file tree
Hide file tree
Showing 7 changed files with 12,202 additions and 4 deletions.
2 changes: 1 addition & 1 deletion fixtures/attribute-behavior/src/attributeBehavior.js
Original file line number Diff line number Diff line change
Expand Up @@ -2503,7 +2503,7 @@ function warn(str) {
_didWarn = true;
}
const UNKNOWN_HTML_TAGS = new Set(['keygen', 'time', 'command']);
function getRenderedAttributeValue(
export function getRenderedAttributeValue(
React,
renderer,
serverRenderer,
Expand Down
73 changes: 73 additions & 0 deletions fixtures/attribute-behavior/src/headless.js
Original file line number Diff line number Diff line change
@@ -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;
5 changes: 5 additions & 0 deletions fixtures/attribute-behavior/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down
82 changes: 82 additions & 0 deletions src/renderers/dom/shared/__tests__/DOMAttributeBehavior-test.js
Original file line number Diff line number Diff line change
@@ -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,
);
});
Loading

0 comments on commit 4744ca9

Please sign in to comment.