Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Read window.rAF later to allow fake timers to work correctly #4701

Merged
merged 2 commits into from
Nov 23, 2024

Conversation

ensconced
Copy link
Contributor

This fixes issue #4693 by reading window.requestAnimationFrame within the autoBatchEnhancer function instead of in the top-level module scope. This ensures that we use the fake version of requestAnimationFrame if jest is using fake timers.

Copy link

codesandbox bot commented Nov 10, 2024

Review or Edit in CodeSandbox

Open the branch in Web EditorVS CodeInsiders

Open Preview

@ensconced
Copy link
Contributor Author

I'm just trying to figure out how I can write a test for this

@ensconced ensconced changed the title Fix issue https://github.com/reduxjs/redux-toolkit/issues/4693 Fix issue #4693 Nov 10, 2024
Copy link

netlify bot commented Nov 10, 2024

Deploy Preview for redux-starter-kit-docs ready!

Name Link
🔨 Latest commit 3907062
🔍 Latest deploy log https://app.netlify.com/sites/redux-starter-kit-docs/deploys/6731b3b6d5c12c00087e6dd1
😎 Deploy Preview https://deploy-preview-4701--redux-starter-kit-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

codesandbox-ci bot commented Nov 10, 2024

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 3907062:

Sandbox Source
@examples-query-react/basic Configuration
@examples-query-react/advanced Configuration
@examples-action-listener/counter Configuration
rtk-esm-cra Configuration

Comment on lines 61 to 64
typeof window !== 'undefined' && window.requestAnimationFrame
? window.requestAnimationFrame
: createQueueWithTimer(10)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

At this point, this could probably be inlined in line 69.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense, I have pushed this change.

@ensconced ensconced force-pushed the master branch 2 times, most recently from 854a592 to fe61d49 Compare November 11, 2024 07:00
@@ -125,3 +125,84 @@ describe.each(cases)('autoBatchEnhancer: %j', (autoBatchOptions) => {
expect(subscriptionNotifications).toBe(3)
})
})

describe.each(cases)(
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Two of these tests were failing before the fix was applied

@@ -66,7 +59,8 @@ export const autoBatchEnhancer =
options.type === 'tick'
? queueMicrotask
: options.type === 'raf'
? rAF
? // requestAnimationFrame won't exist in SSR environments. Fall back to a vague approximation just to keep from erroring.
window?.requestAnimationFrame ?? createQueueWithTimer(10)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

window? doesn't cover all cases that typeof window !== 'undefined' does - optional chaining still can cause a reference error if a variable with that name never was defined:
grafik

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah, of course. I have just pushed a fix to revert it back to a ternary like before

reading window.requestAnimationFrame within the autoBatchEnhancer
function instead of in the top-level module scope. This ensures that
we use the fake version of requestAnimationFrame if jest is using
fake timers.
@ensconced
Copy link
Contributor Author

Let me know if there's anything else I can do to help this get merged 🙂

@phryneas
Copy link
Member

Mostly, "make the day have 48 hours" :)

Frankly, we have a ton to do (here and in our day-to-day lifes), so PRs can sit around for quite a while until one of us finds the time to thoroughly go over a few of them.

At first glance, this looks good, but please don't expect this to be merged/released soon. You can use the CodeSandbox release from the CSB comment in the meantime!

@markerikson markerikson changed the title Fix issue #4693 Read window.rAF later to allow fake timers to work correctly Nov 23, 2024
@markerikson markerikson merged commit dbe7f06 into reduxjs:master Nov 23, 2024
43 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants