Storyline 3 compatibility with I.E.8, particularly javaScript message "Object doesn't support this property or method"

Dec 17, 2019

Chris Clift
By Chris Clift

Hi Gurus

Here's a challenge for you! I have a client (big corporate/Government....lots of legacy security issues, air-gapped machines, paranoia about upgrading etc) who is running IE8! Yep, I know, 'get them to upgrade!' your saying. But due to the issues listed above, currently, there is more of a chance of seeing pigs fly.

Anyway. I have been asked to refresh a largish CBT project adding in some features and taking out others. I have managed to build something that works fine is all current browsers (although I haven't yet tested Safari, but they don't use Macs anyway). The problem is it doesn't work in IE8. I suspect it may be purely because Storyline 3 now generates code that simply isn't compatible with IE8, but I'm not sure of this. The issue seems to be related to a check to see what browser is being used, particularly related to Edge. The offending code is below

Can anyone shed any light on this one please as I'm kind of stuck on which way to go now.   Thanks.

Error is : -

Object doesn't support this property or method story.html, line 135 character 29

Offending line is: -

gl = canv.getContext('webgl') || canv.getContext('experimental-webgl');

Full code section for completeness is : -

132             isEdge: function() {
133                 var hasGlCapability = (function() {
134                          var canv = document.createElement('canvas'),
135                                        gl = canv.getContext('webgl') || canv.getContext('experimental-webgl');
136                         canv = null;
137                         return gl != null;
138                         }());
139                   return window.MSBlobBuilder != null && window.msCrypto == null && hasGlCapability;
140             }
141            };

 

 

4 Replies
Lee Nielsen
over 3 years ago11/25/20 at 9:17 pm (UTC)

Hi Chris, sorry this might be a bit late but it may help someone else -  I had exactly the same situation and error,  I was able to combat this issue by ensuring the lesson is not being pull up through my clients Intro page that used HTML frames (storyline was being opened/called within the clients custom html frame menu, and that custom HTML menu was built/targeted for IE8.

We use IE 11 browser but all exisiting content is era'd for IE 8  - that gives us some room for moving.

Clients exising HTML system predominantly has this embedded in all the <head> meta tags :

<meta http-equiv="x-ua-compatible content="IE=8">

 Storyline by default adds to all its published HTML files: 

<meta http-equiv="x-ua-compatible content="IE=Edge">

 

So effectivly the clients old frameset menu with old meta tags was taking over the storyline metatags compatabilty.

Option A: Open Storlyline files outside the custom client menu frameset eg: <a href="# target="_blank">... breaks out of frames and loads as intended.

Option B: Place the older IE into Compatibilty Mode on all end-user PCs and ensure you open the Storyline file using the /story_html5.html file and not the story.html file.

Lee Nielsen
over 3 years ago11/25/20 at 9:30 pm (UTC)

Failing that, and as Phil mentioned IE8 only supports FLASH (now redundant) and does not support the <canvas> tags as required by HTML5 and Storyline.

A quick Google search will produce some Javascript libraries for Polyfilling modern <canvas> tags in older browsers (IE8) -  it can be a simple as adding reference to a single js script in your header tag of the /story.html or /story_html5.html file

<script src='js/canvas-5-polyfill/canvas.js' type='text/javascript'></script>

There is many to test/try/choose from just do your research before your select one as they are older now / not really maintained anymore and vuneralble to security exploits (this is fine if your running elearning on a small internal network) not good if using on the open web.

 

This discussion is closed. You can start a new discussion or contact Articulate Support.