diff --git a/cypress/integration/modal.spec.ts b/cypress/integration/modal.spec.ts
new file mode 100644
index 0000000..3fbe6aa
--- /dev/null
+++ b/cypress/integration/modal.spec.ts
@@ -0,0 +1,98 @@
+describe('Modal', () => {
+ const clickCorrectNumberKey = () => {
+ cy.get('.bg-focused').children().children('.invisible').then(($correctNumberTile) => {
+ const correctNumber = $correctNumberTile.text()
+ cy.findByTestId(`number-key-${correctNumber}`).click()
+ })
+ }
+
+ const clearWordplayByClicking = () => {
+ for (let i = 0; i < 2; i++) {
+ clickCorrectNumberKey();
+ }
+ }
+
+ const clearStage = () => {
+ let level = 0;
+ for (const number of [5, 3, 3, 3, 1]) {
+ level++;
+ for (let i = 0; i < number; i++) {
+ cy.findByTestId('start-answering').click()
+ for (let j = 0; j < level; j++) {
+ clearWordplayByClicking();
+ }
+ }
+ }
+ }
+
+ const clearReview = () => {
+ for (let i = 0; i < 10; i++) {
+ cy.findByTestId('start-answering').click()
+ for (let j = 0; j < 5; j++) {
+ clearWordplayByClicking();
+ }
+ }
+ }
+
+ context('when the user clears stage 1', () => {
+ context('when the user clicks "move to stage select" button', () => {
+ it('moves to stage select page', () => {
+ cy.visit('/stages/1')
+ cy.wait(500)
+ clearStage()
+ cy.findByTestId('move-to-stage-select-button').click()
+ cy.url().should('eq', Cypress.config().baseUrl + '/')
+ })
+ })
+
+ context('when the user clicks "move to next stage" button', () => {
+ it('moves to stage 2', () => {
+ cy.visit('/stages/1')
+ cy.wait(500)
+ clearStage()
+ cy.findByTestId('move-to-next-stage-button').click()
+ cy.wait(500)
+ cy.url().should('eq', Cypress.config().baseUrl + '/stages/2')
+ })
+ })
+ })
+
+ context('when the user clears stage 10', () => {
+ context('when the user clicks "move to next stage" button', () => {
+ it('moves to review 1', () => {
+ cy.setLocalStorage('gorogoropanda.com/clearedStage', 'u51');
+ cy.visit('/stages/10')
+ cy.wait(500)
+ clearStage()
+ cy.findByTestId('move-to-next-stage-button').click()
+ cy.wait(500)
+ cy.url().should('eq', Cypress.config().baseUrl + '/reviews/1')
+ })
+ })
+ })
+
+ context('when the user clears review 1', () => {
+ context('when the user clicks "move to stage select" button', () => {
+ it('moves to stage select page', () => {
+ cy.setLocalStorage('gorogoropanda.com/clearedStage', 'ttw');
+ cy.visit('/reviews/1')
+ cy.wait(500)
+ clearReview()
+ cy.findByTestId('move-to-stage-select-button').click()
+ cy.url().should('eq', Cypress.config().baseUrl + '/')
+ })
+ })
+
+ context('when the user clicks "move to next stage" button', () => {
+ it('moves to the finale page', () => {
+ cy.setLocalStorage('gorogoropanda.com/clearedStage', 'ttw');
+ cy.visit('/reviews/1')
+ cy.wait(500)
+ clearReview()
+ cy.findByTestId('move-to-next-stage-button').click()
+ cy.wait(500)
+ cy.url().should('eq', Cypress.config().baseUrl + '/thank-you-for-playing')
+ })
+ })
+ })
+})
diff --git a/src/components/stages/Modal.tsx b/src/components/stages/Modal.tsx
index e149160..584dd3d 100644
--- a/src/components/stages/Modal.tsx
+++ b/src/components/stages/Modal.tsx
@@ -152,6 +152,7 @@ const Modal = memo(function Modal({
{buttonLight}
ステージをえらぶ
@@ -171,6 +172,7 @@ const Modal = memo(function Modal({
{buttonLight}
次に進む