diff --git a/.changeset/lemon-fireants-build.md b/.changeset/lemon-fireants-build.md new file mode 100644 index 00000000000..5c78fd215ca --- /dev/null +++ b/.changeset/lemon-fireants-build.md @@ -0,0 +1,5 @@ +--- +"@apollo/client": patch +--- + +Prevent the `setTimeout` in `connectToDevtools` that shows the devtools suggestion from firing when the user agent does not match Chrome or Firefox. This check was previously done inside the `setTimeout` which meant the timer was scheduled for environments where we'd never show the message anyways. For test environments, this could cause flaky tests when that `setTimeout` outlived the tests and ran after any virtual DOM was torn down and removed. diff --git a/src/core/ApolloClient.ts b/src/core/ApolloClient.ts index cbde11446b2..45289b17a39 100644 --- a/src/core/ApolloClient.ts +++ b/src/core/ApolloClient.ts @@ -1169,33 +1169,35 @@ export class ApolloClient { */ if (!hasSuggestedDevtools && __DEV__) { hasSuggestedDevtools = true; + const win = window; + + const ua = win.navigator.userAgent; + let url: string | undefined; + + if (typeof ua === "string") { + if (ua.indexOf("Chrome/") > -1) { + url = + "https://chrome.google.com/webstore/detail/" + + "apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm"; + } else if (ua.indexOf("Firefox/") > -1) { + url = + "https://addons.mozilla.org/en-US/firefox/addon/apollo-developer-tools/"; + } + } + if ( - window.document && - window.top === window.self && - /^(https?|file):$/.test(window.location.protocol) + win.document && + win.top === win.self && + /^(https?|file):$/.test(win.location.protocol) && + url ) { setTimeout(() => { - if (!(window as any).__APOLLO_DEVTOOLS_GLOBAL_HOOK__) { - const nav = window.navigator; - const ua = nav && nav.userAgent; - let url: string | undefined; - if (typeof ua === "string") { - if (ua.indexOf("Chrome/") > -1) { - url = - "https://chrome.google.com/webstore/detail/" + - "apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm"; - } else if (ua.indexOf("Firefox/") > -1) { - url = - "https://addons.mozilla.org/en-US/firefox/addon/apollo-developer-tools/"; - } - } - if (url) { - invariant.log( - "Download the Apollo DevTools for a better development " + - "experience: %s", - url - ); - } + if (!(win as any).__APOLLO_DEVTOOLS_GLOBAL_HOOK__) { + invariant.log( + "Download the Apollo DevTools for a better development " + + "experience: %s", + url + ); } }, 10000); }