Skip to content
This repository was archived by the owner on Mar 31, 2021. It is now read-only.

React 16 + Ref Support #106

Merged
Robdel12 merged 6 commits into from
Nov 6, 2018
Merged

React 16 + Ref Support #106

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
afe1508
Mark react 16 as a valid peer dependency.
Oct 17, 2018
a828f7c
Update tests to run against React 16 and verify everything works.
Oct 17, 2018
2d5979f
Add integration test case for refs that reproduces issue seen with
Oct 18, 2018
d7ba894
Extract react and react-dom into separate bundle to avoid loading rea…
Oct 18, 2018
38130be
Update test to correctly expect six snapshots.
Oct 18, 2018
9f1ab00
Check in yarn integrity SHAs in `yarn.lock`
Robdel12 Nov 1, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Update tests to run against React 16 and verify everything works.
  • Loading branch information
Thomas Huston committed Oct 17, 2018
commit a828f7c830bc9ae3f4432ea244f24dcf1cad8af7
6 changes: 3 additions & 3 deletions integration-tests/react-percy/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@
"percy": "react-percy"
},
"dependencies": {
"prop-types": "^15.5.10",
"react": "^15.6.1",
"react-dom": "^15.6.1"
"prop-types": "^15.6.2",
"react": "^16.5.2",
"react-dom": "^16.5.2"
Copy link
Contributor Author

@thomashuston thomashuston Oct 18, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A while back we discussed adding better integration test coverage of multiple React versions. Might be worth a separate PR that adds coverage for both React 15 and 16 and both create-react-app 1 and 2.

},
"devDependencies": {
"@percy/react": "^0.4.6",
Expand Down
4 changes: 4 additions & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@
"lerna": "^2.0.0",
"lint-staged": "^3.3.1",
"prettier": "^1.5.3",
"raf": "^3.4.0",
"rimraf": "^2.5.4",
"tar.gz": "^1.0.5",
"vitruvius": "^3.0.0"
Expand All @@ -44,6 +45,9 @@
"<rootDir>/integration-tests/",
"<rootDir>/packages/"
],
"setupFiles": [
"raf/polyfill"
Copy link
Contributor Author

@thomashuston thomashuston Oct 18, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

React 16 requires a requestAnimationFrame polyfill for tests to run properly.

Copy link
Contributor

@Robdel12 Robdel12 Oct 31, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like Jest 21.3.x included the polyfill by default. Maybe we can bump the version of Jest here (or a separate PR?) jestjs/jest#4568 (comment)

Copy link
Contributor Author

@thomashuston thomashuston Oct 31, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure thing, I’ll toss up a separate PR for that next week. I’m off on vacation till then :)

],
"testPathIgnorePatterns": [
"/node_modules/",
"<rootDir>/integration-tests/create-react-app",
Expand Down
6 changes: 3 additions & 3 deletions packages/react-percy-snapshot-render/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,11 @@
},
"dependencies": {
"babel-runtime": "^6.26.0",
"redbox-react": "^1.5.0"
"redbox-react": "^1.6.0"
},
"devDependencies": {
"react": "^15.6.1",
"react-dom": "^15.6.1"
"react": "^16.5.2",
"react-dom": "^16.5.2"
},
"publishConfig": {
"access": "public"
Expand Down
4 changes: 2 additions & 2 deletions packages/react-percy-snapshot-render/src/__tests__/__snapshots__/render-tests.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`renders error message into the DOM element when rendering fails 1`] = `"<div data-reactroot=\\"\\">Cannot read property 'format' of undefined</div>"`;
exports[`renders error message into the DOM element when rendering fails 1`] = `"<div>Cannot read property 'format' of undefined</div>"`;

exports[`renders the specified React markup into the DOM element 1`] = `"<div data-reactroot=\\"\\">some markup</div>"`;
exports[`renders the specified React markup into the DOM element 1`] = `"<div>some markup</div>"`;
3 changes: 3 additions & 0 deletions packages/react-percy-snapshot-render/src/__tests__/render-tests.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,9 @@ jest.mock('redbox-react', () => ({ error }) =>
);
/* eslint-enable react/display-name, react/prop-types */

// eslint-disable-next-line no-console
console.error = jest.fn();
Copy link
Contributor Author

