Bug Tracker

Opened 6 years ago

Closed 6 years ago

Last modified 6 years ago

#14938 closed bug (cantfix)

In IE11, prepend fails in popup when containing multiples elements

Reported by: jbdemonte@… Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.11.0
Keywords: Cc:
Blocked by: Blocking:

Description

"prepend" fails in IE 11 when generating dynamic content to a popup in a detached element while "append" works fine

Here is a demo: http://demonte.fr/test_popup_ie/

Works fine in: IE9, Firefox, Safari, Opera and Chrome

In IE11, "append" simply stop the script without rising any error.

Change History (6)

comment:1 Changed 6 years ago by anonymous

Oops, in IE11, it's "prepend" which fails, not "append"

comment:2 Changed 6 years ago by dmethvin

Resolution: cantfix
Status: newclosed

Very strange, if you're in the IE debugger it just halts with an "empty error message" inside domManip but it's not even in the same place each time. I don't see anything wrong in the inputs.

Not much we can do here without knowing the actual problem, I've reported it to Microsoft and can reopen if they suggest a workaround.

comment:3 in reply to:  2 Changed 6 years ago by jbdemonte@…

Replying to dmethvin:

The only workaround I see right now is to wrap the elements set into a div (or another tag) before prepending it.

Where did you report it to microsoft? can you provide the url?

comment:4 Changed 6 years ago by dmethvin

I reported it to our contacts there with a link to this ticket. You could also create a ticket at http://connect.microsoft.com and link it here if you have more info.

comment:6 Changed 6 years ago by jbdemonte@…

Here is a quick workaround I'm going to use:

      (function ($) {
          // if not IE 11
          if (!navigator.userAgent.match(/Trident.*rv[ :]*11\./)) {
              return;
          }

          var prepend = $.fn.prepend;

          $.fn.prepend = function () {
              var args = Array.prototype.slice.call(arguments),
                  self = this;
              $.each(args.reverse(), function (index, elts) {
                  elts = typeof elts === "string" ? $(elts, self[0].ownerDocument) : $(elts);
                  $(elts.get().reverse()).each(function () {
                      prepend.call(self, this);
                  })
              });
              return this;
          }
      }(jQuery));

Limitation:

  • it works for classic string nodes (e.g., "<span>...</span>") and html node (e.g., prepend($("div")) and does not support flat text (e.g., .prepend("ok"))
  • does not works with function as param (.prepend( function(index, html) )

I closed it to IE11 because I have not tested IE10 yet (IE9 works fine)

Demo: http://demonte.fr/test_popup_ie/workaround.html

comment:7 Changed 6 years ago by jbdemonte@…

Note: the problem is also present in IE 10

I've updated my snippet to handle IE 10

      (function ($) {
          var prepend = $.fn.prepend,
              ie11 = !!navigator.userAgent.match(/Trident.*rv[ :]*11\./),
              ie10 = !ie11 && !!navigator.userAgent.match(/MSIE\s10/);

          if (!ie10 && !ie11) {
              return;
          }

          $.fn.prepend = function () {
              var args = Array.prototype.slice.call(arguments),
                  self = this;
              $.each(args.reverse(), function (index, elts) {
                  elts = typeof elts === "string" ? $(elts, self[0].ownerDocument) : $(elts);
                  $(elts.get().reverse()).each(function () {
                      prepend.call(self, this);
                  })
              });
              return this;
          }
      }(jQuery));
Note: See TracTickets for help on using tickets.