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

fetch is not defined - maybe your browser targets are not covering everything you need #547

Closed
cah-brian-gantzler opened this issue Aug 8, 2020 · 33 comments · Fixed by #552

Comments

@cah-brian-gantzler
Copy link

cah-brian-gantzler commented Aug 8, 2020

I believe I have tracked the issue down to https://github.com/github/fetch. In version 3.1.1 it used to contain this https://github.com/github/fetch/blob/v3.1.1/fetch.js#L546 but in 3.2.0 it now contains this https://github.com/github/fetch/blob/v3.2.0/fetch.js#L564

Ember-fetch contains this check https://github.com/ember-cli/ember-fetch/blob/master/assets/browser-fetch.js.t#L36. I believe the module body here https://github.com/ember-cli/ember-fetch/blob/master/assets/browser-fetch.js.t#L34 injects the fetch library somehow. Ember-fetch is checking self and I think it now needs to check global maybe. Since this happened so long ago I dont know what dependencies have changed to make it fail for me now, but it failed today for me in multiple unrelated projects.

@mrloop
Copy link

mrloop commented Aug 8, 2020

If your using yarn add this to your package.json

"resolutions": {
  "whatwg-fetch": "3.3.1"
 }

Looks like new release 3.4.0 of whatwg-fetch breaks ember-fetch

@rwjblue
Copy link
Member

rwjblue commented Aug 8, 2020

@rwjblue
Copy link
Member

rwjblue commented Aug 8, 2020

