[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
2026-11-15 14:43:46 +01:00 · 2025-04-17 08:06:24 +00:00
parent fa62529d82
commit b901bb6c75
99 changed files with 728 additions and 729 deletions
@@ -51,7 +51,7 @@ describe('<GroupSubscriptionMemberships />', function () {
  })

  afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
  })

  it('renders all group subscriptions not managed', function () {
@@ -129,7 +129,7 @@ describe('<GroupSubscriptionMemberships />', function () {

      fireEvent.click(this.leaveNowButton)

-      expect(leaveGroupApiMock.called()).to.be.true
+      expect(leaveGroupApiMock.callHistory.called()).to.be.true
      await waitFor(() => {
        expect(reloadStub).to.have.been.called
      })
@@ -37,7 +37,7 @@ describe('<ManagedInstitutions />', function () {
  })

  afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
  })

  it('renders all managed institutions', function () {
@@ -98,7 +98,9 @@ describe('<ManagedInstitutions />', function () {

    const unsubscribeLink = screen.getByText('Unsubscribe')
    await fireEvent.click(unsubscribeLink)
-    await waitFor(() => expect(fetchMock.called(unsubscribeUrl)).to.be.true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called(unsubscribeUrl)).to.be.true
+    )

    await waitFor(() => {
      expect(screen.getByText('Subscribe')).to.exist
@@ -122,13 +124,14 @@ describe('<ManagedInstitutions />', function () {
      </SplitTestProvider>
    )

-    const subscribeLink = screen.getByText('Subscribe')
-    await fireEvent.click(subscribeLink)
-    await waitFor(() => expect(fetchMock.called(subscribeUrl)).to.be.true)
+    const subscribeLink = await screen.findByText('Subscribe')

-    await waitFor(() => {
-      expect(screen.getByText('Unsubscribe')).to.exist
-    })
+    await fireEvent.click(subscribeLink)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called(subscribeUrl)).to.be.true
+    )
+
+    await screen.findByText('Unsubscribe')
  })

  it('renders nothing when there are no institutions', function () {
@@ -28,7 +28,7 @@ describe('<ManagedPublishers />', function () {
  })

  afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
  })

  it('renders all managed publishers', function () {
@@ -59,7 +59,7 @@ describe('<PauseSubscriptionModal />', function () {
  })

  afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
    this.locationStub.restore()
    this.replaceStateStub.restore()
  })
@@ -106,18 +106,18 @@ describe('<PersonalSubscription />', function () {
      fetchMock.postOnce(reactivateSubscriptionUrl, 400)
      fireEvent.click(reactivateBtn)
      expect(reactivateBtn.disabled).to.be.true
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
      expect(reactivateBtn.disabled).to.be.false
      expect(reloadStub).not.to.have.been.called
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()

      // 2nd click - success
      fetchMock.postOnce(reactivateSubscriptionUrl, 200)
      fireEvent.click(reactivateBtn)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
      expect(reloadStub).to.have.been.calledOnce
      expect(reactivateBtn.disabled).to.be.true
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
    })

    it('renders the expired dash', function () {
@@ -208,7 +208,7 @@ describe('<ActiveSubscription />', function () {

    afterEach(function () {
      this.locationStub.restore()
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
    })

    function showConfirmCancelUI() {
@@ -38,7 +38,7 @@ describe('<ChangePlanModal />', function () {

  afterEach(function () {
    cleanUpContext()
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
    this.locationStub.restore()
  })

@@ -7,7 +7,7 @@ import fetchMock from 'fetch-mock'
 describe('group invite', function () {
  describe('user has a personal subscription', function () {
    afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
    })

    it('shows option to cancel subscription', async function () {
@@ -10,7 +10,7 @@ describe('join group', function () {
    window.metaAttributesCache.set('ol-inviteToken', inviteToken)
  })
  afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
  })

  it('shows option to join subscription', async function () {