Search code examples
javascriptwebpackgetinternet-explorer-11

GET result was undefined/null in IE11, until a change was made to webpack file. Any ideas why?


I'm making multiple GET requests within a project and all of them were fine in IE11 except for a particular call.

The error was something like: Unable to get property X of undefined or null reference. Expanding the error mentioned anonymous functions.

I readjusted my webpack.test.js file (I realized it had been changed) and I brought back a block of code. Doing this caused the request to run properly.

module.exports = merge({
    entry: {
      '/SiteAssets/scripts/somefile': './src/index.js'
    }
  },
  common, {
   mode: 'production',
   devtool: 'cheap-module-eval-source-map', // This line and the devServer block were brought back
   devServer: {
     contentBase: './dist',
     compress: true,
     historyApiFallback: false
   },                                      // 
   stats: {
      colors: false,
      hash: true,
      timings: true,
      assets: true,
      chunks: true,
      chunkModules: true,
      modules: true,
      children: true,
   }
  }
);

Any ideas as to why this worked? I've been trying to think of reasons why, but I haven't had any luck. I'm interested in finding out so I can avoid it in the future, if possible.


Solution

  • I did some debugging with a more experienced dev, and although commenting out the code from the webpack file did work, it didn't tackle the root of the problem.

    In the code below, it appeared that there was a timing delay with getRandomInt(), to where IE11 was too slow. The issue was resolved by "slowing down" the code with two console.logs.

    function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; }
    
    async function loadCommunityArticle(issueID) {
        axios.get(`${_something}/news/_api/lists/GetByTitle('News')/Items?$select=ID,Created,OtherThings&orderby=ID desc&$top=50`, restHeaders)
            .then(resp => {
                let _data = resp.data.d.results;
                if(_data && _data.length > 0) {
                    let rand = getRandomInt(0, _data.length - 1);
                        console.log(rand);
                    let item = _data[rand];
                        console.log(item);
    // other code
    

    After making the changes, the request hasn't failed in IE since.