From 526b6508b93c9f53c6a875a238fd9d0b38456e5c Mon Sep 17 00:00:00 2001
From: Shu Ding <g@shud.in>
Date: Mon, 16 May 2022 18:00:03 +0200
Subject: [PATCH] chore: Add test cases for mutate (#1976)

add test cases
---
 test/type/mutator.ts                 | 13 ++++++++++
 test/use-swr-local-mutation.test.tsx | 39 +++++++++++++++++++++++++---
 2 files changed, 48 insertions(+), 4 deletions(-)

diff --git a/test/type/mutator.ts b/test/type/mutator.ts
index a75115112..2243f7bf6 100644
--- a/test/type/mutator.ts
+++ b/test/type/mutator.ts
@@ -1,4 +1,5 @@
 import { Equal, Expect } from '@type-challenges/utils'
+import useSWR from 'swr'
 
 import {
   MutatorFn,
@@ -54,3 +55,15 @@ export type TestCasesForMutator = [
   Expect<Equal<MutatorWrapper<Case5<{}>>, never>>,
   Expect<Equal<MutatorWrapper<Case6<{}>>, Promise<{} | undefined>>>
 ]
+
+export function useMutatorTypes() {
+  const { mutate } = useSWR<string>('')
+
+  mutate(async () => '1')
+
+  // @ts-expect-error
+  mutate(async () => 1)
+
+  // FIXME: this should work.
+  // mutate(async () => 1, { populateCache: false })
+}
diff --git a/test/use-swr-local-mutation.test.tsx b/test/use-swr-local-mutation.test.tsx
index c149081f8..2a11671f6 100644
--- a/test/use-swr-local-mutation.test.tsx
+++ b/test/use-swr-local-mutation.test.tsx
@@ -1039,7 +1039,7 @@ describe('useSWR - local mutation', () => {
     expect(renderedData).toEqual([undefined, 'foo', 'bar', 'baz', 'foo'])
   })
 
-  it('should support optimistic updates via functional `optimisticData`', async () => {
+  it('should support optimistic updates via function `optimisticData`', async () => {
     const key = createKey()
     const renderedData = []
     let mutate
@@ -1058,20 +1058,20 @@ describe('useSWR - local mutation', () => {
 
     await executeWithoutBatching(() =>
       mutate(createResponse('baz', { delay: 20 }), {
-        optimisticData: data => 'functional_' + data
+        optimisticData: data => 'function_' + data
       })
     )
     await sleep(30)
     expect(renderedData).toEqual([
       undefined,
       'foo',
-      'functional_foo',
+      'function_foo',
       'baz',
       'foo'
     ])
   })
 
-  it('should be able use mutate to manipulate data via functional `optimisticData`', async () => {
+  it('should be able use mutate to manipulate data via function `optimisticData`', async () => {
     const key = createKey()
     const renderedData = []
 
@@ -1105,6 +1105,37 @@ describe('useSWR - local mutation', () => {
     expect(renderedData).toEqual([undefined, 'loading', 'final'])
   })
 
+  it('should prevent race conditions with optimistic UI', async () => {
+    const key = createKey()
+    const renderedData = []
+    let mutate
+
+    function Page() {
+      const { data, mutate: boundMutate } = useSWR(key, () => Math.random(), {
+        refreshInterval: 10,
+        dedupingInterval: 0
+      })
+      mutate = boundMutate
+      renderedData.push(data)
+      return <div>data: {String(data)}</div>
+    }
+
+    renderWithConfig(<Page />)
+
+    await sleep(20)
+    await executeWithoutBatching(() =>
+      mutate(createResponse('end', { delay: 50 }), {
+        optimisticData: 'start'
+      })
+    )
+    await sleep(20)
+
+    // There can never be any changes during a mutation — it should be atomic.
+    expect(renderedData.indexOf('end') - renderedData.indexOf('start')).toEqual(
+      1
+    )
+  })
+
   it('should rollback optimistic updates when mutation fails', async () => {
     const key = createKey()
     const renderedData = []