@thomashuston thomashuston Oct 18, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test purposefully causes an error to get thrown so we can verify it's getting rendered. React 16 has a new mechanism for catching errors and prints a console error here, but it's not really useful in the context of this test.


let el;

beforeEach(() => {
Expand Down
2 changes: 1 addition & 1 deletion packages/react-percy-test-framework/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
"promise-each": "^2.2.0"
},
"devDependencies": {
"react": "^15.4.2"
"react": "^16.5.2"
},
"publishConfig": {
"access": "public"
Expand Down
45 changes: 41 additions & 4 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6890,6 +6890,13 @@ prop-types@^15.5.10, prop-types@^15.5.4:
fbjs "^0.8.9"
loose-envify "^1.3.1"

prop-types@^15.6.2:
version "15.6.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
dependencies:
loose-envify "^1.3.1"
object-assign "^4.1.1"

proxy-addr@~1.1.5:
version "1.1.5"
resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-1.1.5.tgz#71c0ee3b102de3f202f3b64f608d173fcba1a918"
Expand Down Expand Up @@ -6966,6 +6973,12 @@ querystringify@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-1.0.0.tgz#6286242112c5b712fa654e526652bf6a13ff05cb"

raf@^3.4.0:
version "3.4.0"
resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.0.tgz#a28876881b4bc2ca9117d4138163ddb80f781575"
dependencies:
performance-now "^2.1.0"

randomatic@^1.1.3:
version "1.1.7"
resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-1.1.7.tgz#c7abe9cc8b87c0baa876b19fde83fd464797e38c"
Expand Down Expand Up @@ -7025,6 +7038,15 @@ react-dom@^15.6.1:
object-assign "^4.1.0"
prop-types "^15.5.10"

react-dom@^16.5.2:
version "16.5.2"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.5.2.tgz#b69ee47aa20bab5327b2b9d7c1fe2a30f2cfa9d7"
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"
prop-types "^15.6.2"
schedule "^0.5.0"

react-error-overlay@^1.0.10:
version "1.0.10"
resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-1.0.10.tgz#da8cd1eafac41afdca2a33792b23694ef6c528f1"
Expand Down Expand Up @@ -7079,7 +7101,7 @@ [email protected]:
optionalDependencies:
fsevents "1.1.2"

react@^15.4.2, react@^15.6.1:
react@^15.6.1:
version "15.6.1"
resolved "https://registry.yarnpkg.com/react/-/react-15.6.1.tgz#baa8434ec6780bde997cdc380b79cd33b96393df"
dependencies:
Expand All @@ -7089,6 +7111,15 @@ react@^15.4.2, react@^15.6.1:
object-assign "^4.1.0"
prop-types "^15.5.10"

react@^16.5.2:
version "16.5.2"
resolved "https://registry.yarnpkg.com/react/-/react-16.5.2.tgz#19f6b444ed139baa45609eee6dc3d318b3895d42"
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"
prop-types "^15.6.2"
schedule "^0.5.0"

read-all-stream@^3.0.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/read-all-stream/-/read-all-stream-3.1.0.tgz#35c3e177f2078ef789ee4bfafa4373074eaef4fa"
Expand Down Expand Up @@ -7168,9 +7199,9 @@ [email protected]:
dependencies:
minimatch "3.0.3"

redbox-react@^1.5.0:
version "1.5.0"
resolved "https://registry.yarnpkg.com/redbox-react/-/redbox-react-1.5.0.tgz#04dab11557d26651bf3562a67c22ace56c5d3967"
redbox-react@^1.6.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/redbox-react/-/redbox-react-1.6.0.tgz#e753ac02595bc1bf695b3935889a4f5b1b5a21a1"
dependencies:
error-stack-parser "^1.3.6"
object-assign "^4.0.1"
Expand Down Expand Up @@ -7553,6 +7584,12 @@ sax@^1.2.1, sax@^1.2.4, sax@~1.2.1:
version "1.2.4"
resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"

schedule@^0.5.0:
version "0.5.0"
resolved "https://registry.yarnpkg.com/schedule/-/schedule-0.5.0.tgz#c128fffa0b402488b08b55ae74bb9df55cc29cc8"
dependencies:
object-assign "^4.1.1"

schema-utils@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.3.0.tgz#f5877222ce3e931edae039f17eb3716e7137f8cf"
Expand Down