From 515d3093fd8b5d755babe1a870d27762e1027fcd Mon Sep 17 00:00:00 2001 From: keyasuda Date: Thu, 2 Jan 2025 16:57:28 +0900 Subject: [PATCH] =?UTF-8?q?=E3=83=86=E3=82=B9=E3=83=88=E6=99=82=E3=81=AE?= =?UTF-8?q?=E8=AD=A6=E5=91=8A=E8=A7=A3=E6=B6=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/component/SignInButton.test.tsx | 20 +++++++++----- src/component/SignInButton.tsx | 9 +++++-- src/component/app/AppBar.test.tsx | 29 +++++++++++++++------ src/component/app/AppBar.tsx | 6 ++--- src/component/app/belongings/Belongings.tsx | 9 ++++++- src/component/app/belongings/EditDialog.tsx | 9 ++++++- src/component/app/print/PrintQueue.tsx | 9 ++++++- src/component/app/storages/EditDialog.tsx | 9 ++++++- src/component/app/storages/Storages.tsx | 9 ++++++- 9 files changed, 84 insertions(+), 25 deletions(-) diff --git a/src/component/SignInButton.test.tsx b/src/component/SignInButton.test.tsx index 14b4c2c..8cc7d97 100644 --- a/src/component/SignInButton.test.tsx +++ b/src/component/SignInButton.test.tsx @@ -5,6 +5,7 @@ import { TestingLibraryElementError, } from '@testing-library/react' import userEvent from '@testing-library/user-event' +import { act } from '@testing-library/react' import * as authModule from './authentication' import SignInButton from './SignInButton' @@ -20,12 +21,14 @@ describe('SignInButton', () => { signIn.mockResolvedValue() }) - const renderIt = () => { - render( - -
children
- - ) + const renderIt = async () => { + await act(async () => { + render( + +
children
+ + ) + }) } describe('signed out', () => { @@ -41,7 +44,10 @@ describe('SignInButton', () => { initAuth.mockImplementationOnce(() => false) isSignedIn.mockImplementationOnce(() => true) await renderIt() - await userEvent.click(screen.getByRole('button')) + + await act(async () => { + await userEvent.click(screen.getByRole('button')) + }) expect(signIn).toHaveBeenCalled() }) diff --git a/src/component/SignInButton.tsx b/src/component/SignInButton.tsx index 06593ff..3a006c0 100644 --- a/src/component/SignInButton.tsx +++ b/src/component/SignInButton.tsx @@ -14,8 +14,13 @@ const SignInButton = (props) => { let [signedIn, setSignedIn] = useState(false) useEffect(async () => { - setSignedIn(await initAuth()) - setLoaded(true) + const init = async () => { + const authStatus = await initAuth() + setSignedIn(authStatus) + setLoaded(true) + } + + init() window.addEventListener('focus', () => setSignedIn(isSignedIn()), false) }, []) diff --git a/src/component/app/AppBar.test.tsx b/src/component/app/AppBar.test.tsx index 0a05d8c..8d3280a 100644 --- a/src/component/app/AppBar.test.tsx +++ b/src/component/app/AppBar.test.tsx @@ -127,15 +127,22 @@ describe('AppBar', () => { id: 'belonginguuid', }) - beforeEach(() => { + beforeEach(async () => { + // async を追加 renderIt('') const button = screen.getByLabelText('scan') - userEvent.click(button) + // クリックイベントを act でラップ + await act(async () => { + await userEvent.click(button) + }) }) describe('code is of belonging', () => { - it('should navigate to belonging page', () => { - act(() => codeReaderOnRead(code)) + it('should navigate to belonging page', async () => { + // async を追加 + await act(async () => { + codeReaderOnRead(code) + }) expect(history.push).toHaveBeenCalledWith( '/app/file-id/belongings/belonginguuid' ) @@ -148,8 +155,11 @@ describe('AppBar', () => { id: 'storageuuid', }) - it('should navigate to storage page', () => { - act(() => codeReaderOnRead(code)) + it('should navigate to storage page', async () => { + // async を追加 + await act(async () => { + codeReaderOnRead(code) + }) expect(history.push).toHaveBeenCalledWith( '/app/file-id/storages/storageuuid' ) @@ -159,8 +169,11 @@ describe('AppBar', () => { describe('code is unknown', () => { const codes = ['generalpurposebarcode', '1234567890'] codes.map((code) => { - it('should navigate to belonging page, code as ID', () => { - act(() => codeReaderOnRead(code)) + it('should navigate to belonging page, code as ID', async () => { + // async を追加 + await act(async () => { + codeReaderOnRead(code) + }) expect(history.push).toHaveBeenCalledWith( `/app/file-id/belongings/${code}` ) diff --git a/src/component/app/AppBar.tsx b/src/component/app/AppBar.tsx index aaf73e0..b5e09c6 100644 --- a/src/component/app/AppBar.tsx +++ b/src/component/app/AppBar.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState, useRef } from 'react' import { useParams, useHistory, Link } from 'react-router-dom' import { useDispatch, useSelector } from 'react-redux' -import { fade, makeStyles } from '@material-ui/core/styles' +import { alpha, makeStyles } from '@material-ui/core/styles' import { default as MUIAppBar } from '@material-ui/core/AppBar' import Toolbar from '@material-ui/core/Toolbar' import InputBase from '@material-ui/core/InputBase' @@ -31,9 +31,9 @@ const AppBar = (props) => { search: { position: 'relative', borderRadius: theme.shape.borderRadius, - backgroundColor: fade(theme.palette.common.white, 0.15), + backgroundColor: alpha(theme.palette.common.white, 0.15), '&:hover': { - backgroundColor: fade(theme.palette.common.white, 0.25), + backgroundColor: alpha(theme.palette.common.white, 0.25), }, marginRight: 0, marginLeft: 0, diff --git a/src/component/app/belongings/Belongings.tsx b/src/component/app/belongings/Belongings.tsx index 647df57..69e47a7 100644 --- a/src/component/app/belongings/Belongings.tsx +++ b/src/component/app/belongings/Belongings.tsx @@ -161,7 +161,14 @@ const Belongings = (props) => { > add - + { + if (reason !== 'backdropClick') { + handleClose() + } + }} + > 新しい物品を作成 diff --git a/src/component/app/belongings/EditDialog.tsx b/src/component/app/belongings/EditDialog.tsx index 71b20b0..dbc81f9 100644 --- a/src/component/app/belongings/EditDialog.tsx +++ b/src/component/app/belongings/EditDialog.tsx @@ -118,7 +118,14 @@ const EditDialog = (props) => { return ( <> - + { + if (reason !== 'backdropClick') { + handleClose() + } + }} + > {newItem && <>物品の追加} {!newItem && <>物品の編集} diff --git a/src/component/app/print/PrintQueue.tsx b/src/component/app/print/PrintQueue.tsx index 7b545fa..5177896 100644 --- a/src/component/app/print/PrintQueue.tsx +++ b/src/component/app/print/PrintQueue.tsx @@ -108,7 +108,14 @@ const PrintQueue = (props) => { - + { + if (reason !== 'backdropClick') { + handleClose() + } + }} + > 印刷済みコード diff --git a/src/component/app/storages/EditDialog.tsx b/src/component/app/storages/EditDialog.tsx index c7c383a..7754d7b 100644 --- a/src/component/app/storages/EditDialog.tsx +++ b/src/component/app/storages/EditDialog.tsx @@ -19,7 +19,14 @@ const EditDialog = (props) => { const [printed, setPrinted] = useState(item.printed) return ( - + { + if (reason !== 'backdropClick') { + handleClose() + } + }} + > 保管場所の編集 diff --git a/src/component/app/storages/Storages.tsx b/src/component/app/storages/Storages.tsx index 12f07af..dc5eefb 100644 --- a/src/component/app/storages/Storages.tsx +++ b/src/component/app/storages/Storages.tsx @@ -107,7 +107,14 @@ const Storages = (props) => { > add - + { + if (reason !== 'backdropClick') { + handleClose() + } + }} + > 新しい保管場所を作成