Semanticmediawiki: Close of any open tooltips fails on IE

[SbstnS]

Setup and configuration

• SMW version: 3.1.5
• MW version: 1.31.6
• PHP version: 7.2
• Browser version: Internet Explorer 11

Issue

Syntax error in browser console:

document.querySelectorAll( '.tippy-popper' ).forEach(popper => {
  if ( popper !== tip.popper ) {
    popper._tippy.smw.wasClicked = true;
    popper._tippy.hide()
  }
} );

The error only appears in IE!
As described on developer.mozilla.org (https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach#Browser_Compatibility),
forEach on NodeList object is not compatible with IE.

Stack trace

The error is caused by the forEach function on '.tippy-popper' you can find here:
https://github.com/SemanticMediaWiki/SemanticMediaWiki/blob/master/res/smw/util/smw.tippy.js#L141

Steps to reproduce

_Create wiki page with the following content._

{{#info: Text to be shown in a bubble. }}
{{#info: Text to be shown in a bubble 2. }}

Now move the mouse over the two tooltips. After you have moved over the second tooltip, the first one should close automatically. To reproduce the actual behaviour you can do the same with Google Chrome.

[mwjames]

The error only appears in IE!
forEach on NodeList object is not compatible with IE.

We only support modern browsers that include support for those constructs as above. If the "Internet Explorer 11" (officially released on October 17, 2013) [0] doesn't support that language construct then it is not supported and is not categorized as "modern".

Feel free to provide a polyfill that doesn't impair the existing solution in terms of performance, readability, and platform support.

[0] https://en.wikipedia.org/wiki/Internet_Explorer_11

[akuckartz]

We only support modern browsers ...

Is that documented somewhere?

[mwjames]

Is that documented somewhere?

I don't know maybe, feel free to add a note to [0].

Anyway, if something isn't supported or is missing then people can send a PR and provide a fix otherwise functionality is provided as-is.

[0] https://www.semantic-mediawiki.org

[mwjames]

As to what "modern" entails, since the project has not the means (we are not the WMF) and resources to test any specific browsers (incl. CI and setup) in regards to supported JS I would define "modern" as something that works on any recent Chrome and Firefox browser.

As for MS users, given that MS Edge "... is based on Chromium ..." [0] it should provide those users with similar functionality as the Chrome browser in terms of the underlying JS engine.

If for some reason enterprise users still rely on IE then those users can request help from professional services to help them mitigate issues that arise due to some JS language incompatibilities.

[0] https://support.microsoft.com/en-us/help/4501095/download-the-new-microsoft-edge-based-on-chromium

[akuckartz]

... I would define "modern" as something that works on any recent Chrome and Firefox browser.

:+1:

[kghbln]

The shocking thing here is that so called "enterprise users" still use IE and sometimes this is even their only option. Just this week I had such a case and you would not believe it: in Central Europe.

[mwjames]

@SbstnS Do you want (or plan) to add a poly-fill for this?

[SbstnS]

Currently I am very busy but as soon as I find the time I can take a look at it. If anyone else would like to take on the problem then I would also appreciate it!

[akuckartz]

Microsoft deprecates using Microsoft Teams with IE: https://techcommunity.microsoft.com/t5/microsoft-365-blog/microsoft-365-apps-say-farewell-to-internet-explorer-11-and/ba-p/1591666