diff --git a/client/.postcssrc.js b/client/.postcssrc.js deleted file mode 100644 index 39ebf318..00000000 --- a/client/.postcssrc.js +++ /dev/null @@ -1,10 +0,0 @@ -// https://github.com/michael-ciniawsky/postcss-load-config - -module.exports = { - plugins: { - 'postcss-import': {}, - 'postcss-url': {}, - // to edit target browsers: use "browserslist" field in package.json - autoprefixer: {}, - }, -}; diff --git a/client/.postcssrc.json b/client/.postcssrc.json new file mode 100644 index 00000000..8752e22e --- /dev/null +++ b/client/.postcssrc.json @@ -0,0 +1,7 @@ +{ + "plugins": { + "postcss-import": {}, + "postcss-url": {}, + "autoprefixer": {} + } +} diff --git a/client/build/build.js b/client/build/build.js deleted file mode 100644 index 78ba7f23..00000000 --- a/client/build/build.js +++ /dev/null @@ -1,45 +0,0 @@ -'use strict'; -require('./check-versions')(); - -process.env.NODE_ENV = 'production'; - -const ora = require('ora'); -const rm = require('rimraf'); -const path = require('path'); -const chalk = require('chalk'); -const webpack = require('webpack'); -const config = require('../config'); -const webpackConfig = require('./webpack.prod.conf'); - -const spinner = ora('building for production...'); -spinner.start(); - -rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), (err) => { - if (err) throw err; - webpack(webpackConfig, (err, stats) => { - spinner.succeed(); - if (err) throw err; - process.stdout.write( - stats.toString({ - colors: true, - modules: false, - children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build. - chunks: false, - chunkModules: false, - }) + '\n\n' - ); - - if (stats.hasErrors()) { - console.log(chalk.red(' Build failed with errors.\n')); - process.exit(1); - } - - console.log(chalk.cyan(' Build complete.\n')); - console.log( - chalk.yellow( - ' Tip: built files are meant to be served over an HTTP server.\n' + - " Opening index.html over file:// won't work.\n" - ) - ); - }); -}); diff --git a/client/build/check-versions.js b/client/build/check-versions.js deleted file mode 100644 index 3999006d..00000000 --- a/client/build/check-versions.js +++ /dev/null @@ -1,53 +0,0 @@ -'use strict'; -const chalk = require('chalk'); -const semver = require('semver'); -const packageConfig = require('../package.json'); -const shell = require('shelljs'); - -function exec(cmd) { - return require('child_process').execSync(cmd).toString().trim(); -} - -const versionRequirements = [ - { - name: 'node', - currentVersion: semver.clean(process.version), - versionRequirement: packageConfig.engines.node, - }, -]; - -if (shell.which('npm')) { - versionRequirements.push({ - name: 'npm', - currentVersion: exec('npm --version'), - versionRequirement: packageConfig.engines.npm, - }); -} - -module.exports = function () { - const warnings = []; - - for (let i = 0; i < versionRequirements.length; i++) { - const mod = versionRequirements[i]; - - if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) { - warnings.push( - mod.name + ': ' + chalk.red(mod.currentVersion) + ' should be ' + chalk.green(mod.versionRequirement) - ); - } - } - - if (warnings.length) { - console.log(''); - console.log(chalk.yellow('To use this template, you must update following to modules:')); - console.log(); - - for (let i = 0; i < warnings.length; i++) { - const warning = warnings[i]; - console.log(' ' + warning); - } - - console.log(); - process.exit(1); - } -}; diff --git a/client/build/utils.js b/client/build/utils.js index 80059123..d193d38b 100644 --- a/client/build/utils.js +++ b/client/build/utils.js @@ -3,7 +3,7 @@ const path = require('path'); const config = require('../config'); const packageConfig = require('../package.json'); -const isDev = process.env.NODE_ENV !== 'production'; +const isDev = import.meta.env.MODE !== 'production'; const assetsPath = (_path) => { const assetsSubDirectory = isDev ? config.dev.assetsSubDirectory : config.build.assetsSubDirectory; diff --git a/client/config/prod-dha.env.js b/client/config/prod-dha.env.js index 5efa78c3..24689baf 100644 --- a/client/config/prod-dha.env.js +++ b/client/config/prod-dha.env.js @@ -1,17 +1,7 @@ -'use strict'; -module.exports = { - /* - * ENV variables used in JS code need to be stringyfied, as they will be replaced in the code, and JS needs quotes - * around strings - */ - VUE_APP_ENABLE_SPELLCHECK: !!process.env.TASKBASE_BASEURL, - - /* - * Vars used in HTML templates don't need to be stringyfied, as HTML does not need them to have quotes - */ - // vvvv HTML PROPERTIES FROM HERE, NOT STRINGIFIED vvvv +const config = { VUE_APP_FAVICON_32: 'https://skillbox-my-detailhandel-dha-prod.s3.eu-central-1.amazonaws.com/myDHA-favicon.png', VUE_APP_FAVICON_16: 'https://skillbox-my-detailhandel-dha-prod.s3.eu-central-1.amazonaws.com/myDHA-favicon.png', VUE_APP_TITLE: 'myDHA', - // ^^^^ HTML PROPERTIES TO HERE, NOT STRINGIFIED ^^^^ }; + +export default config; diff --git a/client/config/prod-dhf.env.js b/client/config/prod-dhf.env.js index fa5b1fca..4db3abc8 100644 --- a/client/config/prod-dhf.env.js +++ b/client/config/prod-dhf.env.js @@ -1,17 +1,7 @@ -'use strict'; -module.exports = { - /* - * ENV variables used in JS code need to be stringyfied, as they will be replaced in the code, and JS needs quotes - * around strings - */ - VUE_APP_ENABLE_SPELLCHECK: !!process.env.TASKBASE_BASEURL, - - /* - * Vars used in HTML templates don't need to be stringyfied, as HTML does not need them to have quotes - */ - // vvvv HTML PROPERTIES FROM HERE, NOT STRINGIFIED vvvv +const config = { VUE_APP_FAVICON_32: 'https://skillbox-my-detailhandel-dhf-prod.s3.eu-central-1.amazonaws.com/myDHF-favicon.png', VUE_APP_FAVICON_16: 'https://skillbox-my-detailhandel-dhf-prod.s3.eu-central-1.amazonaws.com/myDHF-favicon.png', VUE_APP_TITLE: 'myDHF', - // ^^^^ HTML PROPERTIES TO HERE, NOT STRINGIFIED ^^^^ }; + +export default config; diff --git a/client/config/prod-my-kv.env.js b/client/config/prod-my-kv.env.js index 797a8bca..26cf4771 100644 --- a/client/config/prod-my-kv.env.js +++ b/client/config/prod-my-kv.env.js @@ -1,17 +1,7 @@ -'use strict'; -module.exports = { - /* - * ENV variables used in JS code need to be stringyfied, as they will be replaced in the code, and JS needs quotes - * around strings - */ - VUE_APP_ENABLE_SPELLCHECK: !!process.env.TASKBASE_BASEURL, - - /* - * Vars used in HTML templates don't need to be stringyfied, as HTML does not need them to have quotes - */ - // vvvv HTML PROPERTIES FROM HERE, NOT STRINGIFIED vvvv +const config = { VUE_APP_FAVICON_32: 'https://skillbox-my-kv-prod.s3-eu-west-1.amazonaws.com/mykv-favicon.png', VUE_APP_FAVICON_16: 'https://skillbox-my-kv-prod.s3-eu-west-1.amazonaws.com/mykv-favicon.png', VUE_APP_TITLE: 'myKV', - // ^^^^ HTML PROPERTIES TO HERE, NOT STRINGIFIED ^^^^ }; + +export default config; diff --git a/client/config/prod.env.js b/client/config/prod.env.js deleted file mode 100644 index b85354b5..00000000 --- a/client/config/prod.env.js +++ /dev/null @@ -1,43 +0,0 @@ -'use strict'; -const { merge } = require('webpack-merge'); - -const values = { - NODE_ENV: '"production"', - HEP_URL: JSON.stringify(process.env.HEP_URL), - MATOMO_HOST: JSON.stringify(process.env.MATOMO_HOST), - MATOMO_SITE_ID: JSON.stringify(process.env.MATOMO_SITE_ID), - LOGOUT_REDIRECT_URL: JSON.stringify(process.env.LOGOUT_REDIRECT_URL), - VUE_APP_FLAVOR: JSON.stringify(process.env.APP_FLAVOR), - SENTRY_DSN: JSON.stringify(process.env.SENTRY_JAVASCRIPT_DSN), - SENTRY_ENVIRONMENT: JSON.stringify(process.env.SENTRY_ENV), - /* - * ENV variables used in JS code need to be stringyfied, as they will be replaced (in place) in the code, - * and JS needs quotes around strings - * see https://cli.vuejs.org/guide/mode-and-env.html#using-env-variables-in-client-side-code - */ - VUE_APP_ENABLE_SPELLCHECK: !!process.env.TASKBASE_BASEURL, - - /* - * Vars used in HTML templates don't need to be stringyfied, as HTML does not need them to have quotes - */ - // vvvv HTML PROPERTIES FROM HERE, NOT STRINGIFIED vvvv - VUE_APP_FAVICON_32: '/static/favicon-32x32.png', - VUE_APP_FAVICON_16: '/static/favicon-16x16.png', - VUE_APP_TITLE: 'mySkillbox', - // ^^^^ HTML PROPERTIES TO HERE, NOT STRINGIFIED ^^^^ -}; - -switch (process.env.APP_FLAVOR) { - case 'my-kv': - module.exports = merge(values, require('./prod-my-kv.env.js')); - break; - case 'my-dhf': - module.exports = merge(values, require('./prod-dhf.env.js')); - break; - case 'my-dha': - module.exports = merge(values, require('./prod-dha.env.js')); - break; - default: - // we are on the skillbox APP_FLAVOR - module.exports = values; -} diff --git a/client/cypress.frontend.ts b/client/cypress.frontend.ts index e79eef78..94633644 100644 --- a/client/cypress.frontend.ts +++ b/client/cypress.frontend.ts @@ -37,11 +37,7 @@ export default defineConfig({ component: { devServer: { framework: 'vue', - bundler: 'webpack', - webpackConfig: async () => { - const webpackConfig = await require('./build/webpack.dev.conf'); - return webpackConfig; - }, + bundler: 'vite', }, }, }); diff --git a/client/cypress/e2e/frontend/modules/snapshots.spec.js b/client/cypress/e2e/frontend/modules/snapshots.spec.js index feb5e6d8..becc562b 100644 --- a/client/cypress/e2e/frontend/modules/snapshots.spec.js +++ b/client/cypress/e2e/frontend/modules/snapshots.spec.js @@ -245,7 +245,8 @@ describe('Snapshot', () => { cy.visit('module/miteinander-reden/snapshots'); cy.getByDataCy('snapshot-link').should('have.text', 'Old Title'); cy.getByDataCy('rename-snapshot-button').click(); - cy.getByDataCy('edit-name-input').clear().type(newTitle); + cy.getByDataCy('edit-name-input').clear(); + cy.getByDataCy('edit-name-input').type(newTitle); cy.getByDataCy('modal-save-button').click(); cy.getByDataCy('snapshot-link').should('have.text', 'New Title'); waitNTimes(5); diff --git a/client/cypress/e2e/frontend/rooms/room-page.spec.js b/client/cypress/e2e/frontend/rooms/room-page.spec.js index 7f422769..44ab8557 100644 --- a/client/cypress/e2e/frontend/rooms/room-page.spec.js +++ b/client/cypress/e2e/frontend/rooms/room-page.spec.js @@ -1,12 +1,12 @@ -import { getMinimalMe } from '../../../support/helpers'; +import { getMinimalMe } from '../../../support/helpers' describe('The Room Page (Teacher)', () => { - const MeQuery = getMinimalMe(); - const selectedClass = MeQuery.me.selectedClass; - const entryText = 'something should be here'; - const entryTitle = 'some title'; - const slug = 'ein-historisches-festival'; - const id = btoa('RoomNode:1'); + const MeQuery = getMinimalMe() + const selectedClass = MeQuery.me.selectedClass + const entryText = 'something should be here' + const entryTitle = 'some title' + const slug = 'ein-historisches-festival' + const id = btoa('RoomNode:1') const room = { id, slug, @@ -15,11 +15,11 @@ describe('The Room Page (Teacher)', () => { roomEntries: { edges: [], }, - }; + } const RoomEntriesQuery = { room, - }; + } const operations = { MeQuery, @@ -46,38 +46,42 @@ describe('The Room Page (Teacher)', () => { errors: [], }, }, - }; + } const checkRadioButton = () => { - cy.get('.base-input-container__input:checked + .base-input-container__radiobutton svg').should('have.length', 1); - }; + cy.get( + '.base-input-container__input:checked + .base-input-container__radiobutton svg' + ).should('have.length', 1) + } beforeEach(() => { - cy.setup(); - }); + cy.setup() + }) it('displays new room entry with author name', () => { cy.mockGraphqlOps({ operations, - }); - cy.visit(`/room/${slug}`); + }) + cy.visit(`/room/${slug}`) - cy.getByDataCy('add-room-entry-button').click(); - cy.getByDataCy('add-content-link').first().click(); - cy.getByDataCy('choose-text-widget').click(); - cy.getByDataCy('input-with-label-input').type(entryTitle); + cy.getByDataCy('add-room-entry-button').click() + cy.getByDataCy('add-content-link').first().click() + cy.getByDataCy('choose-text-widget').click() + cy.getByDataCy('input-with-label-input').type(entryTitle) - cy.get('.tip-tap__editor').type(entryText); - cy.getByDataCy('save-button').click(); + cy.get('.tip-tap__editor').type(entryText) + cy.getByDataCy('save-button').click() - cy.get('.room-entry__content:first').should('contain', entryText).should('contain', 'Rachel Green'); - }); + cy.get('.room-entry__content:first') + .should('contain', entryText) + .should('contain', 'Rachel Green') + }) // todo: re-enable once cypress can do it correctly it.skip('changes visibility of a room', () => { const MeQuery = getMinimalMe({ isTeacher: true, - }); + }) const operations = { MeQuery, RoomEntriesQuery, @@ -90,61 +94,72 @@ describe('The Room Page (Teacher)', () => { }, }, }, - }; + } cy.mockGraphqlOps({ operations, - }); + }) - cy.visit(`/room/${slug}`); - cy.getByDataCy('room-visibility-status').should('contain', 'alle Lernenden'); - cy.getByDataCy('toggle-more-actions-menu').click(); - cy.getByDataCy('change-visibility').click(); - cy.getByDataCy('modal-title').should('contain', 'Sichtbarkeit anpassen'); - cy.get('.change-visibility__radio').should('have.length', 2); - cy.get('.change-visibility__radio--selected').should('have.length', 1); - checkRadioButton(); - cy.get('.change-visibility__radio--selected').should('have.length', 1).should('contain', 'alle Lernenden'); - checkRadioButton(); - cy.getByDataCy('select-option').eq(0).click(); - cy.get('.change-visibility__radio--selected').should('have.length', 1); - checkRadioButton(); - cy.getByDataCy('select-option').eq(1).click(); - cy.getByDataCy('select-option').eq(1).click(); - cy.get('.change-visibility__radio--selected').should('have.length', 1).should('contain', 'eigenen Beiträge'); - checkRadioButton(); - cy.getByDataCy('modal-save-button').click(); - cy.getByDataCy('room-visibility-status').should('contain', 'eigenen Beiträge'); - cy.getByDataCy('toggle-more-actions-menu').click(); - cy.getByDataCy('change-visibility').click(); - cy.getByDataCy('modal-title').should('contain', 'Sichtbarkeit anpassen'); - cy.get('.change-visibility__radio--selected').should('have.length', 1).should('contain', 'eigenen Beiträge'); - checkRadioButton(); - }); + cy.visit(`/room/${slug}`) + cy.getByDataCy('room-visibility-status').should('contain', 'alle Lernenden') + cy.getByDataCy('toggle-more-actions-menu').click() + cy.getByDataCy('change-visibility').click() + cy.getByDataCy('modal-title').should('contain', 'Sichtbarkeit anpassen') + cy.get('.change-visibility__radio').should('have.length', 2) + cy.get('.change-visibility__radio--selected').should('have.length', 1) + checkRadioButton() + cy.get('.change-visibility__radio--selected') + .should('have.length', 1) + .should('contain', 'alle Lernenden') + checkRadioButton() + cy.getByDataCy('select-option').eq(0).click() + cy.get('.change-visibility__radio--selected').should('have.length', 1) + checkRadioButton() + cy.getByDataCy('select-option').eq(1).click() + cy.getByDataCy('select-option').eq(1).click() + cy.get('.change-visibility__radio--selected') + .should('have.length', 1) + .should('contain', 'eigenen Beiträge') + checkRadioButton() + cy.getByDataCy('modal-save-button').click() + cy.getByDataCy('room-visibility-status').should( + 'contain', + 'eigenen Beiträge' + ) + cy.getByDataCy('toggle-more-actions-menu').click() + cy.getByDataCy('change-visibility').click() + cy.getByDataCy('modal-title').should('contain', 'Sichtbarkeit anpassen') + cy.get('.change-visibility__radio--selected') + .should('have.length', 1) + .should('contain', 'eigenen Beiträge') + checkRadioButton() + }) it('deletes the room and goes back to the overview', () => { - const MeQuery = getMinimalMe(); - const schoolClass = MeQuery.me.selectedClass; + const MeQuery = getMinimalMe() + const schoolClass = MeQuery.me.selectedClass const roomToDelete = { - id: btoa('RoomNode:room-to-delete'), + id: window.btoa('RoomNode:room-to-delete'), + title: 'Delete Me', schoolClass, slug: 'delete-me', roomEntries: { edges: [], }, - }; + } const otherRoom = { - id: btoa('RoomNode:otherRoom'), + id: window.btoa('RoomNode:otherRoom'), slug: 'other-slug', + title: 'Other Room', schoolClass, - }; - let rooms = [roomToDelete, otherRoom]; + } + let rooms = [roomToDelete, otherRoom] const operations = { MeQuery, RoomsQuery() { return { rooms, - }; + } }, RoomEntriesQuery: { room: roomToDelete, @@ -154,31 +169,32 @@ describe('The Room Page (Teacher)', () => { success: true, }, }, - }; + } cy.mockGraphqlOps({ operations, - }); + }) - cy.visit(`/rooms`); - cy.getByDataCy('room-widget').should('have.length', 2); - cy.getByDataCy('room-widget').first().click(); - cy.getByDataCy('toggle-more-actions-menu').click(); + cy.visit(`/rooms`) + cy.getByDataCy('room-widget').should('have.length', 2) + cy.getByDataCy('room-widget').first().click() + cy.getByDataCy('room-title').should('contain', 'Delete Me') + cy.getByDataCy('toggle-more-actions-menu').click() cy.getByDataCy('delete-room').within(() => { - cy.get('a').click(); - }); - cy.getByDataCy('modal-save-button').click(); - cy.url().should('include', 'rooms'); - cy.getByDataCy('room-widget').should('have.length', 1); - }); + cy.get('a').click() + }) + cy.getByDataCy('modal-save-button').click() + cy.url().should('include', 'rooms') + cy.getByDataCy('room-widget').should('have.length', 1) + }) it('changes class while on room page', () => { - const { me } = MeQuery; + const { me } = MeQuery const otherClass = { - id: btoa('SchoolClassNode:34'), + id: window.btoa('SchoolClassNode:34'), name: 'Other Class', readOnly: false, - }; - let selectedClass = me.selectedClass; + } + let selectedClass = me.selectedClass const operations = { MeQuery: () => { return { @@ -187,16 +203,16 @@ describe('The Room Page (Teacher)', () => { schoolClasses: [...me.schoolClasses, otherClass], selectedClass, }, - }; + } }, RoomEntriesQuery, UpdateSettings() { - selectedClass = otherClass; + selectedClass = otherClass return { updateSettings: { success: true, }, - }; + } }, ModuleDetailsQuery: {}, MySchoolClassQuery: () => { @@ -204,32 +220,32 @@ describe('The Room Page (Teacher)', () => { me: { selectedClass, }, - }; + } }, RoomsQuery: { rooms: [], }, - }; + } cy.mockGraphqlOps({ operations, - }); - cy.visit(`/room/${slug}`); - cy.getByDataCy('room-title').should('contain', 'A Room'); - cy.selectClass('Other Class'); - cy.url().should('include', 'rooms'); - cy.getByDataCy('current-class-name').should('contain', 'Other Class'); - }); -}); + }) + cy.visit(`/room/${slug}`) + cy.getByDataCy('room-title').should('contain', 'A Room') + cy.selectClass('Other Class') + cy.url().should('include', 'rooms') + cy.getByDataCy('current-class-name').should('contain', 'Other Class') + }) +}) describe('The Room Page (student)', () => { - const slug = 'ein-historisches-festival'; - const MeQuery = getMinimalMe({ isTeacher: false }); - const { me } = MeQuery; - const id = atob(me.id).split(':')[1]; - const authorId = btoa(`PublicUserNode:${id}`); - const entrySlug = 'entry-slug'; - const { selectedClass } = me; + const slug = 'ein-historisches-festival' + const MeQuery = getMinimalMe({ isTeacher: false }) + const { me } = MeQuery + const id = atob(me.id).split(':')[1] + const authorId = btoa(`PublicUserNode:${id}`) + const entrySlug = 'entry-slug' + const { selectedClass } = me const roomEntry = { id: 'entry-id', slug: entrySlug, @@ -250,7 +266,7 @@ describe('The Room Page (student)', () => { lastName: 'Was Heiri', avatarUrl: '', }, - }; + } const room = { id, slug, @@ -263,55 +279,58 @@ describe('The Room Page (student)', () => { }, ], }, - }; + } const RoomEntriesQuery = { room, - }; + } beforeEach(() => { - cy.setup(); - }); + cy.setup() + }) it('room actions should not exist for student', () => { const operations = { MeQuery: getMinimalMe({ isTeacher: false }), RoomEntriesQuery, - }; + } cy.mockGraphqlOps({ operations, - }); - cy.visit(`/room/${slug}`); + }) + cy.visit(`/room/${slug}`) - cy.getByDataCy('room-title').should('exist'); - cy.getByDataCy('room-actions').should('not.exist'); - }); + cy.getByDataCy('room-title').should('exist') + cy.getByDataCy('room-actions').should('not.exist') + }) it('creates a room entry', () => { - const MeQuery = getMinimalMe({ isTeacher: false }); + const MeQuery = getMinimalMe({ isTeacher: false }) const room = { id: 'some-room', roomEntries: { edges: [], }, - }; + } const operations = { MeQuery, RoomEntriesQuery: { room, }, - }; + } cy.mockGraphqlOps({ operations, - }); + }) - cy.visit(`/room/${slug}`); - cy.getByDataCy('add-room-entry-button').click(); + cy.visit(`/room/${slug}`) + cy.getByDataCy('add-room-entry-button').click() - cy.getByDataCy('content-form-section-title').should('have.text', 'Titel (Pflichtfeld)'); - }); + cy.getByDataCy('content-form-section-title').should( + 'have.text', + 'Titel (Pflichtfeld)' + ) + }) it('edits own room entry', () => { const room = { @@ -325,7 +344,7 @@ describe('The Room Page (student)', () => { }, ], }, - }; + } const operations = { MeQuery: MeQuery, RoomEntriesQuery: { @@ -334,15 +353,15 @@ describe('The Room Page (student)', () => { RoomEntryQuery: { roomEntry, }, - }; + } cy.mockGraphqlOps({ operations, - }); - cy.visit(`/room/${slug}`); - cy.getByDataCy('room-entry-actions').click(); - cy.getByDataCy('edit-room-entry').click(); - cy.location('pathname').should('include', entrySlug); - }); + }) + cy.visit(`/room/${slug}`) + cy.getByDataCy('room-entry-actions').click() + cy.getByDataCy('edit-room-entry').click() + cy.location('pathname').should('include', entrySlug) + }) it('deletes room entry', () => { const DeleteRoomEntry = { @@ -351,57 +370,57 @@ describe('The Room Page (student)', () => { errors: null, roomSlug: slug, }, - }; + } const operations = { MeQuery, RoomEntriesQuery, DeleteRoomEntry, - }; + } cy.mockGraphqlOps({ operations, - }); + }) - cy.visit(`/room/${slug}`); - cy.getByDataCy('room-entry').should('have.length', 1); - cy.getByDataCy('room-entry-actions').click(); - cy.getByDataCy('delete-room-entry').click(); - cy.getByDataCy('delete-room-entry').should('not.exist'); - cy.getByDataCy('modal-save-button').click(); - cy.getByDataCy('room-entry').should('have.length', 0); - }); + cy.visit(`/room/${slug}`) + cy.getByDataCy('room-entry').should('have.length', 1) + cy.getByDataCy('room-entry-actions').click() + cy.getByDataCy('delete-room-entry').click() + cy.getByDataCy('delete-room-entry').should('not.exist') + cy.getByDataCy('modal-save-button').click() + cy.getByDataCy('room-entry').should('have.length', 0) + }) it('shows room entries with comment count', () => { const operations = { MeQuery, RoomEntriesQuery, - }; + } cy.mockGraphqlOps({ operations, - }); + }) - cy.visit(`/room/${slug}`); + cy.visit(`/room/${slug}`) cy.getByDataCy('room-entry') .should('have.length', 1) .within(() => { - cy.getByDataCy('entry-count').should('contain.text', '2'); - }); - }); + cy.getByDataCy('entry-count').should('contain.text', '2') + }) + }) it('does not show actions on mobile', () => { const operations = { MeQuery, RoomEntriesQuery, - }; + } cy.mockGraphqlOps({ operations, - }); - cy.viewport('iphone-8'); + }) + cy.viewport('iphone-8') - cy.visit(`/room/${slug}`); - cy.getByDataCy('room-actions').should('not.exist'); - cy.getByDataCy('room-entry').should('have.length', 1); - cy.getByDataCy('room-entry-actions').should('not.be.visible'); - }); -}); + cy.visit(`/room/${slug}`) + cy.getByDataCy('room-actions').should('not.exist') + cy.getByDataCy('room-entry').should('have.length', 1) + cy.getByDataCy('room-entry-actions').should('not.be.visible') + }) +}) diff --git a/client/index.html b/client/index.html index a2f288ef..3d8524db 100644 --- a/client/index.html +++ b/client/index.html @@ -4,17 +4,15 @@
-