[web] Update fetch-mock to version 12 (#24837)

* Update fetch-mock to version 12

* Replace `fetchMock.done` by `fetchMock.callHistory.done`

* Replace `…Mock.called` by `…Mock.callHistory.called`

* Replace `fetchMock.reset` by `fetchMock.hardReset`

* Replace `fetchMock.restore` by `fetchMock.hardReset`

* Replace `fetchMock.resetHistory` by `fetchMock.clearHistory`

* Replace `fetchMock.calls` by `fetchMock.callHistory.calls`

* Replace `fetchMock.flush` by `fetchMock.callHistory.flush`

* Update tests for fetch-mock version 12

See https://www.wheresrhys.co.uk/fetch-mock/docs/Usage/upgrade-guide

* Update stories for fetch-mock version 12

* Remove `overwriteRoutes` option

* Add `fetchMock.spyGlobal()` to storybook

* Remove deprecated `sendAsJson` param

* Replace `fetchMock.hardReset()` by `fetchMock.removeRoutes().clearHistory()`

* Fixup fetch-mock in storybook:

Call `mockGlobal` inside the hook, call `removeRoutes` and `unmockGlobal` on cleanup

Behaviour can be tested by navigating between

https://storybook.dev-overleaf.com/main/?path=/story/editor-ai-error-assistant-compile-log-entries--first-log-entry
https://storybook.dev-overleaf.com/main/?path=/story/editor-ai-error-assistant-compile-log-entries--rate-limited

https://storybook.dev-overleaf.com/main/?path=/story/project-list-notifications--project-invite
https://storybook.dev-overleaf.com/main/?path=/story/project-list-notifications--project-invite-network-error

And clicking the buttons

GitOrigin-RevId: 35611b4430259e4c21c3d819ad18b2e6dab66242
This commit is contained in:
Antoine Clausse
2025-04-17 08:06:24 +00:00
committed by Copybot
parent fa62529d82
commit b901bb6c75
99 changed files with 728 additions and 729 deletions
@@ -35,7 +35,7 @@ describe('SSOContext', function () {
google: 'google-id',
})
window.metaAttributesCache.set('ol-oauthProviders', mockOauthProviders)
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
})
it('should initialise subscriptions with their linked status', function () {
@@ -69,13 +69,13 @@ describe('SSOContext', function () {
it('when the provider is not linked, should do nothing', function () {
const { result } = renderSSOContext()
result.current.unlink('orcid')
expect(fetchMock.called()).to.be.false
expect(fetchMock.callHistory.called()).to.be.false
})
it('supports unmounting the component while the request is inflight', async function () {
const { result, unmount } = renderSSOContext()
result.current.unlink('google')
expect(fetchMock.called()).to.be.true
expect(fetchMock.callHistory.called()).to.be.true
unmount()
})
})
@@ -1,6 +1,8 @@
import { expect } from 'chai'
import { cloneDeep } from 'lodash'
import { renderHook } from '@testing-library/react-hooks'
import { waitFor } from '@testing-library/react'
import {
EmailContextType,
UserEmailsProvider,
@@ -26,7 +28,7 @@ const renderUserEmailsContext = () =>
describe('UserEmailContext', function () {
beforeEach(function () {
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
})
describe('context bootstrap', function () {
@@ -49,8 +51,8 @@ describe('UserEmailContext', function () {
it('should load all user emails and update the initialisation state to "success"', async function () {
fetchMock.get(/\/user\/emails/, fakeUsersData)
const { result } = renderUserEmailsContext()
await fetchMock.flush(true)
expect(fetchMock.calls()).to.have.lengthOf(1)
await fetchMock.callHistory.flush(true)
expect(fetchMock.callHistory.calls()).to.have.lengthOf(1)
expect(result.current.state.data.byId).to.deep.equal({
'bar@overleaf.com': { ...untrustedUserData, ...confirmedUserData },
'baz@overleaf.com': unconfirmedUserData,
@@ -66,10 +68,12 @@ describe('UserEmailContext', function () {
it('when loading user email fails, it should update the initialisation state to "failed"', async function () {
fetchMock.get(/\/user\/emails/, 500)
const { result } = renderUserEmailsContext()
await fetchMock.flush()
await fetchMock.callHistory.flush()
expect(result.current.isInitializing).to.equal(false)
expect(result.current.isInitializingError).to.equal(true)
await waitFor(() => {
expect(result.current.isInitializing).to.equal(false)
expect(result.current.isInitializingError).to.equal(true)
})
})
describe('state.isLoading', function () {
@@ -94,12 +98,12 @@ describe('UserEmailContext', function () {
fetchMock.get(/\/user\/emails/, fakeUsersData)
const value = renderUserEmailsContext()
result = value.result
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
})
describe('getEmails()', function () {
beforeEach(async function () {
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
})
it('should set `isLoading === true`', function () {
@@ -120,7 +124,7 @@ describe('UserEmailContext', function () {
}
fetchMock.get(/\/user\/emails/, [emailData])
result.current.getEmails()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
expect(result.current.state.data.byId).to.deep.equal({
'new@email.com': emailData,
})
@@ -133,7 +137,7 @@ describe('UserEmailContext', function () {
{ ...professionalUserData, samlProviderId: 'saml_provider_2' },
])
const { result } = renderUserEmailsContext()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
expect(result.current.state.data.linkedInstitutionIds).to.deep.equal([
'saml_provider_1',
'saml_provider_2',
@@ -257,11 +261,11 @@ describe('UserEmailContext', function () {
const affiliatedEmail2 = cloneDeep(professionalUserData)
affiliatedEmail2.emailHasInstitutionLicence = true
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
fetchMock.get(/\/user\/emails/, [affiliatedEmail1, affiliatedEmail2])
result.current.getEmails()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
// `resetLeaversSurveyExpiration` always happens after deletion
result.current.deleteEmail(affiliatedEmail1.email)
@@ -281,11 +285,11 @@ describe('UserEmailContext', function () {
const affiliatedEmail2 = cloneDeep(professionalUserData)
affiliatedEmail2.emailHasInstitutionLicence = true
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
fetchMock.get(/\/user\/emails/, [affiliatedEmail1, affiliatedEmail2])
result.current.getEmails()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
// `resetLeaversSurveyExpiration` always happens after deletion
result.current.deleteEmail(affiliatedEmail1.email)
@@ -303,11 +307,11 @@ describe('UserEmailContext', function () {
affiliatedEmail1.email = 'institution-test@example.com'
affiliatedEmail1.affiliation.pastReconfirmDate = true
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
fetchMock.get(/\/user\/emails/, [confirmedUserData, affiliatedEmail1])
result.current.getEmails()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
// `resetLeaversSurveyExpiration` always happens after deletion
result.current.deleteEmail(affiliatedEmail1.email)
@@ -323,11 +327,11 @@ describe('UserEmailContext', function () {
emailWithInstitutionLicense.email = 'institution-licensed@example.com'
emailWithInstitutionLicense.emailHasInstitutionLicence = false
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
fetchMock.get(/\/user\/emails/, [emailWithInstitutionLicense])
result.current.getEmails()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
// `resetLeaversSurveyExpiration` always happens after deletion
result.current.deleteEmail(emailWithInstitutionLicense.email)
@@ -342,11 +346,11 @@ describe('UserEmailContext', function () {
emailWithInstitutionLicense.email = 'institution-licensed@example.com'
emailWithInstitutionLicense.affiliation.pastReconfirmDate = false
fetchMock.reset()
fetchMock.removeRoutes().clearHistory()
fetchMock.get(/\/user\/emails/, [emailWithInstitutionLicense])
result.current.getEmails()
await fetchMock.flush(true)
await fetchMock.callHistory.flush(true)
// `resetLeaversSurveyExpiration` always happens after deletion
result.current.deleteEmail(emailWithInstitutionLicense.email)