fix(cypress): Really mock the initial state instead of trying to stub a module

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

diff --git a/apps/files/src/views/Navigation.cy.ts b/apps/files/src/views/Navigation.cy.ts
index 65964832e8a1d3595bcc335badb85fa52abeb70f..8678465841a853927276e13146134a3a4509d0f7 100644 (file)
--- a/apps/files/src/views/Navigation.cy.ts
+++ b/apps/files/src/views/Navigation.cy.ts
@@ -1,5 +1,3 @@
-import * as InitialState from '@nextcloud/initial-state'
-import * as L10n from '@nextcloud/l10n'
 import FolderSvg from '@mdi/svg/svg/folder.svg'
 import ShareSvg from '@mdi/svg/svg/share-variant.svg'
 import { createTestingPinia } from '@pinia/testing'
@@ -13,13 +11,14 @@ describe('Navigation renders', () => {
        const Navigation = new NavigationService() as NavigationService
 
        before(() => {
-               cy.stub(InitialState, 'loadState')
-                       .returns({
-                               used: 1000 * 1000 * 1000,
-                               quota: -1,
-                       })
+               cy.mockInitialState('files', 'storageStats', {
+                       used: 1000 * 1000 * 1000,
+                       quota: -1,
+               })
        })
 
+       after(() => cy.unmockInitialState())
+
        it('renders', () => {
                cy.mount(NavigationView, {
                        propsData: {
@@ -157,22 +156,9 @@ describe('Navigation API', () => {
 describe('Quota rendering', () => {
        const Navigation = new NavigationService()
 
-       beforeEach(() => {
-               // TODO: remove when @nextcloud/l10n 2.0 is released
-               // https://github.com/nextcloud/nextcloud-l10n/pull/542
-               cy.stub(L10n, 'translate', (app, text, vars = {}, number) => {
-                       cy.log({ app, text, vars, number })
-                       return text.replace(/%n/g, '' + number).replace(/{([^{}]*)}/g, (match, key) => {
-                               return vars[key]
-                       })
-               })
-       })
+       afterEach(() => cy.unmockInitialState())
 
        it('Unknown quota', () => {
-               cy.stub(InitialState, 'loadState')
-                       .as('loadStateStats')
-                       .returns(undefined)
-
                cy.mount(NavigationView, {
                        propsData: {
                                Navigation,
@@ -188,12 +174,10 @@ describe('Quota rendering', () => {
        })
 
        it('Unlimited quota', () => {
-               cy.stub(InitialState, 'loadState')
-                       .as('loadStateStats')
-                       .returns({
-                               used: 1000 * 1000 * 1000,
-                               quota: -1,
-                       })
+               cy.mockInitialState('files', 'storageStats', {
+                       used: 1000 * 1000 * 1000,
+                       quota: -1,
+               })
 
                cy.mount(NavigationView, {
                        propsData: {
@@ -212,13 +196,11 @@ describe('Quota rendering', () => {
        })
 
        it('Non-reached quota', () => {
-               cy.stub(InitialState, 'loadState')
-                       .as('loadStateStats')
-                       .returns({
-                               used: 1000 * 1000 * 1000,
-                               quota: 5 * 1000 * 1000 * 1000,
-                               relative: 20, // percent
-                       })
+               cy.mockInitialState('files', 'storageStats', {
+                       used: 1000 * 1000 * 1000,
+                       quota: 5 * 1000 * 1000 * 1000,
+                       relative: 20, // percent
+               })
 
                cy.mount(NavigationView, {
                        propsData: {
@@ -238,13 +220,11 @@ describe('Quota rendering', () => {
        })
 
        it('Reached quota', () => {
-               cy.stub(InitialState, 'loadState')
-                       .as('loadStateStats')
-                       .returns({
-                               used: 5 * 1000 * 1000 * 1000,
-                               quota: 1000 * 1000 * 1000,
-                               relative: 500, // percent
-                       })
+               cy.mockInitialState('files', 'storageStats', {
+                       used: 5 * 1000 * 1000 * 1000,
+                       quota: 1000 * 1000 * 1000,
+                       relative: 500, // percent
+               })
 
                cy.mount(NavigationView, {
                        propsData: {

diff --git a/cypress.d.ts b/cypress.d.ts
index 7283e5819abaa21bda373300cba2fa59b4e149ab..7dc9a3bde23ef344ad3f92c61090e0c29e9632bd 100644 (file)
--- a/cypress.d.ts
+++ b/cypress.d.ts
@@ -29,6 +29,21 @@ declare global {
        namespace Cypress {
                interface Chainable {
                        mount: typeof mount;
+                       /**
+                        * Mock an initial state for component testing
+                        *
+                        * @param app App name of the initial state
+                        * @param key Key of the initial state
+                        * @param value The mocked value of the initial state
+                        */
+                       mockInitialState: (app: string, key: string, value: any) => void
+                       /**
+                        * Unmock all initial states or one defined by app and key
+                        *
+                        * @param app app name of the inital state
+                        * @param key the key of the the initial state
+                        */
+                       unmockInitialState: (app?: string, key?: string) => void
                }
        }
 }

diff --git a/cypress/support/component.ts b/cypress/support/component.ts
index 3769caed46bdb7173c1907bd63723243d4f63740..b1e0a1b2c0f82c8a33c3cf1e3193fb49286b10d6 100644 (file)
--- a/cypress/support/component.ts
+++ b/cypress/support/component.ts
@@ -43,3 +43,20 @@ Cypress.Commands.add('mount', (component, optionsOrProps) => {
                return cy.wrap(instance).as('component')
        })
 })
+
+Cypress.Commands.add('mockInitialState', (app: string, key: string, value: any) => {
+       cy.document().then(($document) => {
+               const input = $document.createElement('input')
+               input.setAttribute('type', 'hidden')
+               input.setAttribute('id', `initial-state-${app}-${key}`)
+               input.setAttribute('value', btoa(JSON.stringify(value)))
+               $document.body.appendChild(input)
+       })
+})
+
+Cypress.Commands.add('unmockInitialState', (app?: string, key?: string) => {
+       cy.document().then(($document) => {
+               $document.querySelectorAll('body > input[type="hidden"]' + (app ? `[id="initial-state-${app}-${key}"]` : ''))
+                       .forEach((node) => $document.body.removeChild(node))
+       })
+})
\ No newline at end of file