Including ECMA 5 script in IE8

Question

Currently, I am using hls.js in my code to play hls streams. The original code is written in ECMA version 6 and then transpiled into ECMA 5 and places in the dist folder (above link). It works perfectly elsewhere.

I don't plan to use any if the functions from the library. I simply want to include it. Rendering it on IE8 gives errors about the syntax.

Is it possible to transpile the js file into a version compatible with IE8 or I should simply find a way to not include the file at all?

EDIT

Following this I tried doing the following:

<html>
<h1> IE test new </h1>

<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-sham.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/json3/3.3.2/json3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.34.2/es6-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.34.2/es6-sham.min.js"></script>
<script src="https://wzrd.in/standalone/es7-shim@latest"></script>

<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.js"></script>

</html>

However, it still gives the following error on IE8:

Expected identifier hls.js, line 320 character 31

EDIT 2

I used the following .babelrc file to transpile it to es3 file and fix some other errors.

{
  "presets": ["es3"],
  "plugins": ["transform-es3-property-literals", "transform-es3-member-expression-literals"]
}

However, now I face the following error on IE8.

  Object doesn't support this property or method  hls.js, line 1063 character 17

The specific error is on the line Object.defineProperty. It seems IE 8 does not support the defineProperty method. Is there a way to fix this.`?

@Xotic750 I tried using https://github.com/es-shims/es5-shim, it still gives errors on IE8. (check the edit) — kosta, Sep 08 '16 at 07:11
@user3288346 You can create `ts` file with typescript and set target to `es3` then ts compiler handles compatibility problems. — Morteza Tourani, Sep 08 '16 at 07:58
Do you get the same error if you use `hls.js` instead of the minimised version. It could be that the minimisation is not IE8 compatible. — Xotic750, Sep 08 '16 at 09:30
I tried the non minified version too, but it gives a similar error. — kosta, Sep 08 '16 at 09:33
What is the error from the non-minimised one? Then I could look at the line in question and try to see the problem. — Xotic750, Sep 08 '16 at 09:46
line 320 `if (exp === fn || exp.default === fn) {` and specifically it complains about `exp.default`, nothing untoward about that code so the problem probably lays somewhere else, in the cache data and however that is created. Unless IE8 has a problem with a property named `default` — Xotic750, Sep 08 '16 at 09:51
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/122895/discussion-between-user3288346-and-xotic750). — kosta, Sep 08 '16 at 09:54

score 0 · Answer 1 · edited Jun 20 '20 at 09:12

0

It looks like old IE has a problem with the property being named default and treats it as a reserved word when used on an object. So to fix the issue you would need to open a ticket with hls and ask them to change it to something different or use it quoted exp['default']

http://jonathonhill.net/2009-11-24/javascript-reserved-words-trigger-expected-identifier-error-on-ie/

But they do state.

Compatibility

hls.js is compatible with browsers supporting MSE with 'video/MP4' inputs. As of today, it is supported on:

Chrome for Android

34+ Chrome for Desktop

34+ Firefox for Android 41+

Firefox for Desktop 42+

IE11+ for Windows 8.1

Safari for Mac 8+ (beta)

I don't know if any transpiler can transpile this into something that is not a problem for old IE. But maybe.

Babel 6.0.20 Modules feature not work in IE8

edited Jun 20 '20 at 09:12

Community

1
1

answered Sep 08 '16 at 10:17

Xotic750

22,914
8
57
79

Or rather use an ES5-to-ES3 transpiler. They exist (e.g. [for Babel](https://www.npmjs.com/package/babel-preset-es3)). No need to change the library. – Bergi Sep 08 '16 at 10:43
I wouldn't expect that they would accept the ticket anyway, as they require Media Source Extensions. I thought that a transpiler would address this old IE issue though, but as I never use one then I could not be sure. :) – Xotic750 Sep 08 '16 at 10:58
Nobody cares about old IE, so ES5 output is the default, but most transpilers possess the ability to create ES3 (it's not that hard). – Bergi Sep 08 '16 at 11:01
@Bergi tried using Babel ES5-to-ES3 transpiler, However, it gives the same error on IE8. – kosta Sep 09 '16 at 07:29

Including ECMA 5 script in IE8

1 Answers1