Skip to content

Commit fa50261

Browse files
susnuxskjnldsv
authored andcommitted
test: Add proper styles for Cypress component tests
This also fixes Typescript issue but requires to slightly adjust the Navigation test as the progress bar is not visible (because it is overlayed by another element). Signed-off-by: Ferdinand Thiessen <[email protected]>
1 parent 55595f6 commit fa50261

File tree

8 files changed

+122
-97
lines changed

8 files changed

+122
-97
lines changed

apps/federatedfilesharing/src/external.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { loadState } from '@nextcloud/initial-state'
1010
import { t } from '@nextcloud/l10n'
1111
import { generateUrl } from '@nextcloud/router'
1212
import { showRemoteShareDialog } from './services/dialogService.ts'
13+
import logger from './services/logger.ts'
1314

1415
window.OCA.Sharing = window.OCA.Sharing ?? {}
1516

@@ -105,7 +106,7 @@ function processIncomingShareFromUrl() {
105106
showInfo(data.message)
106107
}
107108
}).catch((error) => {
108-
console.error('Error while processing incoming share', error)
109+
logger.error('Error while processing incoming share', { error })
109110

110111
if (isAxiosError(error) && error.response.data.message) {
111112
showError(error.response.data.message)
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
/**
2+
* SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
3+
* SPDX-License-Identifier: AGPL-3.0-or-later
4+
*/
5+
import { getLoggerBuilder } from '@nextcloud/logger'
6+
7+
const logger = getLoggerBuilder()
8+
.setApp('federatedfilesharing')
9+
.build()
10+
export default logger

cypress/support/commands.ts

+1-74
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
* SPDX-License-Identifier: AGPL-3.0-or-later
44
*/
55
// eslint-disable-next-line n/no-extraneous-import
6-
import axios, { type AxiosResponse } from 'axios'
6+
import axios from 'axios'
77
import { addCommands, User } from '@nextcloud/cypress'
88
import { basename } from 'path'
99

@@ -13,79 +13,6 @@ import 'cypress-if'
1313
import 'cypress-wait-until'
1414
addCommands()
1515

16-
// Register this file's custom commands types
17-
declare global {
18-
// eslint-disable-next-line @typescript-eslint/no-namespace
19-
namespace Cypress {
20-
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
21-
interface Chainable<Subject = any> {
22-
/**
23-
* Enable or disable a given user
24-
*/
25-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
26-
enableUser(user: User, enable?: boolean): Cypress.Chainable<Cypress.Response<any>>,
27-
28-
/**
29-
* Upload a file from the fixtures folder to a given user storage.
30-
* **Warning**: Using this function will reset the previous session
31-
*/
32-
uploadFile(user: User, fixture?: string, mimeType?: string, target?: string): Cypress.Chainable<void>,
33-
34-
/**
35-
* Upload a raw content to a given user storage.
36-
* **Warning**: Using this function will reset the previous session
37-
*/
38-
uploadContent(user: User, content: Blob, mimeType: string, target: string, mtime?: number): Cypress.Chainable<AxiosResponse>,
39-
40-
/**
41-
* Create a new directory
42-
* **Warning**: Using this function will reset the previous session
43-
*/
44-
mkdir(user: User, target: string): Cypress.Chainable<void>,
45-
46-
/**
47-
* Set a file as favorite (or remove from favorite)
48-
*/
49-
setFileAsFavorite(user: User, target: string, favorite?: boolean): Cypress.Chainable<void>,
50-
51-
/**
52-
* Reset the admin theming entirely.
53-
* **Warning**: Using this function will reset the previous session
54-
*/
55-
resetAdminTheming(): Cypress.Chainable<void>,
56-
57-
/**
58-
* Reset the user theming settings.
59-
* If provided, will clear session and login as the given user.
60-
* **Warning**: Providing a user will reset the previous session.
61-
*/
62-
resetUserTheming(user?: User): Cypress.Chainable<void>,
63-
64-
/**
65-
* Run an occ command in the docker container.
66-
*/
67-
runOccCommand(command: string, options?: Partial<Cypress.ExecOptions>): Cypress.Chainable<Cypress.Exec>,
68-
69-
userFileExists(user: string, path: string): Cypress.Chainable<number>
70-
71-
/**
72-
* Create a snapshot of the current database
73-
*/
74-
backupDB(): Cypress.Chainable<string>,
75-
76-
/**
77-
* Restore a snapshot of the database
78-
* Default is the post-setup state
79-
*/
80-
restoreDB(snapshot?: string): Cypress.Chainable
81-
82-
backupData(users?: string[]): Cypress.Chainable<string>
83-
84-
restoreData(snapshot?: string): Cypress.Chainable
85-
}
86-
}
87-
}
88-
8916
const url = (Cypress.config('baseUrl') || '').replace(/\/index.php\/?$/g, '')
9017
Cypress.env('baseUrl', url)
9118

cypress/support/component.ts

+10-21
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
* SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors
33
* SPDX-License-Identifier: AGPL-3.0-or-later
44
*/
5+
6+
import '@testing-library/cypress/add-commands'
57
import 'cypress-axe'
68

79
// styles
@@ -11,29 +13,16 @@ import '../../core/css/server.css'
1113
/* eslint-disable */
1214
import { mount } from '@cypress/vue2'
1315

14-
// Example use:
15-
// cy.mount(MyComponent)
16-
Cypress.Commands.add('mount', (component, optionsOrProps) => {
17-
let instance = null
18-
const oldMounted = component?.mounted || false
19-
20-
// Override the mounted method to expose
21-
// the component instance to cypress
22-
component.mounted = function() {
23-
// eslint-disable-next-line
24-
instance = this
25-
if (oldMounted) {
26-
oldMounted.call(instance)
27-
}
28-
}
16+
Cypress.Commands.add('mount', (component, options = {}) => {
17+
// Setup options object
18+
options.extensions = options.extensions || {}
19+
options.extensions.plugins = options.extensions.plugins || []
20+
options.extensions.components = options.extensions.components || {}
2921

30-
// Expose the component with cy.get('@component')
31-
return mount(component, optionsOrProps).then(() => {
32-
return cy.wrap(instance).as('component')
33-
})
22+
return mount(component, options)
3423
})
3524

36-
Cypress.Commands.add('mockInitialState', (app: string, key: string, value: any) => {
25+
Cypress.Commands.add('mockInitialState', (app: string, key: string, value: unknown) => {
3726
cy.document().then(($document) => {
3827
const input = $document.createElement('input')
3928
input.setAttribute('type', 'hidden')
@@ -48,4 +37,4 @@ Cypress.Commands.add('unmockInitialState', (app?: string, key?: string) => {
4837
$document.querySelectorAll('body > input[type="hidden"]' + (app ? `[id="initial-state-${app}-${key}"]` : ''))
4938
.forEach((node) => $document.body.removeChild(node))
5039
})
51-
})
40+
})
+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
/*!
2+
* SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
3+
* SPDX-License-Identifier: AGPL-3.0-or-later
4+
*/
5+
6+
import type { mount } from '@cypress/vue2'
7+
8+
declare global {
9+
// eslint-disable-next-line @typescript-eslint/no-namespace
10+
namespace Cypress {
11+
interface Chainable {
12+
mount: typeof mount
13+
mockInitialState: (app: string, key: string, value: unknown) => Cypress.Chainable<void>
14+
unmockInitialState: (app?: string, key?: string) => Cypress.Chainable<void>
15+
}
16+
}
17+
}

cypress/support/cypress-e2e.d.ts

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
/*!
2+
* SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
3+
* SPDX-License-Identifier: AGPL-3.0-or-later
4+
*/
5+
6+
// eslint-disable-next-line n/no-extraneous-import
7+
import type { AxiosResponse } from 'axios'
8+
9+
declare global {
10+
// eslint-disable-next-line @typescript-eslint/no-namespace
11+
namespace Cypress {
12+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
13+
interface Chainable<Subject = any> {
14+
/**
15+
* Enable or disable a given user
16+
*/
17+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
18+
enableUser(user: User, enable?: boolean): Cypress.Chainable<Cypress.Response<any>>,
19+
20+
/**
21+
* Upload a file from the fixtures folder to a given user storage.
22+
* **Warning**: Using this function will reset the previous session
23+
*/
24+
uploadFile(user: User, fixture?: string, mimeType?: string, target?: string): Cypress.Chainable<void>,
25+
26+
/**
27+
* Upload a raw content to a given user storage.
28+
* **Warning**: Using this function will reset the previous session
29+
*/
30+
uploadContent(user: User, content: Blob, mimeType: string, target: string, mtime?: number): Cypress.Chainable<AxiosResponse>,
31+
32+
/**
33+
* Create a new directory
34+
* **Warning**: Using this function will reset the previous session
35+
*/
36+
mkdir(user: User, target: string): Cypress.Chainable<void>,
37+
38+
/**
39+
* Set a file as favorite (or remove from favorite)
40+
*/
41+
setFileAsFavorite(user: User, target: string, favorite?: boolean): Cypress.Chainable<void>,
42+
43+
/**
44+
* Reset the admin theming entirely.
45+
* **Warning**: Using this function will reset the previous session
46+
*/
47+
resetAdminTheming(): Cypress.Chainable<void>,
48+
49+
/**
50+
* Reset the user theming settings.
51+
* If provided, will clear session and login as the given user.
52+
* **Warning**: Providing a user will reset the previous session.
53+
*/
54+
resetUserTheming(user?: User): Cypress.Chainable<void>,
55+
56+
/**
57+
* Run an occ command in the docker container.
58+
*/
59+
runOccCommand(command: string, options?: Partial<Cypress.ExecOptions>): Cypress.Chainable<Cypress.Exec>,
60+
61+
userFileExists(user: string, path: string): Cypress.Chainable<number>
62+
63+
/**
64+
* Create a snapshot of the current database
65+
*/
66+
backupDB(): Cypress.Chainable<string>,
67+
68+
/**
69+
* Restore a snapshot of the database
70+
* Default is the post-setup state
71+
*/
72+
restoreDB(snapshot?: string): Cypress.Chainable
73+
74+
backupData(users?: string[]): Cypress.Chainable<string>
75+
76+
restoreData(snapshot?: string): Cypress.Chainable
77+
}
78+
}
79+
}

cypress/tsconfig.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"extends": "../tsconfig.json",
3-
"include": ["./**/*.ts"],
3+
"include": ["./**/*.ts", "../**/*.cy.ts", "./cypress-e2e.d.ts", "./cypress-component.d.ts"],
4+
"exclude": [],
45
"compilerOptions": {
56
"types": [
67
"@testing-library/cypress",

tsconfig.json

+1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"extends": "@vue/tsconfig/tsconfig.json",
33
"include": ["./apps/**/*.ts", "./apps/**/*.vue", "./core/**/*.ts", "./core/**/*.vue", "./*.d.ts"],
4+
"exclude": ["./**/*.cy.ts"],
45
"compilerOptions": {
56
"types": ["node", "vue", "vue-router"],
67
"outDir": "./dist/",

0 commit comments

Comments
 (0)