skillbox/client/cypress/e2e/frontend/bookmarks.spec.js

import { getMinimalMe } from '../../support/helpers';
import minimalModule from '../../fixtures/module.minimal';

const { me: minimalMe } = getMinimalMe({});

describe('Bookmarks', () => {
  beforeEach(() => {
    cy.setup();
    cy.mockGraphqlOps({
      operations: {
        MeQuery: {
          me: minimalMe,
        },
        ModuleDetailsQuery: {
          module: {
            ...minimalModule,
            slug: 'my-module-slug',
            chapters: [
              {
                title: 'My super Chapter',
                contentBlocks: [
                  {
                    contents: [
                      {
                        type: 'text_block',
                        value: {
                          text: 'Das folgende Interview',
                        },
                        id: 'df8212ee-3e82-49fa-977e-c4b60789163e',
                      },
                    ],
                  },
                ],
              },
            ],
          },
        },
        InstrumentQuery: {
          instrument: {
            contents: [
              {
                type: 'text_block',
                value: {
                  text: 'Hallo Sam',
                },
                id: 'df8212ee-3e82-49fa-977e-c4b60789163e',
              },
            ],
          },
        },
        UpdateLastModule: {},
        UpdateContentBookmark: {
          updateContentBookmark: {
            success: true,
          },
        },
        UpdateModuleBookmark: {
          updateModuleBookmark: {
            success: true,
          },
        },
        UpdateInstrumentBookmark: {
          updateModuleBookmark: {
            success: true,
          },
        },
        UpdateChapterBookmark: {
          updateChapterBookmark: {
            success: true,
          },
        },
        AddNote: ({ input: { note } }) => ({
          addNote: {
            note,
          },
        }),
        UpdateNote: ({ input: { note } }) => ({
          updateNote: {
            note,
          },
        }),
      },
    });
  });

  it('should bookmark instrument', () => {
    cy.visit('/instrument/an-instrument');

    cy.getByDataCy('content-component').first().as('contentComponent');

    cy.get('@contentComponent').within(() => {
      cy.get('.bookmark-actions__bookmark').click();
      cy.get('.bookmark-actions__add-note').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').type('Hallo Velo');
    });

    cy.get('[data-cy=modal-save-button]').click();

    cy.get('@contentComponent').within(() => {
      cy.get('.bookmark-actions__edit-note').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').clear().type('Hello Bike');
    });

    cy.get('[data-cy=modal-save-button]').click();
  });

  it('should bookmark module', () => {
    cy.visit('/module/lohn-und-budget/');
    cy.getByDataCy('module-bookmark-actions').as('moduleBookmark');

    cy.get('@moduleBookmark').within(() => {
      cy.getByDataCy('bookmark-action').click();
      cy.getByDataCy('add-note-action').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').type('Hallo Velo');
    });

    cy.get('[data-cy=modal-save-button]').click();

    cy.get('@moduleBookmark').within(() => {
      cy.getByDataCy('edit-note-action').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').clear().type('Hello Bike');
    });

    cy.get('[data-cy=modal-save-button]').click();
  });

  it('should bookmark chapter', () => {
    cy.visit('/module/lohn-und-budget/');

    cy.getByDataCy('chapter-bookmark-actions').as('chapterBookmark');

    cy.get('@chapterBookmark').within(() => {
      cy.getByDataCy('bookmark-action').click();
      cy.getByDataCy('add-note-action').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').type('Hallo Velo');
    });

    cy.get('[data-cy=modal-save-button]').click();

    cy.get('@chapterBookmark').within(() => {
      cy.getByDataCy('edit-note-action').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').clear().type('Hello Bike');
    });

    cy.get('[data-cy=modal-save-button]').click();
  });

  it('should bookmark content block', () => {
    cy.visit('/module/lohn-und-budget/');

    cy.getByDataCy('content-component').contains('Das folgende Interview').parent().parent().as('interviewContent');

    cy.get('@interviewContent').within(() => {
      cy.get('.bookmark-actions__bookmark').click();
      cy.get('.bookmark-actions__add-note').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').type('Hallo Velo');
    });

    cy.get('[data-cy=modal-save-button]').click();

    cy.get('@interviewContent').within(() => {
      cy.get('.bookmark-actions__edit-note').click();
    });

    cy.get('[data-cy=bookmark-note]').within(() => {
      cy.get('.skillbox-input').clear().type('Hello Bike');
    });

    cy.get('[data-cy=modal-save-button]').click();
  });
});