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

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

Closed
carderne opened this issue Oct 16, 2020 · 9 comments

Comments

@carderne
Copy link

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>
@rub1e
Copy link
Contributor

rub1e commented Oct 19, 2020

I'm currently experiencing the same issue, and so is someone in the Airtable forums

https://community.airtable.com/t/failed-to-execute-fetch-on-window-illegal-invocation/34738

Would be really helpful if someone from Airtable could take a look - currently paralysed

@rub1e
Copy link
Contributor

rub1e commented 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

rub1e added a commit to rub1e/airtable.js that referenced this issue Oct 19, 2020
@carderne
Copy link
Author

Thanks @rub1e, that's working!

@midosamidos
Copy link

midosamidos commented Oct 20, 2020

Thanks for your help, but your workaround requires changing line 8 on the fetch.js file.
What if I'm using only the airtable.browser.js file in the browser?
The problem is in latest version of the airtable.browser.js file, which is the only file i’m using.

The only workaround that I found (for my case), is to not use the latest airtable.browser.js file
And I'm using the one that is located here /test/test_files/airtable.browser.js

@carderne
Copy link
Author

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

typeof window === 'undefined' ? node_fetch_1.default : fetch);

Change it as suggested and it should work.

@midosamidos
Copy link

@carderne The best Chris in the world 👍

@Aias
Copy link

Aias commented Oct 26, 2020

Same issue here, hope to see some action soon.

@carderne
Copy link
Author

This probably won't be merged, but here's a PR with the required fix for airtable.browser.js: #234

Alternatively, here's the file you need:
https://github.com/carderne/airtable.js/blob/master/build/airtable.browser.js

mzgoddard pushed a commit to bocoup/airtable.js that referenced this issue Oct 27, 2020
benrazon pushed a commit that referenced this issue Nov 2, 2020
Solution to #230

Co-authored-by: Alex Rubner <alex.rubner@gmail.com>
@carderne
Copy link
Author

carderne commented Nov 3, 2020

airtable.browser.js is now fixed: https://github.com/Airtable/airtable.js/blob/master/build/airtable.browser.js

Thanks @benrazon for the fix, closing the issue.

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

No branches or pull requests

4 participants