question-mark

Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Using in browser: "TypeError: Failed to execute 'fetch' on 'Window': Illegal invocation"

See original GitHub issue

Issue Description

Using the latest airtable.browser.js and the latest jQuery (same error with the old version referenced in test_files/index.html), I get the following error:

In Chrome 86.0:

TypeError: Failed to execute 'fetch' on 'Window': Illegal invocation

In Firefox 81.0:

TypeError: 'fetch' called on an object that does not implement interface Window.

Following code:

<html>
    <head>
        <script src="./vendor/jquery.js"></script>
        <script src="./vendor/airtable.js"></script>
    </head>
    <body>
        <script>
            var Airtable = require('airtable');
            var base = new Airtable({apiKey: 'API_KEY'}).base('BASE_ID');
            base('TABLE_NAME').select({
                maxRecords: 3,
                view: "Grid view"
            }).eachPage(function page(records, fetchNextPage) {
                records.forEach(function(record) {
                    console.log('Retrieved', record.get('Name'));
                });
                fetchNextPage();
            }, function done(err) {
                if (err) { console.error(err); return; }
            });
        </script>
    </body>
</html>

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:8
  • Comments:9 (2 by maintainers)

github_iconTop GitHub Comments

6reactions
rub1ecommented, Oct 19, 2020

@carderne here’s a simple workaround if you’re still stuck:

/node_modules/airtable/lib/fetch.js

On line 8, change typeof window === 'undefined' ? node_fetch_1.default : fetch; to typeof window === 'undefined' ? node_fetch_1.default : window.fetch.bind(window));

Or you can use my patch file until it’s fixed properly - use the below in conjunction with patch-package

/patches/airtable+0.10.0.patch

diff --git a/node_modules/airtable/lib/fetch.js b/node_modules/airtable/lib/fetch.js
index 1477bf1..566d00f 100644
--- a/node_modules/airtable/lib/fetch.js
+++ b/node_modules/airtable/lib/fetch.js
@@ -5,5 +5,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 var node_fetch_1 = __importDefault(require("node-fetch"));
 module.exports = (
 // istanbul ignore next
-typeof window === 'undefined' ? node_fetch_1.default : fetch);
+typeof window === 'undefined' ? node_fetch_1.default : window.fetch.bind(window));
 //# sourceMappingURL=fetch.js.map
\ No newline at end of file
5reactions
cardernecommented, Oct 21, 2020

The change suggested by @rub1e is on line 313 in airtable.browser.js:

https://github.com/Airtable/airtable.js/blob/96e2e80fe8d967c549c784fe9934596a94900a1a/build/airtable.browser.js#L313

Change it as suggested and it should work.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Failed to execute 'fetch' on 'Window': Illegal invocation - Stack ...
and performRequest throws this error ( Fetch TypeError: Failed to execute 'fetch' on 'Window': Illegal invocation ). I've changed it to:
Read more >
Failed to execute 'fetch' on 'Window': Illegal invocation · Issue ...
The script crashed with error TypeError: Failed to execute 'fetch' on 'Window': Illegal invocation. After webkack it is looks: exports.
Read more >
Failed to execute 'fetch' on 'Window': Illegal invocation ...
I trying to use fetch for calls to backend from react without libs like Axios. api.ts export const sendSuggestion = ((data: any): Promise<any> ......
Read more >
Failed to execute 'fetch' on 'Window': Illegal invocation
Hi there,. I'm attempting to integrate my airtable database api into a React project. I installed airtable using 'npm install airtable'.
Read more >
[SOLVED] Failed to execute 'fetch' on 'Window' - Moralis Forum
All of a sudden i keep getting Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'Window': 1 argument required, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found