-
Notifications
You must be signed in to change notification settings - Fork 1
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.
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
Upgrade react/next version #10
Changes from all commits
ef5b726
a4c9193
4ba6bd9
5cc35c5
0a2fd78
3df0658
bd3069f
15c729c
9dc8420
33b0d6b
296268c
35455e3
26f04a6
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -19,48 +19,52 @@ | |
"dependencies": { | ||
"axios": "^0.27.2", | ||
"firebase": "^9.8.1", | ||
"next": "12.1.6", | ||
"react": "17.0.2", | ||
"react-dom": "17.0.2" | ||
"next": "^13.0.3", | ||
"react": "^18.2.0", | ||
"react-dom": "^18.2.0" | ||
}, | ||
"devDependencies": { | ||
"@babel/core": "^7.18.5", | ||
"@babel/preset-env": "^7.18.2", | ||
"@storybook/addon-actions": "^6.5.8", | ||
"@storybook/addon-essentials": "^6.5.8", | ||
"@storybook/addon-links": "^6.5.8", | ||
"@storybook/addon-storyshots": "^6.5.8", | ||
"@storybook/builder-webpack5": "^6.5.8", | ||
"@storybook/manager-webpack5": "^6.5.8", | ||
"@storybook/react": "^6.5.8", | ||
"@testing-library/jest-dom": "^5.16.4", | ||
"@testing-library/react-hooks": "^7.0.2", | ||
"@types/node": "17.0.31", | ||
"@types/react": "18.0.8", | ||
"@types/react-dom": "18.0.3", | ||
"babel-jest": "^28.1.1", | ||
"@babel/core": "^7.20.2", | ||
"@babel/preset-env": "^7.20.2", | ||
"@storybook/addon-actions": "^6.5.13", | ||
"@storybook/addon-essentials": "^6.5.13", | ||
"@storybook/addon-links": "^6.5.13", | ||
"@storybook/addon-storyshots": "^6.5.13", | ||
"@storybook/builder-webpack5": "^6.5.13", | ||
"@storybook/manager-webpack5": "^6.5.13", | ||
"@storybook/react": "^6.5.13", | ||
"@testing-library/jest-dom": "^5.16.5", | ||
"@testing-library/react-hooks": "^8.0.1", | ||
"@types/node": "^18.11.9", | ||
"@types/react": "^18.0.25", | ||
"@types/react-dom": "^18.0.9", | ||
"babel-jest": "^29.3.1", | ||
"babel-loader": "^8.2.5", | ||
"babel-plugin-require-context-hook": "^1.0.0", | ||
"css-loader": "^6.7.1", | ||
"eslint": "8.14.0", | ||
"eslint-config-next": "12.1.6", | ||
"eslint-config-next": "^13.0.3", | ||
"eslint-config-prettier": "^8.5.0", | ||
"eslint-plugin-prettier": "^4.0.0", | ||
"firebase-tools": "^10.8.0", | ||
"husky": "^7.0.0", | ||
"identity-obj-proxy": "^3.0.0", | ||
"jest": "^28.1.0", | ||
"jest-environment-jsdom": "^28.1.0", | ||
"jest": "^29.3.1", | ||
"jest-environment-jsdom": "^29.3.1", | ||
"lint-staged": "^12.4.1", | ||
"nock": "^13.2.7", | ||
"prettier": "^2.6.2", | ||
"sass": "^1.52.3", | ||
"sass-loader": "^13.0.0", | ||
"storybook-addon-next-router": "^4.0.0", | ||
"next-router-mock": "^0.8.0", | ||
"storybook-addon-next-router": "^4.0.1", | ||
"style-loader": "^3.3.1", | ||
"ts-jest": "^28.0.5", | ||
"typescript": "4.6.4", | ||
"webpack": "5.68.0" | ||
"ts-jest": "^29.0.3", | ||
"typescript": "^4.9.3", | ||
"webpack": "^5.75.0" | ||
}, | ||
"resolutions": { | ||
"react-test-renderer": "18.2.0" | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. どうにも現状ではreact18でstorybookを動作させるにはreact-test-rendererのバージョンを強制的に指定する必要がある模様 |
||
}, | ||
"lint-staged": { | ||
"src/**/*.{ts,tsx}": [ | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,12 +1,11 @@ | ||
import Router, { useRouter } from 'next/router' | ||
import { renderHook, act, RenderResult } from '@testing-library/react-hooks' | ||
|
||
import mockRouter from 'next-router-mock' | ||
import { useCSR } from '../useCSR' | ||
|
||
jest.mock('next/router') | ||
jest.mock('next/router', () => require('next-router-mock')) | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. これで
と言われない There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 細かいですが、jest.mockはimportの後の行に書きましょう。 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 修正:26f04a6 |
||
|
||
const mockedUseRouter = jest.mocked(useRouter) | ||
const mockedRouter = jest.mocked(Router) | ||
const mockedUseRouter = jest.spyOn(require('next/router'), 'useRouter') | ||
const mockedReplace = jest.spyOn(mockRouter, 'replace') | ||
|
||
let result: RenderResult<boolean> | undefined | ||
|
||
|
@@ -22,13 +21,13 @@ describe('useCSR', () => { | |
${'/path/to/not/exist'} | ${'パスがROUTESに存在しないとき、Router.replaceを実行せずにtrueを返す'} | ||
`('$description', async ({ path }) => { | ||
mockedUseRouter.mockReturnValue({ asPath: path } as any) | ||
mockedRouter.replace.mockResolvedValue(true) | ||
mockedReplace.mockResolvedValue(true) | ||
|
||
await act(async () => { | ||
result = renderHook(() => useCSR()).result | ||
}) | ||
|
||
expect(mockedRouter.replace).toHaveBeenCalledTimes(0) | ||
expect(mockedReplace).toHaveBeenCalledTimes(0) | ||
expect(result?.current).toBe(true) | ||
}) | ||
}) | ||
|
@@ -42,14 +41,14 @@ describe('useCSR', () => { | |
'$path が $href のパターンに合致するとき、Router.replaceを実行し、falseを返す', | ||
async ({ path, href }) => { | ||
mockedUseRouter.mockReturnValue({ asPath: path } as any) | ||
mockedRouter.replace.mockResolvedValue(true) | ||
mockedReplace.mockResolvedValue(true) | ||
|
||
await act(async () => { | ||
result = renderHook(() => useCSR()).result | ||
}) | ||
|
||
expect(mockedRouter.replace).toHaveBeenCalledTimes(1) | ||
expect(mockedRouter.replace).toHaveBeenCalledWith(href, path) | ||
expect(mockedReplace).toHaveBeenCalledTimes(1) | ||
expect(mockedReplace).toHaveBeenCalledWith(href, path) | ||
expect(result?.current).toBe(false) | ||
} | ||
) | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -17,6 +17,7 @@ Array [ | |
href="/login" | ||
onClick={[Function]} | ||
onMouseEnter={[Function]} | ||
onTouchStart={[Function]} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. (おそらく)React18の影響? |
||
> | ||
ログイン画面(/login) | ||
</a> | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
next13でnext/routerをインポートすると
と言われていしまうので、その対策として導入