Does not work with ES6-Promise polyfill

[cheresier]

I am trying to use this plugin in IE11 (as part of developing a non-transpiled Excel add-in, which run in an IE11 frame when used with Office desktop), so I have to rely on a polyfill to make promises work. While no error is thrown, Vue eventually times out trying to load the component. Wondering if there is a simple fix for that and looking forward to being able to use this seemingly awesome plugin.

[edgardleal]

Hi @cheresier , this looks to be an interesting project. Did you tried to increase the value of waitSeconds in requirejs setup ? https://requirejs.org/docs/api.html#config-waitSeconds

[cheresier]

Thank you for your response! Yes, I even set it to 0 to disable timeout altogether.

[edgardleal]

Hi @cheresier , can you post an example of code ?

[cheresier]

Sure! The quickest way to reproduce is to pretty much use your code from the https://github.com/edgardleal/require-vuejs#source-code-example page, but with <script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js"></script> added above the require.js reference.

The polyfill above results in this error:

SCRIPT5022: Load timeout for modules: vue!component_unnormalized2,vue!component http://requirejs.org/docs/errors.html#timeout

I also tried using another polyfill: https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/7.4.3/polyfill.js

In this case the error above is preceded with another one:

All this obviously applies to IE11. I will also add that the polyfill works correctly for other modern scripts I am using in this project (like vuetify)

[racksen]

After long struggling, I used the axios to replace the loadRemote(url) function. It worked in IE11.

[FerdinandPiette]

Hi, I had the same problem on ie11.

It is due to the definition of xhttp.timeout that should be placed after xhttp.open It is explain in MDN : https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/timeout This solve the problem.

return new Promise(function(resolve, reject) {
    var xhttp = new XMLHttpRequest();
    /* // IE11 : dont like timeout here
    xhttp.timeout = (
        (config.waitSeconds || config.timeout) || 3
    ) * 1000;//*/
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState === 4
      && xhttp.status < 400) {
            var result = parse(xhttp.responseText);
            callback(result);
            resolve(result);
        }
    };
    xhttp.ontimeout = function() {
        var error = new Error("Timeout loading: " + path);
        callback({}, error);
        reject(error);
        throw error;
    };
    xhttp.open("GET", path, true);
    //* // Fix ie11 : timeout should be place here
    xhttp.timeout = (
        (config.waitSeconds || config.timeout) || 3
    ) * 1000;//*/
    xhttp.send();
});