Change motd banner to motd modal

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2021-10-09 19:09:29 +02:00
parent 328bc917eb
commit ee7cde0096
26 changed files with 361 additions and 269 deletions

View file

@ -1,80 +0,0 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
const BANNER_LOCAL_STORAGE_KEY = 'banner.lastModified'
const MOCK_LAST_MODIFIED = 'mockETag'
const bannerMockContent = 'This is the mock banner call'
describe('Banner', () => {
beforeEach(() => {
cy.intercept({
method: 'GET',
url: '/mock-backend/public/banner.txt'
}, {
statusCode: 200,
headers: { 'Last-Modified': MOCK_LAST_MODIFIED },
body: bannerMockContent
})
cy.intercept({
method: 'HEAD',
url: '/mock-backend/public/banner.txt'
}, {
statusCode: 200,
headers: { 'Last-Modified': MOCK_LAST_MODIFIED }
})
.as('headBanner')
cy.visit('/')
localStorage.removeItem(BANNER_LOCAL_STORAGE_KEY)
expect(localStorage.getItem(BANNER_LOCAL_STORAGE_KEY)).to.be.null
})
it('shows the correct alert banner text', () => {
cy.get('[data-cy="motd-banner"]')
.contains(bannerMockContent)
})
it('can be dismissed', () => {
cy.get('[data-cy="motd-banner"]')
.contains(bannerMockContent)
cy.get('button[data-cy="motd-dismiss"]')
.click()
.then(() => {
expect(localStorage.getItem(BANNER_LOCAL_STORAGE_KEY))
.to
.equal(MOCK_LAST_MODIFIED)
})
cy.get('[data-cy="no-motd-banner"]')
.should('exist')
cy.get('[data-cy="motd-banner"]')
.should('not.exist')
})
it('won\'t show again on reload', () => {
cy.get('[data-cy="motd-banner"]')
.contains(bannerMockContent)
cy.get('button[data-cy="motd-dismiss"]')
.click()
.then(() => {
expect(localStorage.getItem(BANNER_LOCAL_STORAGE_KEY))
.to
.equal(MOCK_LAST_MODIFIED)
})
cy.get('[data-cy="no-motd-banner"]')
.should('exist')
cy.get('[data-cy="motd-banner"]')
.should('not.exist')
cy.reload()
cy.get('main')
.should('exist')
cy.wait('@headBanner')
cy.get('[data-cy="no-motd-banner"]')
.should('exist')
cy.get('[data-cy="motd-banner"]')
.should('not.exist')
})
})

View file

@ -0,0 +1,91 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
const MOTD_LOCAL_STORAGE_KEY = 'motd.lastModified'
const MOCK_LAST_MODIFIED = 'mockETag'
const motdMockContent = 'This is the mock Motd call'
describe('Motd', () => {
const mockExistingMotd = () => {
cy.intercept('GET', '/mock-backend/public/motd.txt', {
statusCode: 200,
headers: { 'Last-Modified': MOCK_LAST_MODIFIED },
body: motdMockContent
})
cy.intercept('HEAD', '/mock-backend/public/motd.txt', {
statusCode: 200,
headers: { 'Last-Modified': MOCK_LAST_MODIFIED }
})
}
beforeEach(() => {
localStorage.removeItem(MOTD_LOCAL_STORAGE_KEY)
})
it('shows the correct alert Motd text', () => {
mockExistingMotd()
cy.visit('/')
cy.get('[data-cy="motd"]').contains(motdMockContent)
})
it('can be dismissed', () => {
mockExistingMotd()
cy.visit('/')
cy.get('[data-cy="motd"]').contains(motdMockContent)
cy.get('button[data-cy="motd-dismiss"]')
.click()
.then(() => {
expect(localStorage.getItem(MOTD_LOCAL_STORAGE_KEY)).to.equal(MOCK_LAST_MODIFIED)
})
cy.get('[data-cy="motd"]').should('not.exist')
})
it("won't show again after dismiss and reload", () => {
mockExistingMotd()
cy.visit('/')
cy.get('[data-cy="motd"]').contains(motdMockContent)
cy.get('button[data-cy="motd-dismiss"]')
.click()
.then(() => {
expect(localStorage.getItem(MOTD_LOCAL_STORAGE_KEY)).to.equal(MOCK_LAST_MODIFIED)
})
cy.get('[data-cy="motd"]').should('not.exist')
cy.reload()
cy.get('main').should('exist')
cy.get('[data-cy="motd"]').should('not.exist')
})
it("will show again after reload without dismiss", () => {
mockExistingMotd()
cy.visit('/')
cy.get('[data-cy="motd"]').contains(motdMockContent)
cy.reload()
cy.get('main').should('exist')
cy.get('[data-cy="motd"]').contains(motdMockContent)
})
it("won't show again after dismiss and page navigation", () => {
mockExistingMotd()
cy.visit('/')
cy.get('[data-cy="motd"]').contains(motdMockContent)
cy.get('button[data-cy="motd-dismiss"]')
.click()
.then(() => {
expect(localStorage.getItem(MOTD_LOCAL_STORAGE_KEY)).to.equal(MOCK_LAST_MODIFIED)
})
cy.get('[data-cy="motd"]').should('not.exist')
cy.get('#navLinkHistory').click()
cy.get('main').should('exist')
cy.get('[data-cy="motd"]').should('not.exist')
})
it("won't show if no file exists", () => {
cy.visit('/')
cy.get('main').should('exist')
cy.get('[data-cy="motd"]').should('not.exist')
})
})