diff --git a/services/web/cypress/support/shared/commands/compile.ts b/services/web/cypress/support/shared/commands/compile.ts index e4cd94d3a6..cbd9972414 100644 --- a/services/web/cypress/support/shared/commands/compile.ts +++ b/services/web/cypress/support/shared/commands/compile.ts @@ -45,7 +45,7 @@ const outputFiles = () => { export const interceptCompile = (prefix = 'compile', times = 1) => { cy.intercept( - { method: 'POST', url: '/project/*/compile*', times }, + { method: 'POST', pathname: '/project/*/compile', times }, { body: { status: 'success', @@ -58,17 +58,17 @@ export const interceptCompile = (prefix = 'compile', times = 1) => { ).as(`${prefix}`) cy.intercept( - { url: '/build/*/output.pdf*', times }, + { pathname: '/build/*/output.pdf', times }, { fixture: 'build/output.pdf,null' } ).as(`${prefix}-pdf`) cy.intercept( - { url: '/build/*/output.log*', times }, + { pathname: '/build/*/output.log', times }, { fixture: 'build/output.log' } ).as(`${prefix}-log`) cy.intercept( - { url: '/build/*/output.blg*', times }, + { pathname: '/build/*/output.blg', times }, { fixture: 'build/output.blg' } ).as(`${prefix}-blg`) } @@ -134,17 +134,17 @@ export const interceptDeferredCompile = (beforeResponse?: () => void) => { ).as('compile') cy.intercept( - { url: '/build/*/output.pdf*', times: 1 }, + { pathname: '/build/*/output.pdf', times: 1 }, { fixture: 'build/output.pdf,null' } ).as(`compile-pdf`) cy.intercept( - { url: '/build/*/output.log*', times: 1 }, + { pathname: '/build/*/output.log', times: 1 }, { fixture: 'build/output.log' } ).as(`compile-log`) cy.intercept( - { url: '/build/*/output.blg*', times: 1 }, + { pathname: '/build/*/output.blg', times: 1 }, { fixture: 'build/output.blg' } ).as(`compile-blg`) diff --git a/services/web/cypress/support/shared/commands/index.ts b/services/web/cypress/support/shared/commands/index.ts index 5f611bd61a..a75aa1afbb 100644 --- a/services/web/cypress/support/shared/commands/index.ts +++ b/services/web/cypress/support/shared/commands/index.ts @@ -6,6 +6,7 @@ import { } from './compile' import { interceptEvents } from './events' import { interceptSpelling } from './spelling' +import { interceptAsync } from './intercept-async' // eslint-disable-next-line no-unused-vars,@typescript-eslint/no-namespace declare global { @@ -13,6 +14,7 @@ declare global { namespace Cypress { // eslint-disable-next-line no-unused-vars interface Chainable { + interceptAsync: typeof interceptAsync interceptCompile: typeof interceptCompile interceptEvents: typeof interceptEvents interceptSpelling: typeof interceptSpelling @@ -23,6 +25,7 @@ declare global { } } +Cypress.Commands.add('interceptAsync', interceptAsync) Cypress.Commands.add('interceptCompile', interceptCompile) Cypress.Commands.add('interceptEvents', interceptEvents) Cypress.Commands.add('interceptSpelling', interceptSpelling) diff --git a/services/web/cypress/support/shared/commands/intercept-async.ts b/services/web/cypress/support/shared/commands/intercept-async.ts new file mode 100644 index 0000000000..447832efc9 --- /dev/null +++ b/services/web/cypress/support/shared/commands/intercept-async.ts @@ -0,0 +1,17 @@ +import { RouteHandler, RouteMatcher } from 'cypress/types/net-stubbing' + +export const interceptAsync = (route: RouteMatcher, alias: string) => { + const deferred: { resolve: (value: RouteHandler) => void } = { + resolve: () => {}, + } + + const promise = new Promise(resolve => { + deferred.resolve = resolve + }) + + cy.intercept(route, req => { + return promise.then(response => req.reply(response)) + }).as(alias) + + return cy.wrap(deferred) +} diff --git a/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx b/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx index eb8b469144..c8bf6ea801 100644 --- a/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx +++ b/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx @@ -76,60 +76,10 @@ const WithSelectedEntities = ({ return null } -const interceptSyncCodeAsync = () => { - const deferred: { resolve: () => void } = { - resolve: () => { - // do nothing - }, - } - - cy.intercept('/project/*/sync/code?*', req => { - return new Promise(resolve => { - deferred.resolve = () => { - req.reply({ - body: { pdf: cloneDeep(mockHighlights) }, - }) - resolve() - } - }) - }).as('sync-code') - - return deferred -} - -const interceptSyncPdfAsync = () => { - const output: { resolve: () => void } = { - resolve: () => { - // do nothing - }, - } - - cy.intercept('/project/*/sync/pdf?*', req => { - return new Promise(resolve => { - output.resolve = () => { - req.reply({ - body: { code: [{ file: 'main.tex', line: 100 }] }, - delay: 1, - }) - resolve() - } - }) - }).as('sync-pdf') - - return output -} - -const interceptSyncPdf = () => { - cy.intercept('/project/*/sync/pdf?*', req => { - req.reply({ - body: { code: [{ file: 'main.tex', line: 100 }] }, - }) - }).as('sync-pdf') -} - describe('', function () { beforeEach(function () { window.metaAttributesCache = new Map() + window.metaAttributesCache.set('ol-project_id', 'test-project') window.metaAttributesCache.set('ol-preventCompileOnLoad', false) cy.interceptEvents() }) @@ -168,27 +118,35 @@ describe('', function () { setDetachedPosition(mockPosition) }) - const syncCode = interceptSyncCodeAsync() + cy.interceptAsync({ pathname: '/project/*/sync/code' }, 'sync-code').then( + syncCodeResponse => { + cy.findByRole('button', { name: 'Go to code location in PDF' }).click() + cy.findByRole('button', { name: 'Go to code location in PDF' }) + .should('be.disabled') + .then(() => { + syncCodeResponse.resolve({ + body: { pdf: cloneDeep(mockHighlights) }, + }) + }) - cy.findByRole('button', { name: 'Go to code location in PDF' }).click() - cy.findByRole('button', { name: 'Go to code location in PDF' }) - .should('be.disabled') - .then(() => { - syncCode.resolve() - }) + cy.wait('@sync-code') + } + ) - cy.wait('@sync-code') + cy.interceptAsync({ pathname: '/project/*/sync/pdf' }, 'sync-pdf').then( + syncPdfResponse => { + cy.findByRole('button', { name: /^Go to PDF location in code/ }).click() + cy.findByRole('button', { name: /^Go to PDF location in code/ }) + .should('be.disabled') + .then(() => { + syncPdfResponse.resolve({ + body: { code: [{ file: 'main.tex', line: 100 }] }, + }) + }) - const syncPdf = interceptSyncPdfAsync() - - cy.findByRole('button', { name: /^Go to PDF location in code/ }).click() - cy.findByRole('button', { name: /^Go to PDF location in code/ }) - .should('be.disabled') - .then(() => { - syncPdf.resolve() - }) - - cy.wait('@sync-pdf') + cy.wait('@sync-pdf') + } + ) }) it('disables button when multiple entities are selected', function () { @@ -286,23 +244,27 @@ describe('', function () { cy.spy(detachChannel, 'postMessage').as('postDetachMessage') - const syncing = interceptSyncCodeAsync() + cy.interceptAsync({ pathname: '/project/*/sync/code' }, 'sync-code').then( + syncCodeResponse => { + cy.findByRole('button', { + name: 'Go to code location in PDF', + }) + .should('not.be.disabled') + .click() - cy.findByRole('button', { - name: 'Go to code location in PDF', - }) - .should('not.be.disabled') - .click() + cy.findByRole('button', { + name: 'Go to code location in PDF', + }) + .should('be.disabled') + .then(() => { + syncCodeResponse.resolve({ + body: { pdf: cloneDeep(mockHighlights) }, + }) + }) - cy.findByRole('button', { - name: 'Go to code location in PDF', - }) - .should('be.disabled') - .then(() => { - syncing.resolve() - }) - - cy.wait('@sync-code') + cy.wait('@sync-code') + } + ) cy.findByRole('button', { name: 'Go to code location in PDF', @@ -319,7 +281,6 @@ describe('', function () { it('reacts to sync to code action', function () { cy.interceptCompile() - interceptSyncPdf() const scope = mockScope() @@ -331,17 +292,23 @@ describe('', function () { ) - cy.waitForCompile().then(() => { - testDetachChannel.postMessage({ - role: 'detached', - event: 'action-sync-to-code', - data: { - args: [mockPosition], - }, - }) - }) + cy.waitForCompile() - cy.wait('@sync-pdf') + cy.interceptAsync({ pathname: '/project/*/sync/pdf' }, 'sync-pdf') + .then(syncPdfResponse => { + syncPdfResponse.resolve({ + body: { code: [{ file: 'main.tex', line: 100 }] }, + }) + + testDetachChannel.postMessage({ + role: 'detached', + event: 'action-sync-to-code', + data: { + args: [mockPosition], + }, + }) + }) + .wait('@sync-pdf') }) })