skillbox/client/cypress/integration/frontend/portfolio/project-page.spec.js

import {PROJECT_ENTRY_TEMPLATE} from '../../../../src/consts/strings.consts';

describe('Project Page', () => {
  const operations = {
    MeQuery: {
      me: {
        id: 'VXNlck5vZGU6NQ==',
        permissions: [],
      },
    },
    ProjectsQuery: {
      projects: [
        {
          id: 'UHJvamVjdE5vZGU6MzM=',
          title: 'Groot',
          appearance: 'red',
          description: 'I am Groot',
          slug: 'groot',
          objectives: 'Be Groot\nBe awesome',
          final: false,
          student: {
            firstName: 'Rachel',
            lastName: 'Green',
            id: 'VXNlck5vZGU6NQ==',
            avatarUrl: ''
          },
          entriesCount: 2,
        },
      ],
    },
    ProjectQuery: {
      project: {
        id: 'UHJvamVjdE5vZGU6MzY=',
        title: 'Groot',
        appearance: 'yellow',
        description: 'I am Groot',
        slug: 'groot',
        objectives: 'Be Groot\nBe awesome',
        final: false,
        student: {
          firstName: 'Rachel',
          lastName: 'Green',
          id: 'VXNlck5vZGU6NQ==',
          avatarUrl: '',
        },
        entriesCount: 1,
        entries: [
          {
            id: 'UHJvamVjdEVudHJ5Tm9kZTo2NQ==',
            description: 'Aktivität:\nKill Thanos\n\n\nReflexion:\nHe sucks\n\n\nNächste Schritte:\nGo for the head',
            documentUrl: '',
            created: '2020-06-01T13:49:31.262510+00:00',
          },
        ],
      },
    },
    AddProjectEntry: variables => ({
      addProjectEntry: {
        projectEntry: Object.assign({}, variables.input.projectEntry, {
          created: '2021-01-20T15:26:58.722773+00:00',
        }),
        errors: null,
        __typename: 'AddProjectEntryPayload',
      },
    }),
    UpdateProjectEntry: variables => ({
      updateProjectEntry: {
        projectEntry: variables.input.projectEntry,
        errors: null,
        __typename: 'UpdateProjectEntryPayload',
      },
    }),
    DeleteProjectEntry: {
      deleteProjectEntry: {
        success: true,
      },
    },
  };

  beforeEach(() => {
    cy.setup();

    cy.task('getSchema').then(schema => {
      cy.mockGraphqlOps({
        operations,
      });
    });
  });

  it('has the correct layout', () => {
    cy.visit('/portfolio/groot');
    cy.getByDataCy('project-entry').eq(0).within(() => {
      cy.getByDataCy('project-entry-date').should('contain', '1. Juni 2021, 13:49');
    });
  });

  describe('Project Entry', () => {
    it('should create a new project entry', () => {
      cy.visit('/portfolio');
      cy.get('[data-cy=project-link]:first-of-type').click();
      cy.get('[data-cy=add-project-entry]:first-of-type').click();
      cy.getByDataCy('activity-input').should('not.exist');
      cy.getByDataCy('reflection-input').should('not.exist');
      cy.getByDataCy('next-steps-input').should('not.exist');
      cy.getByDataCy('modal-title').should('contain', 'Beitrag erfassen');
      cy.getByDataCy('project-entry-textarea').should('exist');
      cy.getByDataCy('use-template-button').should('exist').click();
      cy.getByDataCy('upload-document-button').should('exist');
      cy.getByDataCy('modal-save-button').click();

      cy.get('.project-entry:last-of-type').within(() => {
        cy.get('.project-entry__paragraph:first-of-type').contains('Join the Guardians');
      });
    });

    it('should edit first entry', () => {
      cy.visit('/portfolio/groot');
      cy.get('.project-entry__paragraph:first-of-type').contains('Kill Thanos');
      cy.get('.project-entry:first-of-type').within(() => {
        cy.get('[data-cy=project-entry-more]').click();
        cy.get('[data-cy=edit-project-entry]').click();
      });
      cy.getByDataCy('activity-input').should('not.exist');

      cy.getByDataCy('project-entry-textarea').clear().type('Defeat Thanos');
      cy.get('[data-cy=modal-save-button]').click();
      cy.get('.project-entry__paragraph:first-of-type').contains('Defeat Thanos');
    });

    it('should delete the last entry', () => {
      cy.visit('/portfolio/groot');

      cy.get('.project-entry').should('have.length', 1);

      cy.get('.project-entry:last-of-type').within(() => {
        cy.get('[data-cy=project-entry-more]').click();
        cy.get('[data-cy=delete-project-entry]').click();
      });

      cy.get('.project-entry').should('have.length', 0);
    });

    it('should use the template', () => {
      cy.visit('/portfolio/groot');
      cy.get('[data-cy=add-project-entry]:first-of-type').click();
      cy.getByDataCy('use-template-button').click();
      cy.getByDataCy('project-entry-textarea').should('have.value', PROJECT_ENTRY_TEMPLATE);
    });
  });
});