Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
51 changes: 51 additions & 0 deletions packages/toolkit/src/query/tests/buildHooks.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -1906,6 +1906,57 @@ describe('hooks tests', () => {
await screen.findByText(/isUninitialized/i)
expect(countObjectKeys(storeRef.store.getState().api.queries)).toBe(0)
})

// Regression test for issue #5271: useLazyQuery isFetching stays false when trigger args contain undefined values
test('useLazyQuery updates isFetching when trigger args contain undefined values', async () => {
const user = userEvent.setup()

function User() {
const [getUser, { isFetching, data, isSuccess }] =
api.endpoints.getUser.useLazyQuery()

return (
<div>
<div data-testid="isFetching">{String(isFetching)}</div>
<div data-testid="data">{data ? JSON.stringify(data) : 'no data'}</div>
<button onClick={() => getUser({ filterId: '1' })}>
Load Filtered
</button>
<button onClick={() => getUser({ triggeredAddress: undefined, page: 1 })}>
Load Full List
</button>
</div>
)
}

render(<User />, { wrapper: storeRef.wrapper })

// First call with { filterId: '1' }
await user.click(screen.getByRole('button', { name: 'Load Filtered' }))
await waitFor(() =>
expect(screen.getByTestId('isFetching').textContent).toBe('true'),
)
await waitFor(() =>
expect(screen.getByTestId('isFetching').textContent).toBe('false'),
)
await waitFor(() =>
expect(screen.getByTestId('data').textContent).toContain('Alice'),
)

// Second call with { triggeredAddress: undefined, page: 1 }
// This should also update isFetching and data (issue #5271)
await user.click(screen.getByRole('button', { name: 'Load Full List' }))
await waitFor(() =>
expect(screen.getByTestId('isFetching').textContent).toBe('true'),
)
await waitFor(() =>
expect(screen.getByTestId('isFetching').textContent).toBe('false'),
)
// Data should update - if the bug exists, this would still show Alice
await waitFor(() =>
expect(screen.getByTestId('data').textContent).toContain('Alice'),
)
})
})

describe('useInfiniteQuery', () => {
Expand Down
31 changes: 31 additions & 0 deletions packages/toolkit/src/query/tests/copyWithStructuralSharing.test.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,36 @@
import { copyWithStructuralSharing } from '@reduxjs/toolkit/query'

// Test for preserving keys with undefined values (issue #5271)
test('preserves keys with undefined values', () => {
const objA = { page: 1 }
const objB = { triggeredAddress: undefined, page: 1 }

// These should be treated as different objects
const newCopy = copyWithStructuralSharing(objA, objB)
expect(newCopy).not.toBe(objA)
expect(newCopy).toStrictEqual(objB)
expect(Object.getOwnPropertyNames(newCopy)).toContain('triggeredAddress')
})

test('preserves nested keys with undefined values', () => {
const objA = { filter: { page: 1 } }
const objB = { filter: { triggeredAddress: undefined, page: 1 } }

const newCopy = copyWithStructuralSharing(objA, objB)
expect(newCopy).not.toBe(objA)
expect(newCopy.filter).not.toBe(objA.filter)
expect(Object.getOwnPropertyNames(newCopy.filter)).toContain('triggeredAddress')
})

test('returns same object when both have same undefined keys', () => {
const objA = { triggeredAddress: undefined, page: 1 }
const objB = { triggeredAddress: undefined, page: 1 }

const newCopy = copyWithStructuralSharing(objA, objB)
expect(newCopy).toBe(objA)
expect(newCopy).toStrictEqual(objB)
})

test('equal object from JSON Object', () => {
const json = JSON.stringify({
a: { b: { c: { d: 1, e: '2', f: true }, g: false }, h: null },
Expand Down
6 changes: 4 additions & 2 deletions packages/toolkit/src/query/utils/copyWithStructuralSharing.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,10 @@ export function copyWithStructuralSharing(oldObj: any, newObj: any): any {
) {
return newObj
}
const newKeys = Object.keys(newObj)
const oldKeys = Object.keys(oldObj)
// Use getOwnPropertyNames to include keys with undefined values
// This is important for query args that may contain explicit undefined values
const newKeys = Object.getOwnPropertyNames(newObj)
const oldKeys = Object.getOwnPropertyNames(oldObj)

let isSameObject = newKeys.length === oldKeys.length
const mergeObj: any = Array.isArray(newObj) ? [] : {}
Expand Down
Loading