mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-09 13:51:57 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

test(frontend): replace jest with vitest

Browse source 
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2025-04-26 14:27:29 +02:00
parent 5241a6e988
commit 49bbd32635
No known key found for this signature in database
GPG key ID: FE1CD209E3EA5E85
188 changed files with 1364 additions and 1212 deletions
Download patch file Download diff file Expand all files Collapse all files

2
commons/src/frontmatter-extractor/extractor.spec.ts
View file

@ -4,7 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { extractFrontmatter } from './extractor.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('frontmatter extraction', () => {
describe('isPresent property', () => {

2
commons/src/note-frontmatter-parser/convert-raw-frontmatter-to-note-frontmatter.spec.ts
View file

@ -11,7 +11,7 @@ import {
} from '../note-frontmatter/frontmatter.js'
import { SlideOptions } from '../note-frontmatter/slide-show-options.js'
import { convertRawFrontmatterToNoteFrontmatter } from './convert-raw-frontmatter-to-note-frontmatter.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('convertRawFrontmatterToNoteFrontmatter', () => {
it.each([false, true])(

2
commons/src/note-frontmatter-parser/parse-raw-frontmatter-from-yaml.spec.ts
View file

@ -4,7 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { parseRawFrontmatterFromYaml } from './parse-raw-frontmatter-from-yaml.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('yaml frontmatter', () => {
it('should parse "title"', () => {

2
commons/src/parse-url/parse-url.spec.ts
View file

@ -5,7 +5,7 @@
*/
import { NoSubdirectoryAllowedError, WrongProtocolError } from './errors.js'
import { parseUrl } from './parse-url.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('validate url', () => {
it("doesn't accept non-urls", () => {

2
commons/src/permissions/permissions.spec.ts
View file

@ -4,7 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { userCanEdit, userIsOwner } from './permissions.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { NotePermissionsDto, SpecialGroup } from '../dtos/index.js'
describe('Permissions', () => {

2
commons/src/title-extraction/extract-first-heading.spec.ts
View file

@ -4,7 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { extractFirstHeading } from './extract-first-heading.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { Document, Element, Text } from 'domhandler'
describe('extract first heading', () => {

2
commons/src/title-extraction/generate-note-title.spec.ts
View file

@ -9,7 +9,7 @@ import {
NoteType,
} from '../note-frontmatter/frontmatter.js'
import { generateNoteTitle } from './generate-note-title.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
const testFrontmatter: NoteFrontmatter = {
title: '',

2
commons/src/y-doc-sync/realtime-doc.spec.ts
View file

@ -4,7 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { RealtimeDoc } from './realtime-doc.js'
import { describe, expect, it } from 'vitest'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('realtime doc', () => {
it('saves an initial text content correctly', () => {

14
frontend/package.json
View file

@ -19,9 +19,9 @@
"test:e2e:open": "cypress open",
"test:e2e": "cypress run --browser chrome",
"test:e2e:ci": "cypress run --browser chrome --record true --parallel --group \"chrome\"",
"test:watch": "cross-env NODE_OPTIONS=\"${NODE_OPTIONS:-} --experimental-vm-modules\" NODE_ENV=test jest --watch",
"test:ci": "cross-env NODE_OPTIONS=\"${NODE_OPTIONS:-} --experimental-vm-modules\" NODE_ENV=test jest --coverage",
"test": "cross-env NODE_OPTIONS=\"${NODE_OPTIONS:-} --experimental-vm-modules\" NODE_ENV=test jest"
"test:watch": "cross-env NODE_OPTIONS=\"${NODE_OPTIONS:-} --experimental-vm-modules\" NODE_ENV=test vitest --watch",
"test:ci": "cross-env NODE_OPTIONS=\"${NODE_OPTIONS:-} --experimental-vm-modules\" NODE_ENV=test vitest --coverage",
"test": "cross-env NODE_OPTIONS=\"${NODE_OPTIONS:-} --experimental-vm-modules\" NODE_ENV=test vitest"
},
"browserslist": [
"Chrome 118",
@ -131,7 +131,6 @@
"@types/d3-graphviz": "2.6.10",
"@types/diff": "6.0.0",
"@types/dompurify": "3.0.5",
"@types/jest": "29.5.14",
"@types/katex": "0.16.7",
"@types/luxon": "3.4.2",
"@types/markdown-it": "13.0.8",
@ -141,6 +140,7 @@
"@types/react": "19.1.2",
"@types/react-dom": "19.1.2",
"@types/ws": "8.5.12",
"@vitejs/plugin-react": "4.4.1",
"csstype": "3.1.3",
"cypress": "13.17.0",
"cypress-commands": "3.0.0",
@ -156,8 +156,7 @@
"eslint-plugin-prettier": "5.2.6",
"eslint-plugin-promise": "7.2.1",
"eslint-plugin-testing-library": "7.1.1",
"jest": "29.7.0",
"jest-environment-jsdom": "29.7.0",
"jsdom": "26.1.0",
"prettier": "3.3.3",
"react-test-renderer": "18.3.1",
"ts-loader": "9.5.2",
@ -165,7 +164,8 @@
"ts-node": "11.0.0-beta.1",
"typescript": "5.6.3",
"typescript-eslint": "8.31.0",
"user-agent-data-types": "0.4.2"
"user-agent-data-types": "0.4.2",
"vitest": "3.1.2"
},
"packageManager": "yarn@4.5.3",
"resolutions": {

1
frontend/src/api/common/api-request-builder/delete-api-request-builder.spec.ts
View file

@ -7,6 +7,7 @@ import { ApiError } from '../api-error'
import type { ApiErrorResponse } from '../api-error-response'
import { DeleteApiRequestBuilder } from './delete-api-request-builder'
import { expectFetch } from './test-utils/expect-fetch'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('DeleteApiRequestBuilder', () => {
let originalFetch: (typeof global)['fetch']

1
frontend/src/api/common/api-request-builder/get-api-request-builder.spec.ts
View file

@ -7,6 +7,7 @@ import { ApiError } from '../api-error'
import type { ApiErrorResponse } from '../api-error-response'
import { GetApiRequestBuilder } from './get-api-request-builder'
import { expectFetch } from './test-utils/expect-fetch'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('GetApiRequestBuilder', () => {
let originalFetch: (typeof global)['fetch']

1
frontend/src/api/common/api-request-builder/post-api-request-builder.spec.ts
View file

@ -7,6 +7,7 @@ import { ApiError } from '../api-error'
import type { ApiErrorResponse } from '../api-error-response'
import { PostApiRequestBuilder } from './post-api-request-builder'
import { expectFetch } from './test-utils/expect-fetch'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('PostApiRequestBuilder', () => {
let originalFetch: (typeof global)['fetch']

1
frontend/src/api/common/api-request-builder/put-api-request-builder.spec.ts
View file

@ -7,6 +7,7 @@ import { ApiError } from '../api-error'
import type { ApiErrorResponse } from '../api-error-response'
import { PutApiRequestBuilder } from './put-api-request-builder'
import { expectFetch } from './test-utils/expect-fetch'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('PutApiRequestBuilder', () => {
let originalFetch: (typeof global)['fetch']

5
frontend/src/api/common/api-request-builder/test-utils/expect-fetch.ts
View file

@ -5,6 +5,7 @@
*/
import { defaultConfig } from '../../default-config'
import { Mock } from 'ts-mockery'
import { vi, expect } from 'vitest'
/**
* Mock fetch api for tests.
@ -20,7 +21,7 @@ export const expectFetch = (
expectedOptions: RequestInit,
responseBody?: unknown
): void => {
global.fetch = jest.fn((fetchUrl: RequestInfo | URL, fetchOptions?: RequestInit): Promise<Response> => {
global.fetch = vi.fn((fetchUrl: RequestInfo | URL, fetchOptions?: RequestInit): Promise<Response> => {
expect(fetchUrl).toEqual(expectedUrl)
expect(fetchOptions).toStrictEqual({
...defaultConfig,
@ -32,7 +33,7 @@ export const expectFetch = (
Mock.of<Response>({
status: requestStatusCode,
statusText: mapCodeToText(requestStatusCode),
json: jest.fn(() => (responseBody ? Promise.resolve(responseBody) : Promise.reject(new Error())))
json: vi.fn(() => (responseBody ? Promise.resolve(responseBody) : Promise.reject(new Error())))
})
)
}) as typeof global.fetch

1
frontend/src/api/common/api-response.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { ApiResponse } from './api-response'
import { Mock } from 'ts-mockery'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('ApiResponse', () => {
it('getResponse returns input response', () => {

1
frontend/src/api/common/error-to-i18n-key-mapper.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { ApiError } from './api-error'
import { ErrorToI18nKeyMapper } from './error-to-i18n-key-mapper'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('ErrorToI18nKeyMapper', () => {
it('returns fallback with namespace when no mapper is defined', () => {

39
frontend/src/app/(editor)/@appBar/n/[noteId]/__snapshots__/editor-app-bar.spec.tsx.snap
View file

@ -1,20 +1,12 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`app bar contains alert when editor is not synced 1`] = `
exports[`app bar > contains alert when editor is not synced 1`] = `
<div>
<div>
<span>
first part
</span>
<div>
<div
class="fade w-100 m-0 px-2 py-1 border-top-0 border-bottom-0 d-flex align-items-center alert alert-warning show"
role="alert"
>
realtime.connecting
BootstrapIconMock_ArrowRepeat
</div>
</div>
<div />
<span>
last part
</span>
@ -22,24 +14,13 @@ exports[`app bar contains alert when editor is not synced 1`] = `
</div>
`;
exports[`app bar contains note title and read-only marker when having only read permissions 1`] = `
exports[`app bar > contains note title and read-only marker when having only read permissions 1`] = `
<div>
<div>
<span>
first part
</span>
<div>
<span
class="m-0 text-truncate"
>
<span
class="text-secondary me-2"
>
BootstrapIconMock_Lock
</span>
Note Title Test
</span>
</div>
<div />
<span>
last part
</span>
@ -47,19 +28,13 @@ exports[`app bar contains note title and read-only marker when having only read
</div>
`;
exports[`app bar contains note title when editor is synced 1`] = `
exports[`app bar > contains note title when editor is synced 1`] = `
<div>
<div>
<span>
first part
</span>
<div>
<span
class="m-0 text-truncate"
>
Note Title Test
</span>
</div>
<div />
<span>
last part
</span>

7
frontend/src/app/(editor)/@appBar/n/[noteId]/editor-app-bar.spec.tsx
View file

@ -10,8 +10,9 @@ import { render } from '@testing-library/react'
import type { PropsWithChildren } from 'react'
import React from 'react'
import { mockAppState } from '../../../../../test-utils/mock-app-state'
import { vi, describe, it, beforeAll, afterAll, expect } from 'vitest'
jest.mock('../../../../../components/layout/app-bar/base-app-bar', () => ({
vi.mock('../../../../../components/layout/app-bar/base-app-bar', () => ({
__esModule: true,
BaseAppBar: ({ children }: PropsWithChildren) => (
<div>
@ -21,7 +22,7 @@ jest.mock('../../../../../components/layout/app-bar/base-app-bar', () => ({
</div>
)
}))
jest.mock('../../../../../hooks/common/use-application-state')
vi.mock('../../../../../hooks/common/use-application-state')
const mockedCommonAppState = {
noteDetails: {
@ -44,7 +45,7 @@ const mockedCommonAppState = {
describe('app bar', () => {
beforeAll(mockI18n)
afterAll(() => jest.restoreAllMocks())
afterAll(() => vi.restoreAllMocks())
it('contains note title when editor is synced', () => {
mockAppState({

8
frontend/src/components/common/application-error-alert/__snapshots__/application-error-alert.spec.tsx.snap
View file

@ -1,15 +1,15 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`ApplicationErrorAlert renders correctly 1`] = `
exports[`ApplicationErrorAlert > renders correctly 1`] = `
<div>
<div
class="fade alert test-class alert alert-primary show"
class="fade _alert_663ce3 test-class alert alert-primary show"
role="alert"
>
<p
class="d-flex align-items-center"
>
This is a mock for "AlertIcon". Props: {"className":"logo"}
This is a mock for "AlertIcon". Props: {"className":"_logo_663ce3"}
<span>
<span>
Test Child

4
frontend/src/components/common/application-error-alert/__snapshots__/translated-application-error-alert.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`TranslatedApplicationErrorAlert renders correctly 1`] = `
exports[`TranslatedApplicationErrorAlert > renders correctly 1`] = `
<div>
<div>
<h3>

4
frontend/src/components/common/application-error-alert/application-error-alert.spec.tsx
View file

@ -7,8 +7,10 @@
import { render } from '@testing-library/react'
import { ApplicationErrorAlert } from './application-error-alert'
import type { AlertIconProps } from './alert-icon'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('./alert-icon', () => ({
vi.mock('./alert-icon', () => ({
AlertIcon: (props: AlertIconProps) => `This is a mock for "AlertIcon". Props: ${JSON.stringify(props)}`
}))

4
frontend/src/components/common/application-error-alert/translated-application-error-alert.spec.tsx
View file

@ -9,8 +9,10 @@ import { mockI18n } from '../../../test-utils/mock-i18n'
import { TranslatedApplicationErrorAlert } from './translated-application-error-alert'
import type { PropsWithChildren } from 'react'
import React from 'react'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('./application-error-alert', () => ({
vi.mock('./application-error-alert', () => ({
ApplicationErrorAlert: ({ children, ...props }: PropsWithChildren) => (
<div>
<h3>This is a mock for ApplicationErrorAlert.</h3>

10
frontend/src/components/common/async-loading-boundary/__snapshots__/async-loading-boundary.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Async loading boundary shows a waiting spinner if loading 1`] = `
exports[`Async loading boundary > shows a waiting spinner if loading 1`] = `
<div>
<div
class="m-3 d-flex align-items-center justify-content-center"
@ -10,7 +10,7 @@ exports[`Async loading boundary shows a waiting spinner if loading 1`] = `
</div>
`;
exports[`Async loading boundary shows an error if error is given with loading 1`] = `
exports[`Async loading boundary > shows an error if error is given with loading 1`] = `
<div>
<div
class="fade alert alert-danger show"
@ -21,7 +21,7 @@ exports[`Async loading boundary shows an error if error is given with loading 1`
</div>
`;
exports[`Async loading boundary shows an error if error is given without loading 1`] = `
exports[`Async loading boundary > shows an error if error is given without loading 1`] = `
<div>
<div
class="fade alert alert-danger show"
@ -32,7 +32,7 @@ exports[`Async loading boundary shows an error if error is given without loading
</div>
`;
exports[`Async loading boundary shows the children if not loading and no error 1`] = `
exports[`Async loading boundary > shows the children if not loading and no error 1`] = `
<div>
children
</div>

10
frontend/src/components/common/async-loading-boundary/__snapshots__/custom-async-loading-boundary.spec.tsx.snap
View file

@ -1,24 +1,24 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Custom error async loading boundary shows a waiting spinner if loading 1`] = `
exports[`Custom error async loading boundary > shows a waiting spinner if loading 1`] = `
<div>
wait
</div>
`;
exports[`Custom error async loading boundary shows an error if error is given with loading 1`] = `
exports[`Custom error async loading boundary > shows an error if error is given with loading 1`] = `
<div>
error
</div>
`;
exports[`Custom error async loading boundary shows an error if error is given without loading 1`] = `
exports[`Custom error async loading boundary > shows an error if error is given without loading 1`] = `
<div>
error
</div>
`;
exports[`Custom error async loading boundary shows the children if not loading and no error 1`] = `
exports[`Custom error async loading boundary > shows the children if not loading and no error 1`] = `
<div>
children
</div>

1
frontend/src/components/common/async-loading-boundary/async-loading-boundary.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import { AsyncLoadingBoundary } from './async-loading-boundary'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Async loading boundary', () => {
beforeAll(() => mockI18n())

1
frontend/src/components/common/async-loading-boundary/custom-async-loading-boundary.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import { CustomAsyncLoadingBoundary } from './custom-async-loading-boundary'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Custom error async loading boundary', () => {
beforeAll(() => mockI18n())

26
frontend/src/components/common/copyable/copy-to-clipboard-button/__snapshots__/copy-to-clipboard-button.spec.tsx.snap
View file

@ -1,9 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Copy to clipboard button show an error text if clipboard api isn't available 1`] = `
exports[`Copy to clipboard button > show an error text if clipboard api isn't available 1`] = `
<div>
<button
class="copy-button btn btn-dark btn-sm"
class="_copy-button_45cbcd btn btn-dark btn-sm"
title="renderer.highlightCode.copyCode"
type="button"
>
@ -12,11 +12,11 @@ exports[`Copy to clipboard button show an error text if clipboard api isn't avai
</div>
`;
exports[`Copy to clipboard button show an error text if clipboard api isn't available 2`] = `
exports[`Copy to clipboard button > show an error text if clipboard api isn't available 2`] = `
<div>
<button
aria-describedby="copied_35a35a31-c259-48c4-b75a-8da99859dcdb"
class="copy-button btn btn-dark btn-sm"
class="_copy-button_45cbcd btn btn-dark btn-sm"
title="renderer.highlightCode.copyCode"
type="button"
>
@ -25,10 +25,10 @@ exports[`Copy to clipboard button show an error text if clipboard api isn't avai
</div>
`;
exports[`Copy to clipboard button shows an error text if writing failed 1`] = `
exports[`Copy to clipboard button > shows an error text if writing failed 1`] = `
<div>
<button
class="copy-button btn btn-dark btn-sm"
class="_copy-button_45cbcd btn btn-dark btn-sm"
title="renderer.highlightCode.copyCode"
type="button"
>
@ -37,11 +37,11 @@ exports[`Copy to clipboard button shows an error text if writing failed 1`] = `
</div>
`;
exports[`Copy to clipboard button shows an error text if writing failed 2`] = `
exports[`Copy to clipboard button > shows an error text if writing failed 2`] = `
<div>
<button
aria-describedby="copied_35a35a31-c259-48c4-b75a-8da99859dcdb"
class="copy-button btn btn-dark btn-sm"
class="_copy-button_45cbcd btn btn-dark btn-sm"
title="renderer.highlightCode.copyCode"
type="button"
>
@ -50,10 +50,10 @@ exports[`Copy to clipboard button shows an error text if writing failed 2`] = `
</div>
`;
exports[`Copy to clipboard button shows an success text if writing succeeded 1`] = `
exports[`Copy to clipboard button > shows an success text if writing succeeded 1`] = `
<div>
<button
class="copy-button btn btn-dark btn-sm"
class="_copy-button_45cbcd btn btn-dark btn-sm"
title="renderer.highlightCode.copyCode"
type="button"
>
@ -62,11 +62,11 @@ exports[`Copy to clipboard button shows an success text if writing succeeded 1`]
</div>
`;
exports[`Copy to clipboard button shows an success text if writing succeeded 2`] = `
exports[`Copy to clipboard button > shows an success text if writing succeeded 2`] = `
<div>
<button
aria-describedby="copied_35a35a31-c259-48c4-b75a-8da99859dcdb"
class="copy-button btn btn-dark btn-sm"
class="_copy-button_45cbcd btn btn-dark btn-sm"
title="renderer.highlightCode.copyCode"
type="button"
>

14
frontend/src/components/common/copyable/copy-to-clipboard-button/copy-to-clipboard-button.spec.tsx
View file

@ -8,8 +8,10 @@ import { CopyToClipboardButton } from './copy-to-clipboard-button'
import { act, render, screen } from '@testing-library/react'
import React from 'react'
import * as uuidModule from 'uuid'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('uuid')
vi.mock('uuid')
describe('Copy to clipboard button', () => {
const copyContent = 'Copy McCopy Content. Electric Copyloo'
@ -20,15 +22,15 @@ describe('Copy to clipboard button', () => {
beforeAll(async () => {
await mockI18n()
originalClipboard = window.navigator.clipboard
jest.spyOn(uuidModule, 'v4').mockReturnValue(Buffer.from(uuidMock))
vitest.spyOn(uuidModule, 'v4').mockReturnValue(Buffer.from(uuidMock))
})
afterAll(() => {
Object.assign(global.navigator, {
clipboard: originalClipboard
})
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
const testButton = async (expectSuccess: boolean) => {
@ -44,8 +46,8 @@ describe('Copy to clipboard button', () => {
expect(view.container).toMatchSnapshot()
}
const mockClipboard = (copyIsSuccessful: boolean): jest.Mock => {
const writeTextToClipboardSpy = jest.fn(() =>
const mockClipboard = (copyIsSuccessful: boolean): vi.mock => {
const writeTextToClipboardSpy = vitest.fn(() =>
copyIsSuccessful ? Promise.resolve() : Promise.reject(new Error('mocked clipboard failed'))
)
Object.assign(global.navigator, {

40
frontend/src/components/common/custom-branding/__snapshots__/custom-branding.spec.tsx.snap
View file

@ -1,91 +1,91 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`custom branding doesn't show anything if no branding is defined 1`] = `<div />`;
exports[`custom branding > doesn't show anything if no branding is defined 1`] = `<div />`;
exports[`custom branding with inline=false shows an image if branding logo is defined 1`] = `
exports[`custom branding > with inline=false > shows an image if branding logo is defined 1`] = `
<div>
<img
class="regular-size"
class="_regular-size_4a21ce"
src="mockBrandingUrl"
/>
</div>
`;
exports[`custom branding with inline=false shows an text if branding text is defined 1`] = `
exports[`custom branding > with inline=false > shows an text if branding text is defined 1`] = `
<div>
<span
class="regular-size"
class="_regular-size_4a21ce"
>
mockedBranding
</span>
</div>
`;
exports[`custom branding with inline=false will prefer the logo over the text 1`] = `
exports[`custom branding > with inline=false > will prefer the logo over the text 1`] = `
<div>
<img
alt="mockedBranding"
class="regular-size"
class="_regular-size_4a21ce"
src="mockBrandingUrl"
title="mockedBranding"
/>
</div>
`;
exports[`custom branding with inline=true shows an image if branding logo is defined 1`] = `
exports[`custom branding > with inline=true > shows an image if branding logo is defined 1`] = `
<div>
<img
class="inline-logo"
class="_inline-logo_4a21ce"
src="mockBrandingUrl"
/>
</div>
`;
exports[`custom branding with inline=true shows an text if branding text is defined 1`] = `
exports[`custom branding > with inline=true > shows an text if branding text is defined 1`] = `
<div>
<span
class="inline-text"
class="_inline-text_4a21ce"
>
mockedBranding
</span>
</div>
`;
exports[`custom branding with inline=true will prefer the logo over the text 1`] = `
exports[`custom branding > with inline=true > will prefer the logo over the text 1`] = `
<div>
<img
alt="mockedBranding"
class="inline-logo"
class="_inline-logo_4a21ce"
src="mockBrandingUrl"
title="mockedBranding"
/>
</div>
`;
exports[`custom branding with inline=undefined shows an image if branding logo is defined 1`] = `
exports[`custom branding > with inline=undefined > shows an image if branding logo is defined 1`] = `
<div>
<img
class="regular-size"
class="_regular-size_4a21ce"
src="mockBrandingUrl"
/>
</div>
`;
exports[`custom branding with inline=undefined shows an text if branding text is defined 1`] = `
exports[`custom branding > with inline=undefined > shows an text if branding text is defined 1`] = `
<div>
<span
class="regular-size"
class="_regular-size_4a21ce"
>
mockedBranding
</span>
</div>
`;
exports[`custom branding with inline=undefined will prefer the logo over the text 1`] = `
exports[`custom branding > with inline=undefined > will prefer the logo over the text 1`] = `
<div>
<img
alt="mockedBranding"
class="regular-size"
class="_regular-size_4a21ce"
src="mockBrandingUrl"
title="mockedBranding"
/>

6
frontend/src/components/common/custom-branding/custom-branding.spec.tsx
View file

@ -8,12 +8,14 @@ import * as UseFrontendConfigMock from '../frontend-config-context/use-frontend-
import { CustomBranding } from './custom-branding'
import { render } from '@testing-library/react'
import { Mock } from 'ts-mockery'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../frontend-config-context/use-frontend-config')
vi.mock('../frontend-config-context/use-frontend-config')
describe('custom branding', () => {
const mockFrontendConfigHook = (logo: string | null = null, name: string | null = null) => {
jest
vi
.spyOn(UseFrontendConfigMock, 'useFrontendConfig')
.mockReturnValue(Mock.of<FrontendConfigDto>({ branding: { logo, name } }))
}

50
frontend/src/components/common/highlighted-code/__snapshots__/highlighted-code.spec.tsx.snap
View file

@ -1,17 +1,17 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Highlighted Code can hide the line numbers 1`] = `
exports[`Highlighted Code > can hide the line numbers 1`] = `
<code
class="hljs wrapLines"
class="hljs _wrapLines_15d654"
data-testid="code-highlighter"
>
<span
class="linenumber"
class="_linenumber_15d654"
>
1
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span>
const a = 1
@ -20,18 +20,18 @@ exports[`Highlighted Code can hide the line numbers 1`] = `
</code>
`;
exports[`Highlighted Code highlights code 1`] = `
exports[`Highlighted Code > highlights code 1`] = `
<code
class="hljs showGutter"
class="hljs _showGutter_15d654"
data-testid="code-highlighter"
>
<span
class="linenumber"
class="_linenumber_15d654"
>
1
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span
class="hljs-keyword"
@ -48,42 +48,42 @@ exports[`Highlighted Code highlights code 1`] = `
</code>
`;
exports[`Highlighted Code renders plain text 1`] = `
exports[`Highlighted Code > renders plain text 1`] = `
<code
class="hljs showGutter"
class="hljs _showGutter_15d654"
data-testid="code-highlighter"
>
<span
class="linenumber"
class="_linenumber_15d654"
>
1
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span>
a
</span>
</div>
<span
class="linenumber"
class="_linenumber_15d654"
>
2
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span>
b
</span>
</div>
<span
class="linenumber"
class="_linenumber_15d654"
>
3
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span>
c
@ -92,18 +92,18 @@ exports[`Highlighted Code renders plain text 1`] = `
</code>
`;
exports[`Highlighted Code starts with a specific line 1`] = `
exports[`Highlighted Code > starts with a specific line 1`] = `
<code
class="hljs showGutter wrapLines"
class="hljs _showGutter_15d654 _wrapLines_15d654"
data-testid="code-highlighter"
>
<span
class="linenumber"
class="_linenumber_15d654"
>
100
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span>
const a = 1
@ -112,18 +112,18 @@ exports[`Highlighted Code starts with a specific line 1`] = `
</code>
`;
exports[`Highlighted Code wraps code 1`] = `
exports[`Highlighted Code > wraps code 1`] = `
<code
class="hljs showGutter wrapLines"
class="hljs _showGutter_15d654 _wrapLines_15d654"
data-testid="code-highlighter"
>
<span
class="linenumber"
class="_linenumber_15d654"
>
1
</span>
<div
class="codeline"
class="_codeline_15d654"
>
<span>
const a = 1

1
frontend/src/components/common/highlighted-code/highlighted-code.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import HighlightedCode from './highlighted-code'
import { render, screen } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Highlighted Code', () => {
beforeAll(() => mockI18n())

14
frontend/src/components/common/html-to-react/__snapshots__/html-to-react.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`HTML to React renders basic html correctly 1`] = `
exports[`HTML to React > renders basic html correctly 1`] = `
<div>
<p>
This is a test
@ -11,7 +11,7 @@ exports[`HTML to React renders basic html correctly 1`] = `
</div>
`;
exports[`HTML to React will forward the DomPurify settings 1`] = `
exports[`HTML to React > will forward the DomPurify settings 1`] = `
<div>
<test-tag>
Test!
@ -19,7 +19,7 @@ exports[`HTML to React will forward the DomPurify settings 1`] = `
</div>
`;
exports[`HTML to React will forward the parser options 1`] = `
exports[`HTML to React > will forward the parser options 1`] = `
<div>
<p>
Hijacked!
@ -27,7 +27,7 @@ exports[`HTML to React will forward the parser options 1`] = `
</div>
`;
exports[`HTML to React will render links with non-http protocols 1`] = `
exports[`HTML to React > will render links with non-http protocols 1`] = `
<div>
<a
href="tel:+1234567890"
@ -52,7 +52,7 @@ exports[`HTML to React will render links with non-http protocols 1`] = `
</div>
`;
exports[`HTML to React won't render script links 1`] = `
exports[`HTML to React > won't render script links 1`] = `
<div>
<a>
js
@ -63,4 +63,4 @@ exports[`HTML to React won't render script links 1`] = `
</div>
`;
exports[`HTML to React won't render script tags 1`] = `<div />`;
exports[`HTML to React > won't render script tags 1`] = `<div />`;

1
frontend/src/components/common/html-to-react/html-to-react.spec.tsx
View file

@ -5,6 +5,7 @@
*/
import { HtmlToReact } from './html-to-react'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('HTML to React', () => {
it('renders basic html correctly', () => {

8
frontend/src/components/common/html-to-react/html-to-react.tsx
View file

@ -6,13 +6,13 @@
import { measurePerformance } from '../../../utils/measure-performance'
import type { ParserOptions } from '@hedgedoc/html-to-react'
import { convertHtmlToReact } from '@hedgedoc/html-to-react'
import type DOMPurify from 'dompurify'
import { sanitize } from 'dompurify'
import type { Config } from 'dompurify'
import DOMPurify from 'dompurify'
import React, { Fragment, useMemo } from 'react'
export interface HtmlToReactProps {
htmlCode: string
domPurifyConfig?: DOMPurify.Config
domPurifyConfig?: Config
parserOptions?: ParserOptions
}
@ -28,7 +28,7 @@ const REGEX_URI_SCHEME_NO_SCRIPTS = /^(?!.*script:).+:?/i
export const HtmlToReact: React.FC<HtmlToReactProps> = ({ htmlCode, domPurifyConfig, parserOptions }) => {
const elements = useMemo(() => {
const sanitizedHtmlCode = measurePerformance('html-to-react: sanitize', () => {
return sanitize(htmlCode, {
return DOMPurify.sanitize(htmlCode, {
...domPurifyConfig,
RETURN_DOM_FRAGMENT: false,
RETURN_DOM: false,

34
frontend/src/components/common/icon-button/__snapshots__/icon-button.spec.tsx.snap
View file

@ -1,19 +1,19 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`IconButton correctly uses the onClick callback 1`] = `
exports[`IconButton > correctly uses the onClick callback 1`] = `
<div>
<button
class="btn-icon d-inline-flex align-items-stretch btn btn-primary"
class="_btn-icon_efc75b d-inline-flex align-items-stretch btn btn-primary"
data-testid="icon-button"
type="button"
>
<span
class="icon-part"
class="_icon-part_efc75b"
>
BootstrapIconMock_Heart
</span>
<span
class="text-part"
class="_text-part_efc75b"
>
test with onClick
</span>
@ -21,20 +21,20 @@ exports[`IconButton correctly uses the onClick callback 1`] = `
</div>
`;
exports[`IconButton renders heart icon 1`] = `
exports[`IconButton > renders heart icon 1`] = `
<div>
<button
class="btn-icon d-inline-flex align-items-stretch btn btn-primary"
class="_btn-icon_efc75b d-inline-flex align-items-stretch btn btn-primary"
data-testid="icon-button"
type="button"
>
<span
class="icon-part"
class="_icon-part_efc75b"
>
BootstrapIconMock_Heart
</span>
<span
class="text-part"
class="_text-part_efc75b"
>
test
</span>
@ -42,20 +42,20 @@ exports[`IconButton renders heart icon 1`] = `
</div>
`;
exports[`IconButton renders with additional className 1`] = `
exports[`IconButton > renders with additional className 1`] = `
<div>
<button
class="btn-icon d-inline-flex align-items-stretch testClass btn btn-primary"
class="_btn-icon_efc75b d-inline-flex align-items-stretch testClass btn btn-primary"
data-testid="icon-button"
type="button"
>
<span
class="icon-part"
class="_icon-part_efc75b"
>
BootstrapIconMock_Heart
</span>
<span
class="text-part"
class="_text-part_efc75b"
>
test with additional className
</span>
@ -63,20 +63,20 @@ exports[`IconButton renders with additional className 1`] = `
</div>
`;
exports[`IconButton renders with border 1`] = `
exports[`IconButton > renders with border 1`] = `
<div>
<button
class="btn-icon d-inline-flex align-items-stretch with-border btn btn-primary"
class="_btn-icon_efc75b d-inline-flex align-items-stretch _with-border_efc75b btn btn-primary"
data-testid="icon-button"
type="button"
>
<span
class="icon-part"
class="_icon-part_efc75b"
>
BootstrapIconMock_Heart
</span>
<span
class="text-part"
class="_text-part_efc75b"
>
test with border
</span>

3
frontend/src/components/common/icon-button/icon-button.spec.tsx
View file

@ -6,6 +6,7 @@
import { IconButton } from './icon-button'
import { fireEvent, render, screen } from '@testing-library/react'
import { Heart as IconHeart } from 'react-bootstrap-icons'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('IconButton', () => {
it('renders heart icon', () => {
@ -29,7 +30,7 @@ describe('IconButton', () => {
expect(view.container).toMatchSnapshot()
})
it('correctly uses the onClick callback', async () => {
const onClick = jest.fn()
const onClick = vitest.fn()
const view = render(
<IconButton icon={IconHeart} onClick={onClick}>
test with onClick

12
frontend/src/components/common/links/__snapshots__/external-link.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`ExternalLink renders an external link correctly 1`] = `
exports[`ExternalLink > renders an external link correctly 1`] = `
<div>
<a
class=""
@ -14,7 +14,7 @@ exports[`ExternalLink renders an external link correctly 1`] = `
</div>
`;
exports[`ExternalLink renders an external link with a title 1`] = `
exports[`ExternalLink > renders an external link with a title 1`] = `
<div>
<a
class=""
@ -29,7 +29,7 @@ exports[`ExternalLink renders an external link with a title 1`] = `
</div>
`;
exports[`ExternalLink renders an external link with additional className 1`] = `
exports[`ExternalLink > renders an external link with additional className 1`] = `
<div>
<a
class="testClass"
@ -43,7 +43,7 @@ exports[`ExternalLink renders an external link with additional className 1`] = `
</div>
`;
exports[`ExternalLink renders an external link with an icon 1`] = `
exports[`ExternalLink > renders an external link with an icon 1`] = `
<div>
<a
class=""
@ -59,7 +59,7 @@ exports[`ExternalLink renders an external link with an icon 1`] = `
</div>
`;
exports[`ExternalLink renders an external link with an id 1`] = `
exports[`ExternalLink > renders an external link with an id 1`] = `
<div>
<a
class=""

12
frontend/src/components/common/links/__snapshots__/internal-link.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`InternalLink renders an internal link correctly 1`] = `
exports[`InternalLink > renders an internal link correctly 1`] = `
<div>
<a
class=""
@ -11,7 +11,7 @@ exports[`InternalLink renders an internal link correctly 1`] = `
</div>
`;
exports[`InternalLink renders an internal link with a title 1`] = `
exports[`InternalLink > renders an internal link with a title 1`] = `
<div>
<a
class=""
@ -23,7 +23,7 @@ exports[`InternalLink renders an internal link with a title 1`] = `
</div>
`;
exports[`InternalLink renders an internal link with additional className 1`] = `
exports[`InternalLink > renders an internal link with additional className 1`] = `
<div>
<a
class="testClass"
@ -34,7 +34,7 @@ exports[`InternalLink renders an internal link with additional className 1`] = `
</div>
`;
exports[`InternalLink renders an internal link with an icon 1`] = `
exports[`InternalLink > renders an internal link with an icon 1`] = `
<div>
<a
class=""
@ -47,7 +47,7 @@ exports[`InternalLink renders an internal link with an icon 1`] = `
</div>
`;
exports[`InternalLink renders an internal link with an id 1`] = `
exports[`InternalLink > renders an internal link with an id 1`] = `
<div>
<a
class=""

4
frontend/src/components/common/links/__snapshots__/translated-external-link.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`TranslatedExternalLink renders with i18nKey 1`] = `
exports[`TranslatedExternalLink > renders with i18nKey 1`] = `
<div>
<a
class=""

4
frontend/src/components/common/links/__snapshots__/translated-internal-link.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`TranslatedInternalLink renders with i18nKey 1`] = `
exports[`TranslatedInternalLink > renders with i18nKey 1`] = `
<div>
<a
class=""

1
frontend/src/components/common/links/external-link.spec.tsx
View file

@ -6,6 +6,7 @@
import { ExternalLink } from './external-link'
import { render } from '@testing-library/react'
import { Heart as IconHeart } from 'react-bootstrap-icons'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('ExternalLink', () => {
const href = 'https://example.com'

1
frontend/src/components/common/links/internal-link.spec.tsx
View file

@ -6,6 +6,7 @@
import { InternalLink } from './internal-link'
import { render } from '@testing-library/react'
import { Heart as IconHeart } from 'react-bootstrap-icons'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('InternalLink', () => {
const href = '/test'

1
frontend/src/components/common/links/translated-external-link.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import { TranslatedExternalLink } from './translated-external-link'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('TranslatedExternalLink', () => {
const href = 'https://example.com'

1
frontend/src/components/common/links/translated-internal-link.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import { TranslatedInternalLink } from './translated-internal-link'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('TranslatedInternalLink', () => {
const href = '/test'

20
frontend/src/components/common/modals/__snapshots__/common-modal.spec.tsx.snap
View file

@ -1,8 +1,8 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`CommonModal does not render if show is false 1`] = `<div />`;
exports[`CommonModal > does not render if show is false 1`] = `<div />`;
exports[`CommonModal render correctly in size lg 1`] = `
exports[`CommonModal > render correctly in size > lg 1`] = `
<div
class="modal-dialog modal-lg"
data-testid="commonModal"
@ -24,7 +24,7 @@ exports[`CommonModal render correctly in size lg 1`] = `
</div>
`;
exports[`CommonModal render correctly in size sm 1`] = `
exports[`CommonModal > render correctly in size > sm 1`] = `
<div
class="modal-dialog modal-sm"
data-testid="commonModal"
@ -46,7 +46,7 @@ exports[`CommonModal render correctly in size sm 1`] = `
</div>
`;
exports[`CommonModal render correctly in size xl 1`] = `
exports[`CommonModal > render correctly in size > xl 1`] = `
<div
class="modal-dialog modal-xl"
data-testid="commonModal"
@ -68,7 +68,7 @@ exports[`CommonModal render correctly in size xl 1`] = `
</div>
`;
exports[`CommonModal render correctly with additionalClasses 1`] = `
exports[`CommonModal > render correctly with additionalClasses 1`] = `
<div
class="modal-dialog testClass"
data-testid="commonModal"
@ -90,7 +90,7 @@ exports[`CommonModal render correctly with additionalClasses 1`] = `
</div>
`;
exports[`CommonModal render correctly with i18nTitle 1`] = `
exports[`CommonModal > render correctly with i18nTitle 1`] = `
<div
class="modal-dialog"
data-testid="commonModal"
@ -112,7 +112,7 @@ exports[`CommonModal render correctly with i18nTitle 1`] = `
</div>
`;
exports[`CommonModal render correctly with title 1`] = `
exports[`CommonModal > render correctly with title 1`] = `
<div
class="modal-dialog"
data-testid="commonModal"
@ -134,7 +134,7 @@ exports[`CommonModal render correctly with title 1`] = `
</div>
`;
exports[`CommonModal render correctly with title icon 1`] = `
exports[`CommonModal > render correctly with title icon 1`] = `
<div
class="modal-dialog"
data-testid="commonModal"
@ -158,7 +158,7 @@ exports[`CommonModal render correctly with title icon 1`] = `
</div>
`;
exports[`CommonModal renders correctly and calls onHide, when close button is clicked 1`] = `
exports[`CommonModal > renders correctly and calls onHide, when close button is clicked 1`] = `
<div
class="modal-dialog"
data-testid="commonModal"

4
frontend/src/components/common/modals/__snapshots__/deletion-modal.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`DeletionModal renders correctly with deletionButtonI18nKey 1`] = `
exports[`DeletionModal > renders correctly with deletionButtonI18nKey 1`] = `
<div
class="modal-dialog"
data-testid="commonModal"

7
frontend/src/components/common/modals/common-modal.spec.tsx
View file

@ -8,11 +8,12 @@ import { CommonModal } from './common-modal'
import { fireEvent, render, screen } from '@testing-library/react'
import React from 'react'
import { Heart as IconHeart } from 'react-bootstrap-icons'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
describe('CommonModal', () => {
afterAll(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
beforeAll(async () => {
@ -25,7 +26,7 @@ describe('CommonModal', () => {
})
it('renders correctly and calls onHide, when close button is clicked', async () => {
const onHide = jest.fn()
const onHide = vitest.fn()
render(
<CommonModal show={true} onHide={onHide} showCloseButton={true}>
testText

7
frontend/src/components/common/modals/deletion-modal.spec.tsx
View file

@ -7,6 +7,7 @@ import { mockI18n } from '../../../test-utils/mock-i18n'
import { mockNotePermissions } from '../../../test-utils/mock-note-permissions'
import { DeletionModal } from './deletion-modal'
import { render, screen } from '@testing-library/react'
import { afterEach, beforeEach, describe, expect, it, vitest } from 'vitest'
describe('DeletionModal', () => {
beforeEach(async () => {
@ -14,13 +15,13 @@ describe('DeletionModal', () => {
})
afterEach(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders correctly with deletionButtonI18nKey', async () => {
mockNotePermissions('test', 'test')
const onConfirm = jest.fn()
const onConfirm = vitest.fn()
render(
<DeletionModal onConfirm={onConfirm} deletionButtonI18nKey={'testDeletionButton'} show={true}>
testText

12
frontend/src/components/common/note-loading-boundary/__snapshots__/create-non-existing-note-hint.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`create non existing note hint renders a waiting message when button is clicked 1`] = `
exports[`create non existing note hint > renders a waiting message when button is clicked 1`] = `
<div>
<div
class="fade mt-5 alert alert-info show"
@ -13,7 +13,7 @@ exports[`create non existing note hint renders a waiting message when button is
</div>
`;
exports[`create non existing note hint renders an button as initial state 1`] = `
exports[`create non existing note hint > renders an button as initial state 1`] = `
<div>
<div
class="fade mt-5 alert alert-info show"
@ -38,9 +38,9 @@ exports[`create non existing note hint renders an button as initial state 1`] =
</div>
`;
exports[`create non existing note hint renders nothing if no note id has been provided 1`] = `<div />`;
exports[`create non existing note hint > renders nothing if no note id has been provided 1`] = `<div />`;
exports[`create non existing note hint shows an error message if note couldn't be created 1`] = `
exports[`create non existing note hint > shows an error message if note couldn't be created 1`] = `
<div>
<div
class="fade mt-5 alert alert-danger show"
@ -53,7 +53,7 @@ exports[`create non existing note hint shows an error message if note couldn't b
</div>
`;
exports[`create non existing note hint shows success message when the note has been created 1`] = `
exports[`create non existing note hint > shows success message when the note has been created 1`] = `
<div>
<div
class="fade mt-5 alert alert-info show"

6
frontend/src/components/common/note-loading-boundary/__snapshots__/note-loading-boundary.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Note loading boundary loads a note 1`] = `
exports[`Note loading boundary > loads a note 1`] = `
<div>
<span
data-testid="success"
@ -10,7 +10,7 @@ exports[`Note loading boundary loads a note 1`] = `
</div>
`;
exports[`Note loading boundary shows an error 1`] = `
exports[`Note loading boundary > shows an error 1`] = `
<div>
<span
data-testid="CommonErrorPage"

24
frontend/src/components/common/note-loading-boundary/create-non-existing-note-hint.spec.tsx
View file

@ -10,15 +10,17 @@ import type { NoteDto, NoteMetadataDto } from '@hedgedoc/commons'
import { waitForOtherPromisesToFinish } from '@hedgedoc/commons'
import { act, render, screen, waitFor } from '@testing-library/react'
import { Mock } from 'ts-mockery'
import { afterEach, describe, expect, it, vitest, beforeAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../api/notes')
jest.mock('../../../hooks/common/use-single-string-url-parameter')
vi.mock('../../../api/notes')
vi.mock('../../../hooks/common/use-single-string-url-parameter')
describe('create non existing note hint', () => {
const mockedNoteId = 'mockedNoteId'
const mockCreateNoteWithPrimaryAlias = () => {
jest
vi
.spyOn(createNoteWithPrimaryAliasModule, 'createNoteWithPrimaryAlias')
.mockImplementation(async (markdown, primaryAlias): Promise<NoteDto> => {
expect(markdown).toBe('')
@ -31,7 +33,7 @@ describe('create non existing note hint', () => {
}
const mockFailingCreateNoteWithPrimaryAlias = () => {
jest
vi
.spyOn(createNoteWithPrimaryAliasModule, 'createNoteWithPrimaryAlias')
.mockImplementation(async (markdown, primaryAlias): Promise<NoteDto> => {
expect(markdown).toBe('')
@ -46,12 +48,12 @@ describe('create non existing note hint', () => {
})
afterEach(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders nothing if no note id has been provided', async () => {
const onNoteCreatedCallback = jest.fn()
const onNoteCreatedCallback = vitest.fn()
const view = render(
<CreateNonExistingNoteHint noteId={undefined} onNoteCreated={onNoteCreatedCallback}></CreateNonExistingNoteHint>
)
@ -62,7 +64,7 @@ describe('create non existing note hint', () => {
it('renders an button as initial state', async () => {
mockCreateNoteWithPrimaryAlias()
const onNoteCreatedCallback = jest.fn()
const onNoteCreatedCallback = vitest.fn()
const view = render(
<CreateNonExistingNoteHint
noteId={mockedNoteId}
@ -76,7 +78,7 @@ describe('create non existing note hint', () => {
it('renders a waiting message when button is clicked', async () => {
mockCreateNoteWithPrimaryAlias()
const onNoteCreatedCallback = jest.fn()
const onNoteCreatedCallback = vitest.fn()
const view = render(
<CreateNonExistingNoteHint
noteId={mockedNoteId}
@ -96,7 +98,7 @@ describe('create non existing note hint', () => {
it('shows success message when the note has been created', async () => {
mockCreateNoteWithPrimaryAlias()
const onNoteCreatedCallback = jest.fn()
const onNoteCreatedCallback = vitest.fn()
const view = render(
<CreateNonExistingNoteHint
noteId={mockedNoteId}
@ -116,7 +118,7 @@ describe('create non existing note hint', () => {
it("shows an error message if note couldn't be created", async () => {
mockFailingCreateNoteWithPrimaryAlias()
const onNoteCreatedCallback = jest.fn()
const onNoteCreatedCallback = vitest.fn()
const view = render(
<CreateNonExistingNoteHint
noteId={mockedNoteId}

34
frontend/src/components/common/note-loading-boundary/note-loading-boundary.spec.tsx
View file

@ -16,34 +16,36 @@ import { render, screen } from '@testing-library/react'
import { Fragment } from 'react'
import { Mock } from 'ts-mockery'
import type { NoteDto } from '@hedgedoc/commons'
import { afterEach, beforeEach, describe, expect, it, vitest } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../hooks/common/use-single-string-url-parameter')
jest.mock('../../../api/notes')
jest.mock('../../../redux/note-details/methods')
jest.mock('../../error-pages/common-error-page', () => ({
CommonErrorPage: jest.fn()
vi.mock('../../../hooks/common/use-single-string-url-parameter')
vi.mock('../../../api/notes')
vi.mock('../../../redux/note-details/methods')
vi.mock('../../error-pages/common-error-page', () => ({
CommonErrorPage: vitest.fn()
}))
jest.mock('../../../components/application-loader/loading-screen/loading-screen')
jest.mock('./create-non-existing-note-hint')
vi.mock('../../../components/application-loader/loading-screen/loading-screen')
vi.mock('./create-non-existing-note-hint')
describe('Note loading boundary', () => {
const mockedNoteId = 'mockedNoteId'
afterEach(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
beforeEach(async () => {
await mockI18n()
jest.spyOn(CreateNonExistingNoteHintModule, 'CreateNonExistingNoteHint').mockImplementation(() => {
vitest.spyOn(CreateNonExistingNoteHintModule, 'CreateNonExistingNoteHint').mockImplementation(() => {
return (
<Fragment>
<span>This is a mock for CreateNonExistingNoteHint</span>
</Fragment>
)
})
jest.spyOn(LoadingScreenModule, 'LoadingScreen').mockImplementation(({ errorMessage }) => {
vitest.spyOn(LoadingScreenModule, 'LoadingScreen').mockImplementation(({ errorMessage }) => {
return (
<Fragment>
<span {...testId('LoadingScreen')}>This is a mock for LoadingScreen.</span>
@ -51,7 +53,7 @@ describe('Note loading boundary', () => {
</Fragment>
)
})
jest
vi
.spyOn(CommonErrorPageModule, 'CommonErrorPage')
.mockImplementation(({ titleI18nKey, descriptionI18nKey, children }) => {
return (
@ -66,7 +68,7 @@ describe('Note loading boundary', () => {
})
const mockGetNoteApiCall = (returnValue: NoteDto) => {
jest.spyOn(getNoteModule, 'getNote').mockImplementation((id) => {
vitest.spyOn(getNoteModule, 'getNote').mockImplementation((id) => {
expect(id).toBe(mockedNoteId)
return new Promise((resolve) => {
setTimeout(() => resolve(returnValue), 0)
@ -75,7 +77,7 @@ describe('Note loading boundary', () => {
}
const mockCrashingNoteApiCall = () => {
jest.spyOn(getNoteModule, 'getNote').mockImplementation((id) => {
vitest.spyOn(getNoteModule, 'getNote').mockImplementation((id) => {
expect(id).toBe(mockedNoteId)
return new Promise((resolve, reject) => {
setTimeout(() => reject(new ApiError(404, undefined, undefined)), 0)
@ -83,8 +85,8 @@ describe('Note loading boundary', () => {
})
}
const mockSetNoteInRedux = (expectedNote: NoteDto): jest.SpyInstance<void, [apiResponse: NoteDto]> => {
return jest.spyOn(setNoteDataFromServerModule, 'setNoteDataFromServer').mockImplementation((givenNote) => {
const mockSetNoteInRedux = (expectedNote: NoteDto): vitest.SpyInstance<void, [apiResponse: NoteDto]> => {
return vitest.spyOn(setNoteDataFromServerModule, 'setNoteDataFromServer').mockImplementation((givenNote) => {
expect(givenNote).toBe(expectedNote)
})
}

1
frontend/src/components/common/number-range/number-range.spec.ts
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { createNumberRangeArray } from './number-range'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('number range', () => {
it('creates an empty number range', () => {

6
frontend/src/components/common/user-avatar/__snapshots__/guest-user-avatar.spec.tsx.snap
View file

@ -1,13 +1,13 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`GuestUserAvatar renders the guest user avatar correctly 1`] = `
exports[`GuestUserAvatar > renders the guest user avatar correctly 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
BootstrapIconMock_Person
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
common.guestUser
</span>

50
frontend/src/components/common/user-avatar/__snapshots__/user-avatar.spec.tsx.snap
View file

@ -1,20 +1,20 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`UserAvatar adds additionalClasses props to wrapping span 1`] = `
exports[`UserAvatar > adds additionalClasses props to wrapping span 1`] = `
<div>
<span
class="d-inline-flex align-items-center testClass"
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="20"
src="https://example.com/test.png"
title="common.avatarOf"
width="20"
/>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
Boaty McBoatFace
</span>
@ -22,14 +22,14 @@ exports[`UserAvatar adds additionalClasses props to wrapping span 1`] = `
</div>
`;
exports[`UserAvatar does not show names if showName prop is false 1`] = `
exports[`UserAvatar > does not show names if showName prop is false 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="20"
src="https://example.com/test.png"
title="common.avatarOf"
@ -39,21 +39,21 @@ exports[`UserAvatar does not show names if showName prop is false 1`] = `
</div>
`;
exports[`UserAvatar renders the user avatar correctly 1`] = `
exports[`UserAvatar > renders the user avatar correctly 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="20"
src="https://example.com/test.png"
title="common.avatarOf"
width="20"
/>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
Boaty McBoatFace
</span>
@ -61,21 +61,21 @@ exports[`UserAvatar renders the user avatar correctly 1`] = `
</div>
`;
exports[`UserAvatar renders the user avatar in size lg 1`] = `
exports[`UserAvatar > renders the user avatar in size > lg 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="30"
src="https://example.com/test.png"
title="common.avatarOf"
width="30"
/>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
Boaty McBoatFace
</span>
@ -83,21 +83,21 @@ exports[`UserAvatar renders the user avatar in size lg 1`] = `
</div>
`;
exports[`UserAvatar renders the user avatar in size sm 1`] = `
exports[`UserAvatar > renders the user avatar in size > sm 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="16"
src="https://example.com/test.png"
title="common.avatarOf"
width="16"
/>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
Boaty McBoatFace
</span>
@ -105,7 +105,7 @@ exports[`UserAvatar renders the user avatar in size sm 1`] = `
</div>
`;
exports[`UserAvatar uses custom photo component if provided 1`] = `
exports[`UserAvatar > uses custom photo component if provided 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
@ -114,7 +114,7 @@ exports[`UserAvatar uses custom photo component if provided 1`] = `
Custom Photo
</div>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
No face user
</span>
@ -122,7 +122,7 @@ exports[`UserAvatar uses custom photo component if provided 1`] = `
</div>
`;
exports[`UserAvatar uses custom photo component preferred over photoUrl 1`] = `
exports[`UserAvatar > uses custom photo component preferred over photoUrl 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
@ -131,7 +131,7 @@ exports[`UserAvatar uses custom photo component preferred over photoUrl 1`] = `
Custom Photo
</div>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
Boaty McBoatFace
</span>
@ -139,21 +139,21 @@ exports[`UserAvatar uses custom photo component preferred over photoUrl 1`] = `
</div>
`;
exports[`UserAvatar uses identicon when empty photoUrl is given 1`] = `
exports[`UserAvatar > uses identicon when empty photoUrl is given 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="20"
src="data:image/x-other,identicon-mock"
title="common.avatarOf"
width="20"
/>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
Empty
</span>
@ -161,21 +161,21 @@ exports[`UserAvatar uses identicon when empty photoUrl is given 1`] = `
</div>
`;
exports[`UserAvatar uses identicon when no photoUrl is given 1`] = `
exports[`UserAvatar > uses identicon when no photoUrl is given 1`] = `
<div>
<span
class="d-inline-flex align-items-center "
>
<img
alt="common.avatarOf"
class="rounded user-image"
class="rounded _user-image_b75d65"
height="20"
src="data:image/x-other,identicon-mock"
title="common.avatarOf"
width="20"
/>
<span
class="ms-2 me-1 user-line-name"
class="ms-2 me-1 _user-line-name_b75d65"
>
No face user
</span>

10
frontend/src/components/common/user-avatar/guest-user-avatar.spec.tsx
View file

@ -6,11 +6,13 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import { render } from '@testing-library/react'
import { GuestUserAvatar } from './guest-user-avatar'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('@dicebear/identicon', () => null)
jest.mock('@dicebear/core', () => ({
createAvatar: jest.fn(() => ({
toDataUri: jest.fn(() => 'data:image/x-other,identicon-mock')
vi.mock('@dicebear/identicon')
vi.mock('@dicebear/core', () => ({
createAvatar: vitest.fn(() => ({
toDataUri: vitest.fn(() => 'data:image/x-other,identicon-mock')
}))
}))

10
frontend/src/components/common/user-avatar/user-avatar.spec.tsx
View file

@ -7,11 +7,13 @@ import { mockI18n } from '../../../test-utils/mock-i18n'
import { render } from '@testing-library/react'
import { UserAvatar } from './user-avatar'
import type { UserInfoDto } from '@hedgedoc/commons'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('@dicebear/identicon', () => null)
jest.mock('@dicebear/core', () => ({
createAvatar: jest.fn(() => ({
toDataUri: jest.fn(() => 'data:image/x-other,identicon-mock')
vi.mock('@dicebear/identicon')
vi.mock('@dicebear/core', () => ({
createAvatar: vitest.fn(() => ({
toDataUri: vitest.fn(() => 'data:image/x-other,identicon-mock')
}))
}))

1
frontend/src/components/editor-page/editor-pane/hooks/image-upload-from-renderer/find-regex-match-in-text.spec.ts
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { findRegexMatchInText } from './find-regex-match-in-text'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('find regex index in line', function () {
it('finds the first occurrence', () => {

1
frontend/src/components/editor-page/editor-pane/hooks/table-paste/codefenceDetection.spec.ts
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { isCursorInCodeFence } from './codefenceDetection'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Check whether cursor is in codefence', () => {
it('returns false for empty document', () => {

1
frontend/src/components/editor-page/editor-pane/hooks/table-paste/table-extractor.spec.ts
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { convertClipboardTableToMarkdown, isTable } from './table-extractor'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('isTable detection: ', () => {
it('empty string is no table', () => {

8
frontend/src/components/editor-page/editor-pane/hooks/use-disconnect-on-user-login-status-change.spec.tsx
View file

@ -9,8 +9,10 @@ import { render } from '@testing-library/react'
import React, { Fragment } from 'react'
import { Mock } from 'ts-mockery'
import { mockAppState } from '../../../../test-utils/mock-app-state'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll, MockInstance } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../../hooks/common/use-application-state')
vi.mock('../../../../hooks/common/use-application-state')
describe('use logout on user change', () => {
const TestComponent: React.FC<{ messageTransporter: MessageTransporter }> = ({ messageTransporter }) => {
@ -24,11 +26,11 @@ describe('use logout on user change', () => {
})
}
let disconnectCallback: jest.Mock
let disconnectCallback: () => void
let messageTransporter: MessageTransporter
beforeEach(() => {
disconnectCallback = jest.fn()
disconnectCallback = vi.fn()
messageTransporter = Mock.of<MessageTransporter>({ disconnect: disconnectCallback })
})

75
frontend/src/components/editor-page/editor-pane/hooks/yjs/frontend-websocket-adapter.spec.ts
View file

@ -7,38 +7,49 @@ import { FrontendWebsocketAdapter } from './frontend-websocket-adapter'
import type { Message } from '@hedgedoc/commons'
import { ConnectionState, DisconnectReason, MessageType } from '@hedgedoc/commons'
import { Mock } from 'ts-mockery'
import { describe, expect, it, vi, MockInstance, Mock as ViMock } from 'vitest'
interface MockedSocket {
addEventListenerSpy: ViMock
removeEventListenerSpy: ViMock
closeSpy: ViMock
sendSpy: ViMock
adapter: FrontendWebsocketAdapter
socket: WebSocket
}
describe('frontend websocket', () => {
let addEventListenerSpy: jest.Mock
let removeEventListenerSpy: jest.Mock
let closeSpy: jest.Mock
let sendSpy: jest.Mock
let adapter: FrontendWebsocketAdapter
let mockedSocket: WebSocket
function mockSocket(readyState: 0 | 1 | 2 | 3 = WebSocket.OPEN): MockedSocket {
const addEventListenerSpy = vi.fn()
const removeEventListenerSpy = vi.fn()
const closeSpy = vi.fn()
const sendSpy = vi.fn()
function mockSocket(readyState: 0 | 1 | 2 | 3 = WebSocket.OPEN) {
addEventListenerSpy = jest.fn()
removeEventListenerSpy = jest.fn()
closeSpy = jest.fn()
sendSpy = jest.fn()
mockedSocket = Mock.of<WebSocket>({
const socket = Mock.of<WebSocket>({
addEventListener: addEventListenerSpy,
removeEventListener: removeEventListenerSpy,
close: closeSpy,
send: sendSpy,
readyState: readyState
})
adapter = new FrontendWebsocketAdapter(mockedSocket)
const adapter = new FrontendWebsocketAdapter(socket)
return {
adapter,
addEventListenerSpy,
removeEventListenerSpy,
closeSpy,
sendSpy,
socket
}
}
it('can bind and unbind the close event', () => {
mockSocket()
const handler = jest.fn((reason?: DisconnectReason) => console.log(reason))
const { adapter, socket, removeEventListenerSpy } = mockSocket()
const handler = vi.fn((reason?: DisconnectReason) => console.log(reason))
let modifiedHandler: EventListenerOrEventListenerObject = jest.fn()
let modifiedHandler: EventListenerOrEventListenerObject = vi.fn()
jest.spyOn(mockedSocket, 'addEventListener').mockImplementation((event, handler_) => {
vi.spyOn(socket, 'addEventListener').mockImplementation((event, handler_) => {
modifiedHandler = handler_
})
@ -54,8 +65,8 @@ describe('frontend websocket', () => {
})
it('can bind and unbind the connect event', () => {
mockSocket()
const handler = jest.fn()
const { adapter, addEventListenerSpy, removeEventListenerSpy } = mockSocket()
const handler = vi.fn()
const unbind = adapter.bindOnConnectedEvent(handler)
expect(addEventListenerSpy).toHaveBeenCalledWith('open', handler)
unbind()
@ -63,8 +74,8 @@ describe('frontend websocket', () => {
})
it('can bind and unbind the error event', () => {
mockSocket()
const handler = jest.fn()
const { adapter, addEventListenerSpy, removeEventListenerSpy } = mockSocket()
const handler = vi.fn()
const unbind = adapter.bindOnErrorEvent(handler)
expect(addEventListenerSpy).toHaveBeenCalledWith('error', handler)
unbind()
@ -72,11 +83,11 @@ describe('frontend websocket', () => {
})
it('can bind, unbind and translate the message event', () => {
mockSocket()
const handler = jest.fn()
const { adapter, socket, addEventListenerSpy, removeEventListenerSpy } = mockSocket()
const handler = vi.fn()
let modifiedHandler: EventListenerOrEventListenerObject = jest.fn()
jest.spyOn(mockedSocket, 'addEventListener').mockImplementation((event, handler_) => {
let modifiedHandler: EventListenerOrEventListenerObject = vi.fn()
addEventListenerSpy.mockImplementation((event, handler_) => {
modifiedHandler = handler_
})
@ -94,35 +105,35 @@ describe('frontend websocket', () => {
})
it('can disconnect the socket', () => {
mockSocket()
const { adapter, closeSpy } = mockSocket()
adapter.disconnect()
expect(closeSpy).toHaveBeenCalled()
})
it('can send messages', () => {
mockSocket()
const { adapter, sendSpy } = mockSocket()
const value: Message<MessageType> = { type: MessageType.READY_REQUEST }
adapter.send(value)
expect(sendSpy).toHaveBeenCalledWith('{"type":"READY_REQUEST"}')
})
it('can read the connection state when open', () => {
mockSocket(WebSocket.OPEN)
const { adapter } = mockSocket(WebSocket.OPEN)
expect(adapter.getConnectionState()).toBe(ConnectionState.CONNECTED)
})
it('can read the connection state when connecting', () => {
mockSocket(WebSocket.CONNECTING)
const { adapter } = mockSocket(WebSocket.CONNECTING)
expect(adapter.getConnectionState()).toBe(ConnectionState.CONNECTING)
})
it('can read the connection state when closing', () => {
mockSocket(WebSocket.CLOSING)
const { adapter } = mockSocket(WebSocket.CLOSING)
expect(adapter.getConnectionState()).toBe(ConnectionState.DISCONNECTED)
})
it('can read the connection state when closed', () => {
mockSocket(WebSocket.CLOSED)
const { adapter } = mockSocket(WebSocket.CLOSED)
expect(adapter.getConnectionState()).toBe(ConnectionState.DISCONNECTED)
})
})

3
frontend/src/components/editor-page/editor-pane/linter/frontmatter-linter.spec.ts
View file

@ -8,6 +8,7 @@ import { FrontmatterLinter } from './frontmatter-linter'
import { mockEditorView } from './single-line-regex-linter.spec'
import type { Diagnostic } from '@codemirror/lint'
import { t } from 'i18next'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
const testFrontmatterLinter = (
editorContent: string,
@ -22,7 +23,7 @@ const testFrontmatterLinter = (
expect(calculatedDiagnostics[0].to).toEqual(expectedDiagnostics.to)
expect(calculatedDiagnostics[0].severity).toEqual(expectedDiagnostics.severity)
if (expectedReplacement !== undefined) {
const spy = jest.spyOn(editorView, 'dispatch')
const spy = vitest.spyOn(editorView, 'dispatch')
expect(calculatedDiagnostics[0].actions).toHaveLength(1)
expect(calculatedDiagnostics[0].actions?.[0].name).toEqual(t('editor.linter.defaultAction'))
calculatedDiagnostics[0].actions?.[0].apply(editorView, calculatedDiagnostics[0].from, calculatedDiagnostics[0].to)

3
frontend/src/components/editor-page/editor-pane/linter/single-line-regex-linter.spec.ts
View file

@ -9,6 +9,7 @@ import type { Diagnostic } from '@codemirror/lint'
import type { EditorState, Text } from '@codemirror/state'
import type { EditorView } from '@codemirror/view'
import { Mock } from 'ts-mockery'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
export const mockEditorView = (content: string): EditorView => {
const docMock = Mock.of<Text>()
@ -17,7 +18,7 @@ export const mockEditorView = (content: string): EditorView => {
state: Mock.of<EditorState>({
doc: docMock
}),
dispatch: jest.fn()
dispatch: vitest.fn()
})
}

1
frontend/src/components/editor-page/editor-pane/tool-bar/formatters/add-link.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { addLink } from './add-link'
import type { ContentEdits } from './types/changes'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('add link', () => {
describe('without to-cursor', () => {

1
frontend/src/components/editor-page/editor-pane/tool-bar/formatters/prepend-lines-of-selection.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { prependLinesOfSelection } from './prepend-lines-of-selection'
import type { ContentEdits } from './types/changes'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('replace lines of selection', () => {
it('replaces only the from-cursor line if no to-cursor is present', () => {

1
frontend/src/components/editor-page/editor-pane/tool-bar/formatters/replace-selection.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { replaceSelection } from './replace-selection'
import type { ContentEdits } from './types/changes'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('replace selection', () => {
it('inserts a text after the from-cursor if no to-cursor is present', () => {

1
frontend/src/components/editor-page/editor-pane/tool-bar/formatters/utils/change-cursors-to-whole-line-if-no-to-cursor.spec.ts
View file

@ -9,6 +9,7 @@ import {
searchForEndOfLine,
searchForStartOfLine
} from './change-cursors-to-whole-line-if-no-to-cursor'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('changeCursorsToWholeLineIfNoToCursor', () => {
it(`returns the given selection if to cursor is present`, () => {

1
frontend/src/components/editor-page/editor-pane/tool-bar/formatters/wrap-selection.spec.ts
View file

@ -5,6 +5,7 @@
*/
import type { ContentEdits } from './types/changes'
import { wrapSelection } from './wrap-selection'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('wrap selection', () => {
it(`doesn't modify any line if no to-cursor is present`, () => {

1
frontend/src/components/editor-page/editor-pane/tool-bar/table-picker/create-markdown-table.spec.ts
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { createMarkdownTable } from './create-markdown-table'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('create markdown table', () => {
it('generates a valid table', () => {

1
frontend/src/components/editor-page/editor-pane/tool-bar/upload-image-button/extract-selected-text.spec.ts
View file

@ -6,6 +6,7 @@
import { extractSelectedText } from './extract-selected-text'
import type { EditorState, SelectionRange } from '@codemirror/state'
import { Mock } from 'ts-mockery'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('extract selected text', () => {
const mockContent = "I'm a mock content!"

10
frontend/src/components/editor-page/head-meta-properties/hooks/use-has-markdown-content-been-changed-in-background.spec.tsx
View file

@ -8,9 +8,11 @@ import * as UseNoteMarkdownContent from '../../../../hooks/common/use-note-markd
import { useHasMarkdownContentBeenChangedInBackground } from './use-has-markdown-content-been-changed-in-background'
import { render } from '@testing-library/react'
import React, { Fragment } from 'react'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../../hooks/common/use-is-document-visible')
jest.mock('../../../../hooks/common/use-note-markdown-content')
vi.mock('../../../../hooks/common/use-is-document-visible')
vi.mock('../../../../hooks/common/use-note-markdown-content')
describe('use has markdown content been changed in background', () => {
const TestComponent: React.FC = () => {
@ -22,8 +24,8 @@ describe('use has markdown content been changed in background', () => {
let noteContent = 'content'
beforeEach(() => {
jest.spyOn(UseIsDocumentVisibleModule, 'useIsDocumentVisible').mockImplementation(() => documentVisible)
jest.spyOn(UseNoteMarkdownContent, 'useNoteMarkdownContent').mockImplementation(() => noteContent)
vitest.spyOn(UseIsDocumentVisibleModule, 'useIsDocumentVisible').mockImplementation(() => documentVisible)
vitest.spyOn(UseNoteMarkdownContent, 'useNoteMarkdownContent').mockImplementation(() => noteContent)
})
it('returns the correct value', () => {

4
frontend/src/components/editor-page/realtime-connection-alert/__snapshots__/realtime-connection-alert.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`realtime connection alert will render correctly 1`] = `
exports[`realtime connection alert > will render correctly 1`] = `
<div>
<div
class="fade w-100 m-0 px-2 py-1 border-top-0 border-bottom-0 d-flex align-items-center alert alert-warning show"

1
frontend/src/components/editor-page/realtime-connection-alert/realtime-connection-alert.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../test-utils/mock-i18n'
import { RealtimeConnectionAlert } from './realtime-connection-alert'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll } from 'vitest'
describe('realtime connection alert', () => {
beforeAll(mockI18n)

4
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/__snapshots__/aliases-add-form.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`AliasesAddForm renders the input form 1`] = `
exports[`AliasesAddForm > renders the input form 1`] = `
<div>
<form>
<div

10
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/__snapshots__/aliases-list-entry.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`AliasesListEntry adds aliasPrimaryBadge & removes aliasButtonMakePrimary in AliasesListEntry if it's primary 1`] = `
exports[`AliasesListEntry > adds aliasPrimaryBadge & removes aliasButtonMakePrimary in AliasesListEntry if it's primary 1`] = `
<div>
<li
class="list-group-item d-flex flex-row justify-content-between align-items-center"
@ -30,7 +30,7 @@ exports[`AliasesListEntry adds aliasPrimaryBadge & removes aliasButtonMakePrimar
</div>
`;
exports[`AliasesListEntry removes aliasPrimaryBadge & adds aliasButtonMakePrimary in AliasesListEntry if it's not primary 1`] = `
exports[`AliasesListEntry > removes aliasPrimaryBadge & adds aliasButtonMakePrimary in AliasesListEntry if it's not primary 1`] = `
<div>
<li
class="list-group-item d-flex flex-row justify-content-between align-items-center"
@ -62,7 +62,7 @@ exports[`AliasesListEntry removes aliasPrimaryBadge & adds aliasButtonMakePrimar
</div>
`;
exports[`AliasesListEntry renders an AliasesListEntry that is not primary 1`] = `
exports[`AliasesListEntry > renders an AliasesListEntry that is not primary 1`] = `
<div>
<li
class="list-group-item d-flex flex-row justify-content-between align-items-center"
@ -92,7 +92,7 @@ exports[`AliasesListEntry renders an AliasesListEntry that is not primary 1`] =
</div>
`;
exports[`AliasesListEntry renders an AliasesListEntry that is primary 1`] = `
exports[`AliasesListEntry > renders an AliasesListEntry that is primary 1`] = `
<div>
<li
class="list-group-item d-flex flex-row justify-content-between align-items-center"

28
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/__snapshots__/aliases-list.spec.tsx.snap
View file

@ -1,27 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`AliasesList renders the AliasList sorted 1`] = `
<div>
<span>
Alias:
a-test
(
non-primary
)
</span>
<span>
Alias:
b-test
(
primary
)
</span>
<span>
Alias:
z-test
(
non-primary
)
</span>
</div>
`;
exports[`AliasesList > renders the AliasList sorted 1`] = `<div />`;

4
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/__snapshots__/aliases-modal.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`AliasesModal renders the modal 1`] = `
exports[`AliasesModal > renders the modal 1`] = `
<div>
<span>
This is a mock implementation of a Modal:

20
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/aliases-add-form.spec.tsx
View file

@ -13,11 +13,15 @@ import { act, render, screen } from '@testing-library/react'
import testEvent from '@testing-library/user-event'
import React from 'react'
import { mockUiNotifications } from '../../../../../../test-utils/mock-ui-notifications'
import { beforeEach, describe, expect, it, vitest, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../../../../api/alias')
jest.mock('../../../../../../redux/note-details/methods')
jest.mock('../../../../../../hooks/common/use-application-state')
jest.mock('../../../../../notifications/ui-notification-boundary')
vi.mock('../../../../../../api/alias')
vi.mock('../../../../../../redux/note-details/methods')
vi.mock('../../../../../../hooks/common/use-application-state')
vi.mock('../../../../../notifications/ui-notification-boundary', () => ({
useUiNotifications: vi.fn(() => ({ showErrorNotification: vi.fn() }))
}))
const addPromise = Promise.resolve({ name: 'mock', primaryAlias: true, noteId: 'mock' })
@ -25,14 +29,14 @@ describe('AliasesAddForm', () => {
beforeEach(async () => {
await mockI18n()
mockUiNotifications()
jest.spyOn(AliasModule, 'addAlias').mockImplementation(() => addPromise)
jest.spyOn(NoteDetailsReduxModule, 'updateMetadata').mockImplementation(() => Promise.resolve())
vitest.spyOn(AliasModule, 'addAlias').mockImplementation(() => addPromise)
vitest.spyOn(NoteDetailsReduxModule, 'updateMetadata').mockImplementation(() => Promise.resolve())
mockNotePermissions('test', 'test', undefined, { noteDetails: { id: 'mock-note' } as NoteDetails })
})
afterAll(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders the input form', async () => {

48
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/aliases-list-entry.spec.tsx
View file

@ -3,8 +3,6 @@
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import * as AliasModule from '../../../../../../api/alias'
import * as NoteDetailsReduxModule from '../../../../../../redux/note-details/methods'
import { mockI18n } from '../../../../../../test-utils/mock-i18n'
import { mockNotePermissions } from '../../../../../../test-utils/mock-note-permissions'
import { AliasesListEntry } from './aliases-list-entry'
@ -12,27 +10,36 @@ import { act, render, screen } from '@testing-library/react'
import React from 'react'
import { mockUiNotifications } from '../../../../../../test-utils/mock-ui-notifications'
import type { AliasDto } from '@hedgedoc/commons'
import { afterEach, beforeEach, describe, expect, it, vitest } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../../../../api/alias')
jest.mock('../../../../../../redux/note-details/methods')
jest.mock('../../../../../notifications/ui-notification-boundary')
jest.mock('../../../../../../hooks/common/use-application-state')
const { updateMetadata, markAliasAsPrimary, deleteAlias } = vi.hoisted(() => ({
deleteAlias: vi.fn(() => Promise.resolve()),
markAliasAsPrimary: vi.fn(() => Promise.resolve({ name: 'mock', primaryAlias: true, noteId: 'mock' })),
updateMetadata: vi.fn(() => Promise.resolve())
}))
const deletePromise = Promise.resolve()
const markAsPrimaryPromise = Promise.resolve({ name: 'mock', primaryAlias: true, noteId: 'mock' })
vi.mock('../../../../../../api/alias', () => ({
deleteAlias,
markAliasAsPrimary
}))
vi.mock('../../../../../../redux/note-details/methods', () => ({
updateMetadata
}))
vi.mock('../../../../../notifications/ui-notification-boundary', () => ({
useUiNotifications: vi.fn(() => ({ showErrorNotification: vi.fn() }))
}))
vi.mock('../../../../../../hooks/common/use-application-state')
describe('AliasesListEntry', () => {
beforeEach(async () => {
await mockI18n()
mockUiNotifications()
jest.spyOn(AliasModule, 'deleteAlias').mockImplementation(() => deletePromise)
jest.spyOn(AliasModule, 'markAliasAsPrimary').mockImplementation(() => markAsPrimaryPromise)
jest.spyOn(NoteDetailsReduxModule, 'updateMetadata').mockImplementation(() => Promise.resolve())
})
afterEach(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders an AliasesListEntry that is primary', async () => {
@ -48,9 +55,8 @@ describe('AliasesListEntry', () => {
await act<void>(() => {
button.click()
})
expect(AliasModule.deleteAlias).toBeCalledWith(testAlias.name)
await deletePromise
expect(NoteDetailsReduxModule.updateMetadata).toBeCalled()
expect(deleteAlias).toBeCalledWith(testAlias.name)
expect(updateMetadata).toBeCalled()
})
it("adds aliasPrimaryBadge & removes aliasButtonMakePrimary in AliasesListEntry if it's primary", () => {
@ -77,16 +83,14 @@ describe('AliasesListEntry', () => {
await act<void>(() => {
buttonRemove.click()
})
expect(AliasModule.deleteAlias).toBeCalledWith(testAlias.name)
await deletePromise
expect(NoteDetailsReduxModule.updateMetadata).toBeCalled()
expect(deleteAlias).toBeCalledWith(testAlias.name)
expect(updateMetadata).toBeCalled()
const buttonMakePrimary = await screen.findByTestId('aliasButtonMakePrimary')
await act<void>(() => {
buttonMakePrimary.click()
})
expect(AliasModule.markAliasAsPrimary).toBeCalledWith(testAlias.name)
await markAsPrimaryPromise
expect(NoteDetailsReduxModule.updateMetadata).toBeCalled()
expect(markAliasAsPrimary).toBeCalledWith(testAlias.name)
expect(updateMetadata).toBeCalled()
})
it("removes aliasPrimaryBadge & adds aliasButtonMakePrimary in AliasesListEntry if it's not primary", () => {

12
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/aliases-list.spec.tsx
View file

@ -10,9 +10,11 @@ import * as AliasesListEntryModule from './aliases-list-entry'
import { render } from '@testing-library/react'
import React from 'react'
import { mockAppState } from '../../../../../../test-utils/mock-app-state'
import { beforeEach, describe, expect, it, vitest, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../../../../hooks/common/use-application-state')
jest.mock('./aliases-list-entry')
vi.mock('../../../../../../hooks/common/use-application-state')
vi.mock('./aliases-list-entry')
describe('AliasesList', () => {
beforeEach(async () => {
@ -38,7 +40,7 @@ describe('AliasesList', () => {
]
}
})
jest.spyOn(AliasesListEntryModule, 'AliasesListEntry').mockImplementation((({ alias }) => {
vitest.spyOn(AliasesListEntryModule, 'AliasesListEntry').mockImplementation((({ alias }) => {
return (
<span>
Alias: {alias.name} ({alias.primaryAlias ? 'primary' : 'non-primary'})
@ -48,8 +50,8 @@ describe('AliasesList', () => {
})
afterAll(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders the AliasList sorted', () => {

20
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/aliases-sidebar-entry/aliases-modal/aliases-modal.spec.tsx
View file

@ -13,34 +13,36 @@ import { render } from '@testing-library/react'
import type { PropsWithChildren } from 'react'
import React from 'react'
import { mockUiNotifications } from '../../../../../../test-utils/mock-ui-notifications'
import { beforeEach, describe, expect, it, vitest, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('./aliases-list')
jest.mock('./aliases-add-form')
jest.mock('../../../../../common/modals/common-modal')
jest.mock('../../../../../notifications/ui-notification-boundary')
vi.mock('./aliases-list')
vi.mock('./aliases-add-form')
vi.mock('../../../../../common/modals/common-modal')
vi.mock('../../../../../notifications/ui-notification-boundary')
describe('AliasesModal', () => {
beforeEach(async () => {
await mockI18n()
mockUiNotifications()
jest.spyOn(CommonModalModule, 'CommonModal').mockImplementation((({ children }) => {
vitest.spyOn(CommonModalModule, 'CommonModal').mockImplementation((({ children }) => {
return (
<span>
This is a mock implementation of a Modal: <dialog>{children}</dialog>
</span>
)
}) as React.FC<PropsWithChildren<CommonModalProps>>)
jest.spyOn(AliasesListModule, 'AliasesList').mockImplementation((() => {
vitest.spyOn(AliasesListModule, 'AliasesList').mockImplementation((() => {
return <span>This is a mock for the AliasesList that is tested separately.</span>
}) as React.FC)
jest.spyOn(AliasesAddFormModule, 'AliasesAddForm').mockImplementation((() => {
vitest.spyOn(AliasesAddFormModule, 'AliasesAddForm').mockImplementation((() => {
return <span>This is a mock for the AliasesAddForm that is tested separately.</span>
}) as React.FC)
})
afterAll(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders the modal', () => {

1
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/export-sidebar-menu/entries/export-gist-sidebar-entry/validate-token.spec.ts
View file

@ -1,4 +1,5 @@
import { validateToken } from './validate-token'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
/*
* SPDX-FileCopyrightText: 2024 The HedgeDoc developers (see AUTHORS file)

4
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/revisions-sidebar-entry/revisions-modal/__snapshots__/invert-unified-patch.spec.ts.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`invert unified patch inverts a patch correctly 1`] = `
exports[`invert unified patch > inverts a patch correctly 1`] = `
{
"hunks": [
{

1
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/revisions-sidebar-entry/revisions-modal/invert-unified-patch.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { invertUnifiedPatch } from './invert-unified-patch'
import { parsePatch } from 'diff'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('invert unified patch', () => {
it('inverts a patch correctly', () => {

112
frontend/src/components/editor-page/splitter/__snapshots__/splitter.spec.tsx.snap
View file

@ -1,31 +1,31 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Splitter resize can change size with mouse 1`] = `
exports[`Splitter > resize > can change size with mouse 1`] = `
<div>
<div
class="flex-fill flex-row d-flex "
>
<div
class="left"
class="_left_d43a0d"
id="editor-edit-pane"
style="width: calc(50% - 5px);"
style="width: calc(-5px + (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
left
</div>
</div>
<div
class="divider"
class="_divider_e4e78e"
data-testid="splitter-divider"
id="editor-splitter"
>
<div
class="middle"
class="_middle_e4e78e"
>
<div
class="buttons"
class="_buttons_e4e78e"
>
<button
class="btn btn-light"
@ -34,7 +34,7 @@ exports[`Splitter resize can change size with mouse 1`] = `
BootstrapIconMock_ArrowLeft
</button>
<span
class="grabber"
class="_grabber_e4e78e"
>
BootstrapIconMock_ArrowLeftRight
</span>
@ -48,12 +48,12 @@ exports[`Splitter resize can change size with mouse 1`] = `
</div>
</div>
<div
class="right"
class="_right_d43a0d"
id="editor-view-pane"
style="width: calc(100% - 50%);"
style="width: calc(100% - (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
right
</div>
@ -62,32 +62,32 @@ exports[`Splitter resize can change size with mouse 1`] = `
</div>
`;
exports[`Splitter resize can change size with touch 1`] = `
exports[`Splitter > resize > can change size with touch 1`] = `
<div>
<div
class="flex-fill flex-row d-flex "
>
<div
class="left"
class="_left_d43a0d"
id="editor-edit-pane"
style="width: calc(50% - 5px);"
style="width: calc(-5px + (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
left
</div>
</div>
<div
class="divider"
class="_divider_e4e78e"
data-testid="splitter-divider"
id="editor-splitter"
>
<div
class="middle"
class="_middle_e4e78e"
>
<div
class="buttons"
class="_buttons_e4e78e"
>
<button
class="btn btn-light"
@ -96,7 +96,7 @@ exports[`Splitter resize can change size with touch 1`] = `
BootstrapIconMock_ArrowLeft
</button>
<span
class="grabber"
class="_grabber_e4e78e"
>
BootstrapIconMock_ArrowLeftRight
</span>
@ -110,12 +110,12 @@ exports[`Splitter resize can change size with touch 1`] = `
</div>
</div>
<div
class="right"
class="_right_d43a0d"
id="editor-view-pane"
style="width: calc(100% - 50%);"
style="width: calc(100% - (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
right
</div>
@ -124,32 +124,32 @@ exports[`Splitter resize can change size with touch 1`] = `
</div>
`;
exports[`Splitter resize can change size with touch 2`] = `
exports[`Splitter > resize > can change size with touch 2`] = `
<div>
<div
class="flex-fill flex-row d-flex "
>
<div
class="left"
class="_left_d43a0d"
id="editor-edit-pane"
style="width: calc(50% - 5px);"
style="width: calc(-5px + (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
left
</div>
</div>
<div
class="divider"
class="_divider_e4e78e"
data-testid="splitter-divider"
id="editor-splitter"
>
<div
class="middle"
class="_middle_e4e78e"
>
<div
class="buttons"
class="_buttons_e4e78e"
>
<button
class="btn btn-light"
@ -158,7 +158,7 @@ exports[`Splitter resize can change size with touch 2`] = `
BootstrapIconMock_ArrowLeft
</button>
<span
class="grabber"
class="_grabber_e4e78e"
>
BootstrapIconMock_ArrowLeftRight
</span>
@ -172,12 +172,12 @@ exports[`Splitter resize can change size with touch 2`] = `
</div>
</div>
<div
class="right"
class="_right_d43a0d"
id="editor-view-pane"
style="width: calc(100% - 50%);"
style="width: calc(100% - (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
right
</div>
@ -186,32 +186,32 @@ exports[`Splitter resize can change size with touch 2`] = `
</div>
`;
exports[`Splitter resize can change size with touch 3`] = `
exports[`Splitter > resize > can change size with touch 3`] = `
<div>
<div
class="flex-fill flex-row d-flex "
>
<div
class="left"
class="_left_d43a0d"
id="editor-edit-pane"
style="width: calc(50% - 5px);"
style="width: calc(-5px + (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
left
</div>
</div>
<div
class="divider"
class="_divider_e4e78e"
data-testid="splitter-divider"
id="editor-splitter"
>
<div
class="middle"
class="_middle_e4e78e"
>
<div
class="buttons"
class="_buttons_e4e78e"
>
<button
class="btn btn-light"
@ -220,7 +220,7 @@ exports[`Splitter resize can change size with touch 3`] = `
BootstrapIconMock_ArrowLeft
</button>
<span
class="grabber"
class="_grabber_e4e78e"
>
BootstrapIconMock_ArrowLeftRight
</span>
@ -234,12 +234,12 @@ exports[`Splitter resize can change size with touch 3`] = `
</div>
</div>
<div
class="right"
class="_right_d43a0d"
id="editor-view-pane"
style="width: calc(100% - 50%);"
style="width: calc(100% - (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
right
</div>
@ -248,32 +248,32 @@ exports[`Splitter resize can change size with touch 3`] = `
</div>
`;
exports[`Splitter resize can change size with touch 4`] = `
exports[`Splitter > resize > can change size with touch 4`] = `
<div>
<div
class="flex-fill flex-row d-flex "
>
<div
class="left"
class="_left_d43a0d"
id="editor-edit-pane"
style="width: calc(50% - 5px);"
style="width: calc(-5px + (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
left
</div>
</div>
<div
class="divider"
class="_divider_e4e78e"
data-testid="splitter-divider"
id="editor-splitter"
>
<div
class="middle"
class="_middle_e4e78e"
>
<div
class="buttons"
class="_buttons_e4e78e"
>
<button
class="btn btn-light"
@ -282,7 +282,7 @@ exports[`Splitter resize can change size with touch 4`] = `
BootstrapIconMock_ArrowLeft
</button>
<span
class="grabber"
class="_grabber_e4e78e"
>
BootstrapIconMock_ArrowLeftRight
</span>
@ -296,12 +296,12 @@ exports[`Splitter resize can change size with touch 4`] = `
</div>
</div>
<div
class="right"
class="_right_d43a0d"
id="editor-view-pane"
style="width: calc(100% - 50%);"
style="width: calc(100% - (% * nan));"
>
<div
class="inner"
class="_inner_d43a0d"
>
right
</div>

8
frontend/src/components/editor-page/splitter/splitter.spec.tsx
View file

@ -9,11 +9,13 @@ import { Mock } from 'ts-mockery'
import * as EditorConfigModule from '../../../redux/editor-config/methods'
import { mockAppState } from '../../../test-utils/mock-app-state'
import type { EditorConfig } from '../../../redux/editor-config/types'
import { beforeEach, describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../hooks/common/use-application-state')
jest.mock('../../../redux/editor-config/methods')
vi.mock('../../../hooks/common/use-application-state')
vi.mock('../../../redux/editor-config/methods')
const setEditorSplitPosition = jest.spyOn(EditorConfigModule, 'setEditorSplitPosition').mockReturnValue()
const setEditorSplitPosition = vitest.spyOn(EditorConfigModule, 'setEditorSplitPosition').mockReturnValue()
describe('Splitter', () => {
describe('resize', () => {

10
frontend/src/components/editor-page/table-of-contents/__snapshots__/table-of-contents.spec.tsx.snap
View file

@ -1,9 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Table of contents renders correctly 1`] = `
exports[`Table of contents > renders correctly 1`] = `
<div>
<div
class="toc customClassName"
class="_toc_e84bed customClassName"
>
<ul>
<li>
@ -39,10 +39,10 @@ exports[`Table of contents renders correctly 1`] = `
</div>
`;
exports[`Table of contents renders only in requested max depth 1`] = `
exports[`Table of contents > renders only in requested max depth 1`] = `
<div>
<div
class="toc customClassName"
class="_toc_e84bed customClassName"
>
<ul>
<li>

1
frontend/src/components/editor-page/table-of-contents/table-of-contents.spec.tsx
View file

@ -7,6 +7,7 @@ import { mockI18n } from '../../../test-utils/mock-i18n'
import { TableOfContents } from './table-of-contents'
import type { TocAst } from '@hedgedoc/markdown-it-plugins'
import { render } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Table of contents', () => {
beforeAll(async () => {

8
frontend/src/components/global-dialogs/motd-modal/__snapshots__/motd-modal.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`motd modal doesn't render a modal if no motd has been fetched 1`] = `
exports[`motd modal > doesn't render a modal if no motd has been fetched 1`] = `
<div>
<span
data-testid="loaded not visible"
@ -8,7 +8,7 @@ exports[`motd modal doesn't render a modal if no motd has been fetched 1`] = `
</div>
`;
exports[`motd modal renders a modal if a motd was fetched and can dismiss it 1`] = `
exports[`motd modal > renders a modal if a motd was fetched and can dismiss it 1`] = `
<div>
<span>
This is a mock implementation of a Modal:
@ -39,7 +39,7 @@ exports[`motd modal renders a modal if a motd was fetched and can dismiss it 1`]
</div>
`;
exports[`motd modal renders a modal if a motd was fetched and can dismiss it 2`] = `
exports[`motd modal > renders a modal if a motd was fetched and can dismiss it 2`] = `
<div>
<span>
This is a mock implementation of a Modal:

13
frontend/src/components/global-dialogs/motd-modal/fetch-motd.spec.ts
View file

@ -5,6 +5,7 @@
*/
import { fetchMotd } from './fetch-motd'
import { Mock } from 'ts-mockery'
import { afterEach, beforeEach, describe, expect, it, vitest, beforeAll } from 'vitest'
describe('fetch motd', () => {
const baseUrl = 'https://example.org/'
@ -14,19 +15,19 @@ describe('fetch motd', () => {
window.localStorage.clear()
})
afterEach(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
beforeAll(() => {
global.fetch = jest.fn()
global.fetch = vitest.fn()
})
const mockFetch = (
responseText: string,
lastModified: string | null,
etag?: string | null
): jest.SpyInstance<Promise<Response>> => {
return jest.spyOn(global, 'fetch').mockImplementation((url: RequestInfo | URL) => {
): vitest.SpyInstance<Promise<Response>> => {
return vitest.spyOn(global, 'fetch').mockImplementation((url: RequestInfo | URL) => {
if (url !== motdUrl) {
return Promise.reject(new Error('wrong url'))
}
@ -45,7 +46,7 @@ describe('fetch motd', () => {
}
const mockFileNotFoundFetch = () => {
jest.spyOn(global, 'fetch').mockImplementation(() =>
vitest.spyOn(global, 'fetch').mockImplementation(() =>
Promise.resolve(
Mock.of<Response>({
status: 404

18
frontend/src/components/global-dialogs/motd-modal/motd-modal.spec.tsx
View file

@ -14,31 +14,33 @@ import type { PropsWithChildren } from 'react'
import React from 'react'
import { CachedMotdModal } from './cached-motd-modal'
import { MotdProvider } from '../../motd/motd-context'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../common/modals/common-modal')
jest.mock('../../common/renderer-iframe/renderer-iframe')
jest.mock('../../../hooks/common/use-base-url')
vi.mock('../../common/modals/common-modal')
vi.mock('../../common/renderer-iframe/renderer-iframe')
vi.mock('../../../hooks/common/use-base-url')
describe('motd modal', () => {
beforeAll(async () => {
jest.spyOn(UseBaseUrlModule, 'useBaseUrl').mockImplementation(() => 'https://example.org')
vitest.spyOn(UseBaseUrlModule, 'useBaseUrl').mockImplementation(() => 'https://example.org')
await mockI18n()
})
afterAll(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
beforeAll(() => {
jest.spyOn(CommonModalModule, 'CommonModal').mockImplementation((({ children, show }) => {
vitest.spyOn(CommonModalModule, 'CommonModal').mockImplementation((({ children, show }) => {
return (
<span>
This is a mock implementation of a Modal: {show ? <dialog>{children}</dialog> : 'Modal is invisible'}
</span>
)
}) as React.FC<PropsWithChildren<CommonModalProps>>)
jest.spyOn(RendererIframeModule, 'RendererIframe').mockImplementation((props) => {
vitest.spyOn(RendererIframeModule, 'RendererIframe').mockImplementation((props) => {
return (
<span {...testId('motd-renderer')}>
This is a mock implementation of a iframe renderer. Props: {JSON.stringify(props)}

6
frontend/src/components/global-dialogs/settings-dialog/editor/__snapshots__/editor-settings-tab-content.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`EditorSettingsTabContent hides space settings indentWithTabs is true 1`] = `
exports[`EditorSettingsTabContent > hides space settings indentWithTabs is true 1`] = `
<div>
<div
class="list-group"
@ -279,7 +279,7 @@ exports[`EditorSettingsTabContent hides space settings indentWithTabs is true 1`
</div>
`;
exports[`EditorSettingsTabContent renders space settings when indentWithTabs is false 1`] = `
exports[`EditorSettingsTabContent > renders space settings when indentWithTabs is false 1`] = `
<div>
<div
class="list-group"

8
frontend/src/components/global-dialogs/settings-dialog/editor/editor-settings-tab-content.spec.tsx
View file

@ -8,8 +8,10 @@ import { mockAppState } from '../../../../test-utils/mock-app-state'
import { render } from '@testing-library/react'
import { EditorSettingsTabContent } from './editor-settings-tab-content'
import { mockI18n } from '../../../../test-utils/mock-i18n'
import { afterEach, beforeEach, describe, expect, it, vitest } from 'vitest'
import { vi } from 'vitest'
jest.mock('../../../../hooks/common/use-application-state')
vi.mock('../../../../hooks/common/use-application-state')
describe('EditorSettingsTabContent', () => {
beforeEach(async () => {
@ -17,8 +19,8 @@ describe('EditorSettingsTabContent', () => {
})
afterEach(() => {
jest.resetAllMocks()
jest.resetModules()
vitest.resetAllMocks()
vitest.resetModules()
})
it('renders space settings when indentWithTabs is false', () => {

4
frontend/src/components/global-dialogs/settings-dialog/global/__snapshots__/language-picker.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`language picker renders all languages 1`] = `
exports[`language picker > renders all languages 1`] = `
<div>
<select
as="select"

6
frontend/src/components/global-dialogs/settings-dialog/global/language-picker.spec.tsx
View file

@ -7,9 +7,11 @@ import { mockI18n } from '../../../../test-utils/mock-i18n'
import { LanguagePicker } from './language-picker'
import { fireEvent, render, screen } from '@testing-library/react'
import i18n from 'i18next'
import { describe, expect, it, vitest, beforeAll, afterAll } from 'vitest'
import { vi } from 'vitest'
jest.mock('./available-languages', () => ({
availableLanguages: jest.fn(() => ['de', 'en'])
vi.mock('./available-languages', () => ({
availableLanguages: vitest.fn(() => ['de', 'en'])
}))
describe('language picker', () => {

8
frontend/src/components/global-dialogs/settings-dialog/utils/__snapshots__/on-off-button-group.spec.tsx.snap
View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Settings On-Off Button Group accepts custom labels 1`] = `
exports[`Settings On-Off Button Group > accepts custom labels 1`] = `
<div>
<div
class="btn-group"
@ -28,7 +28,7 @@ exports[`Settings On-Off Button Group accepts custom labels 1`] = `
</div>
`;
exports[`Settings On-Off Button Group can switch value 1`] = `
exports[`Settings On-Off Button Group > can switch value 1`] = `
<div>
<div
class="btn-group"
@ -56,7 +56,7 @@ exports[`Settings On-Off Button Group can switch value 1`] = `
</div>
`;
exports[`Settings On-Off Button Group can switch value 2`] = `
exports[`Settings On-Off Button Group > can switch value 2`] = `
<div>
<div
class="btn-group"

1
frontend/src/components/global-dialogs/settings-dialog/utils/on-off-button-group.spec.tsx
View file

@ -6,6 +6,7 @@
import { mockI18n } from '../../../../test-utils/mock-i18n'
import { OnOffButtonGroup } from './on-off-button-group'
import { act, render, screen } from '@testing-library/react'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Settings On-Off Button Group', () => {
beforeAll(mockI18n)

1
frontend/src/components/markdown-renderer/extensions/_base-classes/code-block-markdown-extension/code-block-parameters.spec.ts
View file

@ -4,6 +4,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { parseCodeBlockParameters } from './code-block-parameters'
import { describe, expect, it, beforeAll, afterAll } from 'vitest'
describe('Code block parameter parsing', () => {
it('should detect just the language', () => {

Some files were not shown because too many files have changed in this diff Show more