Merge pull request #279 from keyasuda/fix/camera-permisson

カメラのパーミションダイアログが出ない端末があるのでnavigator.mediaDevices.getUserMediaを明示的に一度呼んでやる

src/component/app/AppBar.test.tsx

@@ -20,6 +20,22 @@ const MockCodeReader = (props) => {
   return <>code reader</>
 }
 
+// navigator.mediaDevicesのモック
+Object.defineProperty(global.navigator, 'mediaDevices', {
+  value: {
+    getUserMedia: jest.fn().mockImplementation(() =>
+      Promise.resolve({
+        getTracks: () => [
+          {
+            stop: () => {},
+          },
+        ],
+      })
+    ),
+  },
+  writable: true,
+})
+
 jest.mock('./CodeReader', () => ({
   __esModule: true,
   namedExport: jest.fn(),

src/component/app/AppBar.tsx

@@ -151,7 +151,14 @@ const AppBar = (props) => {
             edge="end"
             color="inherit"
             aria-label="scan"
-            onClick={() => setOpenScanner(true)}
+            onClick={async () => {
+              const stream = await navigator.mediaDevices.getUserMedia({
+                video: true,
+              })
+              stream.getTracks().forEach((track) => track.stop())
+
+              setOpenScanner(true)
+            }}
           >
             <Icon>qr_code_scanner</Icon>
           </IconButton>