I did try to see if the tests here would fail with the latest versions of whatwg-fetch, and they do not (#548).

Does anyone have a reproduction?

@RobbieTheWagner
Copy link

All of my addons have started failing with Error: fetch is not defined - maybe your browser targets are not covering everything you need?. What's the workaround?

@RobbieTheWagner
Copy link

This addon docs PR is currently throwing the error ember-learn/ember-cli-addon-docs#495

@RobbieTheWagner
Copy link

I can confirm adding this fixes the issue for addon docs:

"resolutions": {
  "whatwg-fetch": "3.3.1"
 }

Is there a fix we can add to ember-fetch so this is not necessary?

@rwjblue
Copy link
Member

rwjblue commented Aug 8, 2020

Is there a fix we can add to ember-fetch so this is not necessary?

Definitely. Once we know what is actually wrong 😃

We need a repro, and ideally to make this addons test suite fail like what is happening for realz...

@cah-brian-gantzler
Copy link
Author

https://github.com/bgantzler/fetch-app

Just a new application, install ember-fetch, create a controller and import fetch. Will fail when you run the app

@cah-brian-gantzler
Copy link
Author

fails when you run the tests. They are the default blueprint tests unmodified

@cah-brian-gantzler
Copy link
Author

Oh and I resolved to the failing version using

"resolutions": {
  "whatwg-fetch": "3.4.0"
 }

just in case cause I saw a merge of a yarn.lock rollback

@rwjblue
Copy link
Member

rwjblue commented Aug 8, 2020

Just a new application, install ember-fetch, create a controller and import fetch. Will fail when you run the app

Hmm, why aren't our own tests failing here then (if that is all that is needed)?

erikap added a commit to lblod/frontend-loket that referenced this issue Aug 8, 2020
@RobbieTheWagner
Copy link

Just a new application, install ember-fetch, create a controller and import fetch. Will fail when you run the app

Hmm, why aren't our own tests failing here then (if that is all that is needed)?

@rwjblue perhaps importing fetch in tests does not do the same things as importing it in app code?

@RobbieTheWagner
Copy link

Perhaps we should set this addon to explicitly use 3.3.1 until we have a fix?

@cah-brian-gantzler
Copy link
Author

For the simple app I have created above, running the test ember t does fail on the controller

not ok 1 Chrome 84.0 - [145 ms] - Unit | Controller | application: it exists
    ---
        actual: >
            null
        stack: >
            Error: fetch is not defined - maybe your browser targets are not covering everything you need?
                at Module.callback (http://localhost:7357/assets/vendor.js:66720:13)
                at Module.exports (http://localhost:7357/assets/vendor.js:118:32)
                at Module._reify (http://localhost:7357/assets/vendor.js:155:59)
                at Module.reify (http://localhost:7357/assets/vendor.js:142:27)
                at Module.exports (http://localhost:7357/assets/vendor.js:116:10)
                at requireModule (http://localhost:7357/assets/vendor.js:39:18)
                at Class._extractDefaultExport (http://localhost:7357/assets/vendor.js:92885:20)
                at Class.resolveOther (http://localhost:7357/assets/vendor.js:92545:32)
                at Class.resolve (http://localhost:7357/assets/vendor.js:92608:25)
                at resolve (http://localhost:7357/assets/vendor.js:1884:36)
        message: >
            Died on test #1     at Object.<anonymous> (http://localhost:7357/assets/tests.js:15:21)
                at processModule (http://localhost:7357/assets/test-support.js:3894:16)
                at module$1 (http://localhost:7357/assets/test-support.js:3919:4)
                at Module.callback (http://localhost:7357/assets/tests.js:12:21)
                at Module.exports (http://localhost:7357/assets/vendor.js:118:32)
                at requireModule (http://localhost:7357/assets/vendor.js:39:18)
                at TestLoader.require (http://localhost:7357/assets/test-support.js:14364:9)
                at TestLoader.loadModules (http://localhost:7357/assets/test-support.js:14357:14): fetch is not defined - maybe your browser targets are not covering everything you need?
        negative: >
            false
        browser log: |
    ...
ok 2 Chrome 84.0 - [1 ms] - ember-qunit: Ember.onerror validation: Ember.onerror is functioning properly

1..2
# tests 2
# pass  1
# skip  0
# todo  0
# fail  1

@cah-brian-gantzler
Copy link
Author

Oh im sorry. I think I know what you mean. You mean ONLY importing fetch in tests. Yes I believe you may be correct. If has something to do with the loader.

This is the initial post I made in discord help

Uncaught Error: fetch is not defined - maybe your browser targets are not covering everything you need?
    at Module.callback (ember-fetch.js:824)
    at Module.exports (loader.js:106)
    at Module._reify (loader.js:143)
    at Module.reify (loader.js:130)
    at Module.exports (loader.js:104)
    at Module._reify (loader.js:143)
    at Module.reify (loader.js:130)
    at Module.exports (loader.js:104)
    at requireModule (loader.js:27)
    at Class._extractDefaultExport (index.js:397)

@cah-brian-gantzler
Copy link
Author

cah-brian-gantzler commented Aug 9, 2020

I dont know if this helps, but on the repo I posted https://github.com/bgantzler/fetch-app if you switch to the branch acceptance (I just created), the fetch is no longer in the app, so the app no longer fails. It is now only imported in an acceptance test. And it fails there.

@RobbieTheWagner
Copy link

Hmm, I have no idea why it doesn't fail in tests in this repo then. I think we should likely set to 3.3.1 explicitly until someone can figure out the real fix. @rwjblue thoughts on putting that in as a temporary patch?

@cah-brian-gantzler
Copy link
Author

cah-brian-gantzler commented Aug 9, 2020

During this addons test run, the ember-fetch in vendor doesnt have any code where the <%= moduleBody %> is suppose to be
image

When when I run during my apps controller test (master) there is
image

So yea, the test environments they are running in are different

@chancancode
Copy link
Contributor

The tutorial builds are failing as well: https://github.com/ember-learn/super-rentals-tutorial/actions/runs/199896721

@xg-wang
Copy link
Member

xg-wang commented Aug 9, 2020

Created a PR for failing CI.
It seems the self -> global name change Rob mentioned broke ember-fetch

@RobbieTheWagner
Copy link

Nice, thanks @xg-wang! Looking forward to having this merged 😃

@xg-wang
Copy link
Member

xg-wang commented Aug 10, 2020

@rwwagner90 no problem! Just released https://www.npmjs.com/package/ember-fetch/v/8.0.2

@chancancode
Copy link
Contributor

mixonic added a commit to Addepar/ember-table that referenced this issue Aug 10, 2020
Also drop un-used XHR mocking dependencies, and pin a dependency of
ember-cli-addon-docs per
ember-cli/ember-fetch#547 (which could
alternatively be resolved by upgrading ember-cli-addon-docs to ^8.0.2)
mixonic added a commit to Addepar/ember-table that referenced this issue Aug 10, 2020
Also drop un-used XHR mocking dependencies, and pin a dependency of
ember-cli-addon-docs per
ember-cli/ember-fetch#547 (which could
alternatively be resolved by upgrading ember-cli-addon-docs to ^8.0.2)
mixonic added a commit to Addepar/ember-table that referenced this issue Aug 10, 2020
Also drop un-used XHR mocking dependencies, and pin a dependency of
ember-cli-addon-docs per
ember-cli/ember-fetch#547 (which could
alternatively be resolved by upgrading ember-cli-addon-docs to ^8.0.2)
@EugeniaZhang
Copy link

image
"resolutions": {
"whatwg-fetch": "3.4.0"
}
I use this did not resolved the question

@RobbieTheWagner
Copy link

@EugeniaZhang that would not resolve the issue, as 3.4.0 is where the issue began. You would need:

"resolutions": {
  "whatwg-fetch": "3.3.1"
 }

However, version 8.0.2 of ember-fetch has a fix for this issue, so I would recommend updating to 8.0.2.

@iamareebjamal
Copy link

@RobbieTheWagner
Copy link

@iamareebjamal maybe try yarn upgrade? If it's failing, something is likely still not using 8.0.2.

bantic added a commit to Addepar/ember-table that referenced this issue Nov 2, 2020
Pin whatwg-fetch dependence to '3.3.1'.

This fixes an error "fetch is not defined - maybe your browser targets are not covering everything you need?"
that shows up when running the tests for the floating dependencies stage.

That error comes from ember-fetch, see ember-cli/ember-fetch#547

Also remove unused ember-ajax and ember-fetch devDependencies
bantic added a commit to Addepar/ember-table that referenced this issue Nov 2, 2020
Pin whatwg-fetch dependence to '3.3.1'.

This fixes an error "fetch is not defined - maybe your browser targets are not covering everything you need?"
that shows up when running the tests for the floating dependencies stage.

That error comes from ember-fetch, see ember-cli/ember-fetch#547
bantic added a commit to Addepar/ember-table that referenced this issue Nov 2, 2020
Pin whatwg-fetch dependence to '3.3.1'.

This fixes an error "fetch is not defined - maybe your browser targets are not covering everything you need?"
that shows up when running the tests for the floating dependencies stage.

That error comes from ember-fetch, see ember-cli/ember-fetch#547
bantic pushed a commit to Addepar/ember-table that referenced this issue Nov 6, 2020
Also drop un-used XHR mocking dependencies, and pin a dependency of
ember-cli-addon-docs per
ember-cli/ember-fetch#547 (which could
alternatively be resolved by upgrading ember-cli-addon-docs to ^8.0.2)
NullVoxPopuli pushed a commit to NullVoxPopuli/ember-table that referenced this issue Feb 2, 2021
Also drop un-used XHR mocking dependencies, and pin a dependency of
ember-cli-addon-docs per
ember-cli/ember-fetch#547 (which could
alternatively be resolved by upgrading ember-cli-addon-docs to ^8.0.2)
johanrd pushed a commit to johanrd/ember-table that referenced this issue Feb 25, 2021
Also drop un-used XHR mocking dependencies, and pin a dependency of
ember-cli-addon-docs per
ember-cli/ember-fetch#547 (which could
alternatively be resolved by upgrading ember-cli-addon-docs to ^8.0.2)
rwjblue added a commit to emberjs/ember-test-helpers that referenced this issue Mar 23, 2021
This was fixed in [email protected] but we are stuck using ember-fetch@6
(due to Node version compat). This works around the issue.

See ember-cli/ember-fetch#547 for more
details.
gilest added a commit to adopted-ember-addons/ember-file-upload that referenced this issue Apr 15, 2021
ember-data: Too permissive. The latest version 3.26 was being installed. Incompatible with the existing setup

whatwg-fetch: Incompatible version. Should be cleared up when we next upgrade addon-docs. (ember-cli/ember-fetch#547)
gilest added a commit to adopted-ember-addons/ember-file-upload that referenced this issue Apr 17, 2021
ember-data: Too permissive. The latest version 3.26 was being installed. Incompatible with the existing setup

whatwg-fetch: Incompatible version. Should be cleared up when we next upgrade addon-docs. (ember-cli/ember-fetch#547)
gilest added a commit to adopted-ember-addons/ember-file-upload that referenced this issue Apr 20, 2021
…431)

As sub-dependencies out in the wild have been updated they have caused the "Floating Dependencies" builds to fail.

ember-data: Too permissive. The latest version 3.26 was being installed. Incompatible with the existing addon

whatwg-fetch: Incompatible version. Can be cleared up when we next upgrade addon-docs. (ember-cli/ember-fetch#547)
@tehmaestro
Copy link

I'm using ember-fetch 8.0.4 and still have this issue.

@xg-wang
Copy link
Member

xg-wang commented Apr 20, 2021

@tehmaestro can you paste the output of yarn why whatwg-fetch to tell us what's the versions you're using?

@allthesignals
Copy link

@tehmaestro can you paste the output of yarn why whatwg-fetch to tell us what's the versions you're using?

image

yarn why whatwg-fetch
yarn why v1.22.4
[1/4] 🤔 Why do we have the module "whatwg-fetch"...?
[2/4] 🚚 Initialising dependency graph...
[3/4] 🔍 Finding dependency...
[4/4] 🚡 Calculating file sizes...
=> Found "[email protected]"
info Reasons this module exists

  • "pretender" depends on it
  • Hoisted from "pretender#whatwg-fetch"
  • Hoisted from "ember-fetch#whatwg-fetch"
  • Hoisted from "ember-simple-auth#ember-fetch#whatwg-fetch"
  • Hoisted from "ember-simple-auth-token#ember-fetch#whatwg-fetch"
    info Disk size without dependencies: "72KB"
    info Disk size with unique dependencies: "72KB"
    info Disk size with transitive dependencies: "72KB"
    info Number of shared dependencies: 0
    ✨ Done in 0.87s.

@tehmaestro
Copy link

Hey, turns out I was using ember-simple-auth version 2.1.0, which uses an older version of ember-fetch . I was able to fix the issue by upgrading ember-simple-auth

aatauil added a commit to lblod/frontend-dashboard that referenced this issue Jun 7, 2021
Known issue breaks app but can be resolved by upgrading: ember-cli/ember-fetch#547
@csprocket777
Copy link

I'm running into this right now and see that I'm using [email protected]. Yarn why shows that I only have that version installed and even tried the whatwg-fetch resolution trick. Still getting it.

I'm in the process of updating an app from 3.x to 5.x and am wondering if there's some other dependency issue here.

Here is my package.json:

{
  "name": "--redacted--",
  "version": "1.4.25",
  "private": true,
  "description": "Small description for --redacted-- goes here",
  "repository": "--redacted--",
  "license": "MIT",
  "author": "",
  "directories": {
    "doc": "doc",
    "test": "tests"
  },
  "scripts": {
    "build": "ember build",
    "build:prod": "ember build --environment=production",
    "build:dev": "ember build --environment=development",
    "release": "npx semantic-release",
    "lint": "npm-run-all --aggregate-output --continue-on-error --parallel 'lint:!(fix)'",
    "lint:fix": "npm-run-all --aggregate-output --continue-on-error --parallel lint:*:fix",
    "lint:hbs": "npx ember-template-lint .",
    "lint:hbs:fix": "npx ember-template-lint . --fix",
    "lint:js": "eslint . --cache",
    "lint:js:fix": "eslint . --fix",
    "lint:ts": "eslint . --cache",
    "lint:ts:fix": "eslint . --fix",
    "start": "ember serve",
    "start:local": "ember serve -e=local",
    "test": "cross-env COVERAGE=true ember test",
    "test:all:lint": "npm-run-all lint test:*"
  },
  "nyc": {
    "reporter": [
      "text-summary",
      "html",
      "json",
      "lcov"
    ],
    "cache": true,
    "report-dir": "./coverage"
  },
  "devDependencies": {
    "@ember-data/legacy-compat": "^5.3.8",
    "@ember/optional-features": "^2.1.0",
    "@ember/render-modifiers": "^2.1.0",
    "@faker-js/faker": "^9.0.0",
    "@fortawesome/ember-fontawesome": "^0.2.1",
    "@fortawesome/free-regular-svg-icons": "^5.14.0",
    "@fortawesome/free-solid-svg-icons": "^5.14.0",
    "@glimmer/component": "^1.1.2",
    "@glimmer/tracking": "^1.1.2",
    "@glint/core": "^1.4.0",
    "@glint/environment-ember-loose": "^1.4.0",
    "@semantic-release/changelog": "^5.0.1",
    "@semantic-release/commit-analyzer": "^8.0.1",
    "@semantic-release/git": "^9.0.1",
    "@semantic-release/gitlab": "^6.2.2",
    "@semantic-release/npm": "^7.1.3",
    "@semantic-release/release-notes-generator": "^9.0.3",
    "@tsconfig/ember": "^3.0.8",
    "@types/bootstrap": "^5.2.10",
    "@types/ember": "^4.0.11",
    "@types/ember-data": "^4.4.16",
    "@types/ember-data__model": "^4.0.5",
    "@types/ember-data__store": "^4.0.7",
    "@types/ember-qunit": "^6.1.1",
    "@types/ember-resolver": "^9.0.0",
    "@types/ember__application": "^4.0.11",
    "@types/ember__array": "^4.0.10",
    "@types/ember__component": "^4.0.22",
    "@types/ember__controller": "^4.0.12",
    "@types/ember__debug": "^4.0.8",
    "@types/ember__engine": "^4.0.11",
    "@types/ember__error": "^4.0.6",
    "@types/ember__object": "^4.0.12",
    "@types/ember__polyfills": "^4.0.6",
    "@types/ember__routing": "^4.0.22",
    "@types/ember__runloop": "^4.0.10",
    "@types/ember__service": "^4.0.9",
    "@types/ember__string": "^3.16.3",
    "@types/ember__template": "^4.0.7",
    "@types/ember__test": "^4.0.6",
    "@types/ember__test-helpers": "^2.9.1",
    "@types/ember__utils": "^4.0.7",
    "@types/htmlbars-inline-precompile": "^3.0.3",
    "@types/qunit": "^2.19.10",
    "@types/rsvp": "^4.0.9",
    "babel-eslint": "^10.1.0",
    "broccoli-asset-rev": "^3.0.0",
    "broccoli-funnel": "^3.0.8",
    "cross-env": "^7.0.3",
    "ember-async-await-helper": "^1.0.0",
    "ember-can": "~6.0.0",
    "ember-cli": "^5.11.0",
    "ember-cli-app-version": "^7.0.0",
    "ember-cli-babel": "^8.2.0",
    "ember-cli-code-coverage": "^1.0.0-beta.9",
    "ember-cli-dependency-checker": "^3.3.2",
    "ember-cli-htmlbars": "^6.3.0",
    "ember-cli-inject-live-reload": "^2.1.0",
    "ember-cli-mirage": "^3.0.4",
    "ember-cli-moment-shim": "^3.8.0",
    "ember-cli-new-version": "^4.1.0",
    "ember-cli-sass": "^11.0.1",
    "ember-cli-sri": "^2.1.1",
    "ember-cli-string-helpers": "^6.1.0",
    "ember-cli-terser": "^4.0.2",
    "ember-cli-typescript": "^5.3.0",
    "ember-cli-typescript-blueprints": "^3.0.0",
    "ember-cli-update": "^2.0.1",
    "ember-composable-helpers": "^5.0.0",
    "ember-concurrency": "^4.0.2",
    "ember-concurrency-ts": "^0.3.1",
    "ember-cp-validations": "^4.0.0",
    "ember-data": "~4.7.1",
    "ember-fetch": "^8.1.2",
    "ember-inflector": "^5.0.1",
    "ember-intl": "^7.0.5",
    "ember-load-initializers": "^2.1.2",
    "ember-math-helpers": "^4.0.0",
    "ember-maybe-import-regenerator": "^1.0.0",
    "ember-metrics": "^1.5.2",
    "ember-modifier": "^4.2.0",
    "ember-moment": "^10.0.1",
    "ember-page-title": "^8.2.3",
    "ember-power-select": "~8.3.0",
    "ember-qunit": "^8.1.0",
    "ember-resolver": "^8.0.3",
    "ember-source": "~4.7.0",
    "ember-template-lint": "^6.0.0",
    "ember-test-selectors": "^7.0.0",
    "ember-welcome-page": "^7.0.2",
    "ember-window-mock": "^1.0.2",
    "eslint": "^9.9.1",
    "eslint-config-prettier": "^9.1.0",
    "eslint-plugin-ember": "^12.2.0",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-prettier": "^5.2.1",
    "eslint-plugin-qunit": "^8.1.2",
    "eslint-plugin-unused-imports": "^4.1.3",
    "glob": "^11.0.0",
    "loader.js": "^4.7.0",
    "miragejs": "^0.2.0-alpha.3",
    "moment": "~2.30.1",
    "morgan": "^1.10.0",
    "npm-run-all": "^4.1.5",
    "prettier": "^3.3.3",
    "qunit": "^2.22.0",
    "qunit-dom": "^3.2.0",
    "sass": "^1.78.0",
    "semantic-release": "^17.4.7",
    "typescript": "^5.5.4",
    "webpack": "^5.94.0",
    "webpack-bundle-analyzer": "^4.10.2"
  },
  "dependencies": {
    "@eclass/semantic-release-sentry-releases": "^3.1.0",
    "@ember/test-helpers": "^3.3.1",
    "@mercury-dev/ember-cui": "^1.24.58",
    "@popperjs/core": "^2.11.8",
    "@sentry/ember": "^7.83.0",
    "animate.css": "^4.1.1",
    "bootstrap": "^5.3.3",
    "conventional-changelog-conventionalcommits": "^4.6.3",
    "crypto-js": "^4.2.0",
    "ember-auto-import": "^2.7.4",
    "ember-basic-dropdown": "^8.3.0",
    "ember-data-storefront": "ember4",
    "ember-element-helper": "^0.8.6",
    "ember-get-config": "^2.1.1",
    "ember-truth-helpers": "^4.0.3",
    "jsonexport": "^3.2.0"
  },
  "resolutions": {
    "ember-power-select": "^8.2.0",
    "ember-auto-import": "^2.7.4",
    "broccoli-rollup": "^5.0.0",
    "@ember/test-helpers": "^3.3.1",
    "whatwg-fetch": "3.3.1"
  },
  "engines": {
    "node": "14.* || >= 16 || >= 18"
  },
  "ember": {
    "edition": "octane"
  },
  "packageManager": "[email protected]"
}

Any thoughts on what I should check for?

@csprocket777
Copy link

It would appear that enabling preferNative helped in my case:
ember-cli-build.js

    'ember-fetch': {
      preferNative: true
    }

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 a pull request may close this issue.