Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update react monorepo to v18 (major) #365

Merged
merged 4 commits into from
Aug 14, 2023
Merged

Update react monorepo to v18 (major) #365

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
867585b
Update react monorepo to v18
renovate[bot] Aug 13, 2023
ecc5db5
Fix tests for React 18
eXon Aug 13, 2023
ae97a21
Fix formatting
eXon Aug 13, 2023
9629e5b
Fix peer dependency
eXon Aug 14, 2023
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
2 changes: 1 addition & 1 deletion .github/workflows/test.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ jobs:
run: yarn

- name: Check formatting
run: npx prettier . --check
run: yarn format

- name: Build
run: yarn build
Expand Down
2 changes: 1 addition & 1 deletion .husky/pre-commit
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
npx prettier . --write
npx lint-staged
yarn test
1 change: 1 addition & 0 deletions jest.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
/** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
testEnvironment: 'jsdom',
setupFiles: ['<rootDir>/setup-tests.ts'],
collectCoverageFrom: [
'packages/react-cookie/src/**/*.{js,jsx,ts,tsx}',
'packages/universal-cookie/src/**/*.{js,jsx,ts,tsx}',
Expand Down
7 changes: 6 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@
"husky": "^8.0.3",
"jest": "^29.6.2",
"jest-environment-jsdom": "^29.6.2",
"lint-staged": "^14.0.0",
"prettier": "^3.0.1",
"remark": "^14.0.3",
"rimraf": "^5.0.1",
Expand All @@ -39,6 +40,7 @@
"build-express": "cd packages/universal-cookie-express && yarn build",
"build-koa": "cd packages/universal-cookie-koa && yarn build",
"build-demo": "cd packages/react-cookie-demo && yarn build",
"format": "prettier . --check",
"size": "size-limit",
"prepare": "husky install"
},
Expand All @@ -59,5 +61,8 @@
"path": "./packages/react-cookie/lib/index.js",
"limit": "10 KB"
}
]
],
"lint-staged": {
"*.{js,jsx,ts,tsx,md,css,html,json,yml}": "prettier --write"
}
}
6 changes: 3 additions & 3 deletions packages/react-cookie-demo/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,9 @@
"@babel/register": "^7.18.9",
"express": "^4.17.2",
"prop-types": "^15.8.1",
"react": "^16.14.0",
"react": "^18.2.0",
"react-cookie": "^4.0.0",
"react-dom": "^16.14.0",
"react-dom": "^18.2.0",
"universal-cookie-express": "^4.0.0"
},
"devDependencies": {
Expand All @@ -28,7 +28,7 @@
"babel-jest": "^29.6.2",
"babel-loader": "^8.3.0",
"jest": "^29.6.2",
"react-test-renderer": "^16.14.0",
"react-test-renderer": "^18.2.0",
"webpack": "^5.88.2",
"webpack-cli": "^5.1.4"
}
Expand Down
4 changes: 2 additions & 2 deletions packages/react-cookie/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,8 +42,8 @@
},
"devDependencies": {
"@babel/cli": "^7.19.3",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"rimraf": "^2.7.1",
"rollup": "^3.28.0",
"typescript": "^5.1.6"
Expand Down
51 changes: 29 additions & 22 deletions packages/react-cookie/src/__tests__/useCookies-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react';
import ReactDOM from 'react-dom';
import ReactDOM from 'react-dom/client';
import { act } from 'react-dom/test-utils';
import ReactDOMServer from 'react-dom/server';
import { cleanCookies } from 'universal-cookie/lib/utils';
Expand All @@ -22,20 +22,23 @@ describe('useCookies', () => {
document.cookie = 'test="big fat cat"';

const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

ReactDOM.render(
<CookiesProvider>
<TestComponent />
</CookiesProvider>,
node,
);
act(() => {
root.render(
<CookiesProvider>
<TestComponent />
</CookiesProvider>,
);
});

expect(node.innerHTML).toContain('big fat cat');
});

it('update when a cookie change', () => {
const cookies = new Cookies();
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

const toRender = (
<CookiesProvider cookies={cookies}>
Expand All @@ -45,14 +48,14 @@ describe('useCookies', () => {

act(() => {
cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');

act(() => {
cookies.set('test', 'mean lean cat Suki');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('mean lean cat Suki');
Expand All @@ -61,20 +64,20 @@ describe('useCookies', () => {
it('clear the change subscription on unmount', () => {
const cookies = new Cookies();
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

act(() => {
ReactDOM.render(
root.render(
<CookiesProvider cookies={cookies}>
<TestComponent />
</CookiesProvider>,
node,
);
});

expect(cookies.changeListeners.length).toBe(1);

act(() => {
ReactDOM.render(null, node);
root.render(null);
});

expect(cookies.changeListeners.length).toBe(0);
Expand All @@ -83,6 +86,7 @@ describe('useCookies', () => {
it('re-render if a dependency changes', () => {
const cookies = new Cookies();
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

const toRender = (
<CookiesProvider cookies={cookies}>
Expand All @@ -92,14 +96,14 @@ describe('useCookies', () => {

act(() => {
cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');

act(() => {
cookies.set('test', 'mean lean cat Suki');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('mean lean cat Suki');
Expand All @@ -108,6 +112,7 @@ describe('useCookies', () => {
it('re-render if a dependency changes multiple times', () => {
const cookies = new Cookies();
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

const toRender = (
<CookiesProvider cookies={cookies}>
Expand All @@ -117,21 +122,21 @@ describe('useCookies', () => {

act(() => {
cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');

act(() => {
cookies.set('test', 'mean lean cat Suki');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('mean lean cat Suki');

act(() => {
cookies.set('test', 'good old Yuki');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('good old Yuki');
Expand All @@ -140,6 +145,7 @@ describe('useCookies', () => {
it('re-render if a dependency changes and go back', () => {
const cookies = new Cookies();
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

const toRender = (
<CookiesProvider cookies={cookies}>
Expand All @@ -149,21 +155,21 @@ describe('useCookies', () => {

act(() => {
cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');

act(() => {
cookies.set('test', 'mean lean cat Suki');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('mean lean cat Suki');

act(() => {
cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');
Expand All @@ -172,6 +178,7 @@ describe('useCookies', () => {
it('does not re-render if no dependency changes', () => {
const cookies = new Cookies();
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

const toRender = (
<CookiesProvider cookies={cookies}>
Expand All @@ -181,14 +188,14 @@ describe('useCookies', () => {

act(() => {
cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');

act(() => {
cookies.set('test', 'mean lean cat Suki');
ReactDOM.render(toRender, node);
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');
Expand Down
58 changes: 37 additions & 21 deletions packages/react-cookie/src/__tests__/withCookies-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import React from 'react';
import { object } from 'prop-types';
import { instanceOf } from 'prop-types';
import ReactDOM from 'react-dom';
import ReactDOM from 'react-dom/client';
import ReactDOMServer from 'react-dom/server';
import { act } from 'react-dom/test-utils';
import { CookiesProvider, withCookies, Cookies } from '../';
import { cleanCookies } from 'universal-cookie/lib/utils';

Expand Down Expand Up @@ -53,13 +54,15 @@ describe('withCookies(Component)', () => {

const Component = withCookies(TestComponent);
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

ReactDOM.render(
<CookiesProvider>
<Component />
</CookiesProvider>,
node,
);
act(() => {
root.render(
<CookiesProvider>
<Component />
</CookiesProvider>,
);
});

expect(node.innerHTML).toContain('big fat cat');
});
Expand All @@ -69,6 +72,7 @@ describe('withCookies(Component)', () => {

const Component = withCookies(TestComponent);
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

const toRender = (
<CookiesProvider cookies={cookies}>
Expand All @@ -77,28 +81,38 @@ describe('withCookies(Component)', () => {
);

cookies.set('test', 'big fat cat Pacman');
ReactDOM.render(toRender, node);

act(() => {
root.render(toRender);
});

expect(node.innerHTML).toContain('big fat cat Pacman');

cookies.set('test', 'mean lean cat Suki');
ReactDOM.render(toRender, node);

act(() => {
root.render(toRender);
});

expect(node.innerHTML).toContain('mean lean cat Suki');
});

it('receive all cookies in props', () => {
const cookies = new Cookies();
const Component = withCookies(AllCookiesComponent);
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);

cookies.set('test1', 'value1');
cookies.set('test2', 'value2');

ReactDOM.render(
<CookiesProvider cookies={cookies}>
<Component />
</CookiesProvider>,
node,
);
act(() => {
root.render(
<CookiesProvider cookies={cookies}>
<Component />
</CookiesProvider>,
);
});

expect(node.innerHTML).toContain('test1');
expect(node.innerHTML).toContain('value1');
Expand All @@ -110,14 +124,16 @@ describe('withCookies(Component)', () => {
const cookies = new Cookies();
const Component = withCookies(TestRefComponent);
const node = document.createElement('div');
const root = ReactDOM.createRoot(node);
const ref = React.createRef();

ReactDOM.render(
<CookiesProvider cookies={cookies}>
<Component ref={ref} />
</CookiesProvider>,
node,
);
act(() => {
root.render(
<CookiesProvider cookies={cookies}>
<Component ref={ref} />
</CookiesProvider>,
);
});

expect(ref.current.testValue).toBe('Suki is pretty');
});
Expand Down
4 changes: 4 additions & 0 deletions renovate.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,10 @@
"extends": ["config:base"],
"rangeStrategy": "bump",
"packageRules": [
{
"matchDepTypes": ["peerDependencies"],
"enabled": false
},
{
"packagePatterns": [".*"],
"schedule": ["before 6am on Friday"],
Expand Down
Loading