Skip to content
This repository has been archived by the owner on Oct 9, 2020. It is now read-only.

Unable to use on Safari and PhantomJS #104

Open
JSlain opened this issue Aug 22, 2016 · 7 comments
Open

Unable to use on Safari and PhantomJS #104

JSlain opened this issue Aug 22, 2016 · 7 comments

Comments

@JSlain
Copy link

JSlain commented Aug 22, 2016

and maybe other browsers, who knows...
The stacktrace below is the result of a remote BrowserStack test.
I have the same result on a local PhantomJS test, but not on a local chrome or firefox.
The tests also pass on remote BrowserStack firefox or chrome (my setup isn't the culprit).

    Safari 8.0.8 (Mac OS X 10.10.5) ERROR
    Error: (SystemJS) Unable to load dependency C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/github/systemjs/[email protected]/css.js.
    eval code

    eval@[native code]
    tryCatchReject@C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/system-polyfills.src.js:1188:34
    runContinuation1@C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/system-polyfills.src.js:1147:18
    when@C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/system-polyfills.src.js:935:20
    run@C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/system-polyfills.src.js:826:17
    _drain@C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/system-polyfills.src.js:102:22
    drain@C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/system-polyfills.src.js:67:15
    Evaluating C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/github/systemjs/[email protected]
    Error loading C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/github/systemjs/[email protected]
    Error loading C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/github/twbs/[email protected]/css/bootstrap.css!http://localhost:9876C:/projects-git/exemples-jspm/jspm-project-es5/public/jspm_packages/github/systemjs/[email protected] as "bootstrap/css/bootstrap.css!" from C:/projects-git/exemples-jspm/jspm-project-es5/public/app/components/account/account.module.js
@JSlain JSlain mentioned this issue Aug 22, 2016
Open
@guybedford
Copy link
Member

I just tested this in Safari 5 and also in PhantomJS with the latest commit and this is definitely working fine.

@JSlain
Copy link
Author

JSlain commented Sep 1, 2016

Ok, but it defenitely doesn't work on my side...
Look at the result of my karma tests, which run on Chrome and PhantomJS at the same time.
The Chrome test is working fine, but the PhantomJS one fails while trying to load plugin-css.

{ jspm-project-es5 } feature/withbundling » gulp test.unit.karma /cygdrive/c/projects-git/exemples-jspm/jspm-project-es5
[13:02:13] Using gulpfile C:\projects-git\exemples-jspm\jspm-project-es5\gulpfile.js
[13:02:13] Starting 'karma:unit.karma'...
01 09 2016 13:02:15.062:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
01 09 2016 13:02:15.068:INFO [launcher]: Starting browser Chrome
01 09 2016 13:02:15.073:INFO [launcher]: Starting browser PhantomJS
01 09 2016 13:02:16.589:INFO [PhantomJS 2.1.1 (Windows 7 0.0.0)]: Connected on socket /#E4sylAPcKT2SQVobAAAA with id 39209630
01 09 2016 13:02:17.026:WARN [web-server]: 404: /base/src/jspm_packages/system-polyfills.js
PhantomJS 2.1.1 (Windows 7 0.0.0) ERROR

    Error: (SystemJS) Unable to load dependency C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/github/systemjs/[email protected]/css.js.
    getModule@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:354161
    C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:356906
    require@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:454543


    eval code
    eval@[native code]
    __exec@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:170495
    execute@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:456435
    linkDynamicModule@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:356494
    link@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:347594
    execute@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:368529
    doDynamicExecute@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:58925
    link@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:68198
    doLink@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:51323
    updateLinkSetOnLoad@C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:53097
    C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/system.src.js:9:44754
    Evaluating C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/github/systemjs/[email protected]
    Error loading C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/github/systemjs/[email protected]
    Error loading C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/github/twbs/[email protected]/css/bootstrap.css!http://localhost:9876C:/projects-git/exemples-jspm/jspm-project-es5/src/jspm_packages/github/systemjs/[email protected] as "bootstrap/css/bootstrap.css!" from C:/projects-git/exemples-jspm/jspm-project-es5/src/app/components/account/account.module.js

01 09 2016 13:02:17.449:INFO [Chrome 52.0.2743 (Windows 7 0.0.0)]: Connected on socket /#z8ZLhPfZRdMlq-GfAAAB with id 23750908
Chrome 52.0.2743 (Windows 7 0.0.0): Executed 17 of 17 SUCCESS (0.336 secs / 0.14 secs)

[13:02:20] Finished 'karma:unit.karma' after 6.4 s
[13:02:20] Starting 'test.unit.karma'...
[13:02:20] Finished 'test.unit.karma' after 6.04 μs

I also tried directly with PhantomJS (outside of karma), and it fails with the same error (with better identification on the code location).
In fact, i can reach the url, but if i try to get a screenshot, i get the error:

Potentially unhandled rejection 4 Unable to load dependency http://localhost:8088/jspm_packages/github/systemjs/[email protected]/css.js.

    getModule@http://localhost:8088/jspm_packages/system.src.js:3264:67
    http://localhost:8088/jspm_packages/system.src.js:3308:25
    require@http://localhost:8088/jspm_packages/system.src.js:3994:34


    eval code
    eval@[native code]
    __exec@http://localhost:8088/jspm_packages/system.src.js:1560:18
    execute@http://localhost:8088/jspm_packages/system.src.js:4030:22
    linkDynamicModule@http://localhost:8088/jspm_packages/system.src.js:3304:36
    link@http://localhost:8088/jspm_packages/system.src.js:3139:28
    execute@http://localhost:8088/jspm_packages/system.src.js:3514:17
    doDynamicExecute@http://localhost:8088/jspm_packages/system.src.js:771:32
    link@http://localhost:8088/jspm_packages/system.src.js:969:36
    doLink@http://localhost:8088/jspm_packages/system.src.js:628:11
    updateLinkSetOnLoad@http://localhost:8088/jspm_packages/system.src.js:674:24
    http://localhost:8088/jspm_packages/system.src.js:490:30
    Evaluating http://localhost:8088/jspm_packages/github/systemjs/[email protected]
    Error loading http://localhost:8088/jspm_packages/github/systemjs/[email protected]
    Error loading http://localhost:8088/jspm_packages/github/twbs/[email protected]/css/bootstrap.css!http://localhost:8088/jspm_packages/github/systemjs/[email protected] as "bootstrap/css/bootstrap.css!" from http://localhost:80 88/app/components/account/account.module.js

    http://localhost:8088/jspm_packages/system-polyfills.js:4

@guybedford
Copy link
Member

There are natural browser bugs between environments, so it may well be in user code that this is happening. It just may take some debugging work to get there unfortunately due to the limited source maps support in Safari.

@JSlain
Copy link
Author

JSlain commented Sep 8, 2016

At that moment, no user-code is executed at all.
It crashes as it tries to require() dependencies tree, and fail with bootstrap's css.

Here's what crashes, in PhantomJS:

system.src.js

  var useVm;
  var vm;
  __exec = function(load) {

    if (!load.source)
      return;
    if ((load.metadata.integrity || load.metadata.nonce) && supportsScriptExec)
      return scriptExec.call(this, load);
    try {
      preExec(this, load);
      curLoad = load;
      // global scoped eval for node (avoids require scope leak)
      if (!vm && this._nodeRequire) {
        vm = this._nodeRequire('vm');
        useVm = vm.runInThisContext("typeof System !== 'undefined' && System") === this;
      }
      if (useVm)
        vm.runInThisContext(getSource(load, true), { filename: load.address + (load.metadata.sourceMap ? '!transpiled' : '') });
      else
        (0, eval)(getSource(load, true)); // <-- #### CRASH ####

      postExec();
    }
    catch(e) {
      postExec(); 
      throw addToError(e, 'Evaluating ' + load.address);
    }
  };

getSource(load, true) ==

(function(System, SystemJS) {(function(require, exports, module, __filename, __dirname, global, GLOBAL) {module.exports = require("github:systemjs/[email protected]/css");
}).apply(__cjsWrapper.exports, __cjsWrapper.args);
})(System, System);
//# sourceURL=http://localhost:9876/base/src/jspm_packages/github/systemjs/[email protected]

Any clue?

@guybedford
Copy link
Member

Are you saying that the getSource function itself is failing? So that running console.log(getSource(load, true)) is providing a failure already? i'd be very surprised if that is the case and it's not the exec(getSource(load, true)) part that's failing.

@JSlain
Copy link
Author

JSlain commented Sep 13, 2016

No, i was just outputting the value of getSource(load, true) to help understand what's going on.
You asked some debugging work, I cannot go further.

That means...

exec(

(function(System, SystemJS) {(function(require, exports, module, __filename, __dirname, global, GLOBAL) {module.exports = require("github:systemjs/[email protected]/css");
}).apply(__cjsWrapper.exports, __cjsWrapper.args);
})(System, System);
//# sourceURL=http://localhost:9876/base/src/jspm_packages/github/systemjs/[email protected]

);

... is failling in PhantomJS (only on my side it looks like)

@JSlain
Copy link
Author

JSlain commented Sep 14, 2016 •
edited
Loading

Tried debugging that the entire day.
So far, i've found a difference between Chrome and PhantomJS:

Chrome:

proceedToFetch() load.name= http://localhost:8080/jspm_packages/github/systemjs/[email protected]/css.js
getModule(" http://localhost:8080/jspm_packages/github/systemjs/[email protected]/css.js ", loader);

PhantomJS:

getModule(" http://localhost:8080/jspm_packages/github/systemjs/[email protected]/css.js ", loader);
proceedToFetch() load.name= http://localhost:8080/jspm_packages/github/systemjs/[email protected]/css.js
Potentially unhandled rejection [4] (SystemJS) Unable to load dependency http://localhost:8080/jspm_packages/github/systemjs/[email protected]/css.js.

I think in PhantomJS, it try to use the module before it gets loaded.
I don't fully understand SystemJS code, that's not trivial.

@guybedford guybedford reopened this Sep 23, 2016
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@guybedford @JSlain