mar10/fancytree

childcounter elements rendered empty with glyph extension in IE11 on v2.30.1 and newer

tomasz1986 opened this issue · 4 comments

tomasz1986 commented

Expected and Actual Behavior

I haven't been able to narrow the issue to a specific commit yet, but is seems that something broke in between v2.30.0 and v2.30.1.

Counters working on v2.30.0

image

Counters missing completely on v2.30.1

image

Counters present but empty on v2.31.0 and newer.

image

Counters present on v2.31.0 and newer (with glyph disabled)

image

Steps to Reproduce the Problem

I don't have a step-by-step reproducer, unfortunately.

I'm trying to upgrade an old version of fancytree used in Syncthing (see https://github.com/syncthing/syncthing/tree/main/gui/default/vendor/fancytree). Replacing jquery.fancytree-all-deps.js with glyph enabled as follows

extensions: ["glyph"],
glyph: {
    preset: "awesome5",
}

results in the behaviour described above. With the old versions up to v2.30.0, everything works fine. With v2.30.1, the counters are no longer present, and then starting from v2.31.0 the counters are back, but completely empty. I've inspected them with dev tools in the browser, and the actual HTML elements have simply no content in them. The issue seems to affect IE11 only.

I'm going to continue my testings to find out the actual culprit, but I'd just like to ask whether you may have any idea or suggestions what the problem could be about.

Environment

  • Browser type and version: Internet Explorer 11 / Windows 10
  • jQuery and jQuery UI versions: jQuery v2.2.0; using jquery.fancytree-all-deps.js
  • Fancytree version: v2.30.0, v2.30.1, v2.31.0 and newer
    enabled/affected extensions: glyph
tomasz1986 commented

I've gone through the commits between v2.30.0 and v2.30.1, and I can confirm that 453e4d1 is responsible for breaking the code in IE11.

Edit:

Commenting

fancytree/src/jquery.fancytree.glyph.js

Line 197 in 7aa54f7

span.innerHTML = "";

in the current code makes the newest v2.38.0 work correctly in IE11. However, that line was added to supposedly fix #883. Can anything be done to keep the fix and also make the code work in IE11 again?

mar10 commented

Hi Tomasz,
sorry for the late response and thank you for tracking that down!
Feel free to open a PR.

Fontawesome 4 and IE 11 are both a bit outdated, but still in use, so it would be great to keep the old fix as well.
If hope I will find some time to check that soon, but maybe you can help here:

  • Are you using lazy nodes, and if, do you see the bug mentioned in #883 ?
  • what is the content of span.innerHTML before it was reset?
tomasz1986 commented

No problem.

We're not using lazy nodes, hence I didn't actually bother about #883. I only wanted to make the thing work in IE11, to tell the truth 😛. Not the best approach, but Syncthing is a local application, whose GUI needs to be accessed through a Web browser, and it happens that IE11 is the only browser available in systems like Windows Server and such, hence it's kind of important to have everything working there, at least for myself 😉.

I'll try to check the span.innerHTML. My JS skills are kind of lacklustre, so it may take a while though to find out what exactly is going on there 😔.

stale commented

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.