test(modal): fix invalid test case

testing-library/jest-dom#209

packages/bezier-react/src/components/Modal/Modal.test.tsx

@@ -229,12 +229,17 @@ describe('Modal', () => {
     describe('Visually Hidden', () => {
       it('should be visible when the \'hidden\' prop is false', () => {
         const { getByRole } = renderOpenedModal()
-        expect(getByRole('banner')).toBeInTheDocument() /* HTML5 header element */
+        expect(getByRole('banner')).toBeVisible() /* HTML5 header element */
       })
 
       it('should be visually hidden when the \'hidden\' prop is true', () => {
         const { queryByRole } = renderOpenedModal({ modalHeaderProps: { title: TITLE_TEXT, hidden: true } })
-        expect(queryByRole('banner')).not.toBeInTheDocument() /* HTML5 header element */
+        /**
+         * NOTE(@ed): As a `toBeVisible` matcher, it cannot be used because the `visibility` style cannot be checked.
+         * Instead, it tests whether the visually hidden style is applied correctly.
+         * @see https://github.com/testing-library/jest-dom/issues/209
+         */
+        expect(queryByRole('banner')).toHaveStyle({ position: 'absolute' }) /* HTML5 header element */
       })
     })
   })