fix(frontend): replace blockquote extra cypress test with jest test

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-02-13 17:22:10 +01:00
parent 08eaff862d
commit 34b6308cee
3 changed files with 215 additions and 52 deletions

View file

@ -1,52 +0,0 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
describe('Quote extra tags', function () {
beforeEach(() => {
cy.visitTestNote()
})
describe('Name quote tag', () => {
it('renders correctly', () => {
cy.setCodemirrorContent('[name=testy mctestface]')
cy.getMarkdownBody().find('.blockquote-extra').should('be.visible').find('.fa-user').should('be.visible')
cy.getMarkdownBody().find('.blockquote-extra').should('be.visible').contains('testy mctestface')
})
})
describe('Time quote tag', () => {
it('renders correctly', () => {
cy.setCodemirrorContent(`[time=always]`)
cy.getMarkdownBody().find('.blockquote-extra').should('be.visible').find('.fa-clock-o').should('be.visible')
cy.getMarkdownBody().find('.blockquote-extra').should('be.visible').contains('always')
})
})
describe('Color quote tag', () => {
it('renders correctly', () => {
cy.setCodemirrorContent(`[color=#b51f08]`)
cy.getMarkdownBody().find('.blockquote-extra').should('be.visible').find('.fa-tag').should('be.visible')
cy.getMarkdownBody().find('.blockquote-extra').should('be.visible').should('have.css', 'color', 'rgb(181, 31, 8)')
})
it("doesn't render in a blockquote and dyes the blockquote border", () => {
cy.setCodemirrorContent(`> [color=#b51f08] HedgeDoc`)
cy.getMarkdownBody().find('.blockquote-extra').should('not.exist')
cy.getMarkdownBody()
.find('blockquote')
.should('be.visible')
.should('have.css', 'border-left-color', 'rgb(181, 31, 8)')
})
})
})

View file

@ -0,0 +1,181 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`blockquote extra tag renders the tag "> [color=#f00] text" correctly 1`] = `
<div>
<blockquote
style="border-left-color: #f00;"
>
<p>
text
</p>
</blockquote>
</div>
`;
exports[`blockquote extra tag renders the tag "[=value]" correctly 1`] = `
<div>
<p>
[=value]
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[color=#abcdef]" correctly 1`] = `
<div>
<p>
<span
class="blockquote-extra"
style="color: rgb(171, 205, 239);"
>
<i
class="fa fa-tag mx-1 "
/>
</span>
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[color=#dfe]" correctly 1`] = `
<div>
<p>
<span
class="blockquote-extra"
style="color: rgb(221, 255, 238);"
>
<i
class="fa fa-tag mx-1 "
/>
</span>
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[color=]" correctly 1`] = `
<div>
<p>
[color=]
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[color=notarealcolor]" correctly 1`] = `
<div>
<p>
<span
class="blockquote-extra"
>
<i
class="fa fa-tag mx-1 "
/>
notarealcolor
</span>
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[color=white]" correctly 1`] = `
<div>
<p>
<span
class="blockquote-extra"
style="color: white;"
>
<i
class="fa fa-tag mx-1 "
/>
</span>
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[key=]" correctly 1`] = `
<div>
<p>
[key=]
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[key]" correctly 1`] = `
<div>
<p>
[key]
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[name=]" correctly 1`] = `
<div>
<p>
[name=]
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[name=giowehg]" correctly 1`] = `
<div>
<p>
<span
class="blockquote-extra"
>
<i
class="fa fa-user mx-1 "
/>
giowehg
</span>
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[time=]" correctly 1`] = `
<div>
<p>
[time=]
</p>
</div>
`;
exports[`blockquote extra tag renders the tag "[time=tomorrow]" correctly 1`] = `
<div>
<p>
<span
class="blockquote-extra"
>
<i
class="fa fa-clock-o mx-1 "
/>
tomorrow
</span>
</p>
</div>
`;

View file

@ -0,0 +1,34 @@
/*
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { TestMarkdownRenderer } from '../../../components/markdown-renderer/test-utils/test-markdown-renderer'
import { BlockquoteExtraTagMarkdownExtension } from './blockquote-extra-tag-markdown-extension'
import { render } from '@testing-library/react'
import React from 'react'
describe('blockquote extra tag', () => {
;[
'[color=white]',
'[color=#dfe]',
'[color=notarealcolor]',
'[color=#abcdef]',
'[color=]',
'[name=giowehg]',
'[name=]',
'[time=tomorrow]',
'[time=]',
'[key]',
'[key=]',
'[=value]',
'> [color=#f00] text'
].forEach((content) => {
it(`renders the tag "${content}" correctly`, () => {
const view = render(
<TestMarkdownRenderer extensions={[new BlockquoteExtraTagMarkdownExtension()]} content={content} />
)
expect(view.container).toMatchSnapshot()
})
})
})