fix ie markup render bug

CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## 4.8.1
+
+- Fix IE issue where adding markup would not work.
+
+
 ## 4.8.0
 
 - Add `prepareFile` and `prepareFiles` methods to the FilePond instance, use to request output files of the current items in the files list.

dist/filepond.css

@@ -1,5 +1,5 @@
 /*!
- * FilePond 4.8.0
+ * FilePond 4.8.1
  * Licensed under MIT, https://opensource.org/licenses/MIT/
  * Please visit https://pqina.nl/filepond/ for details.
  */

dist/filepond.esm.js

@@ -1,5 +1,5 @@
 /*!
- * FilePond 4.8.0
+ * FilePond 4.8.1
  * Licensed under MIT, https://opensource.org/licenses/MIT/
  * Please visit https://pqina.nl/filepond/ for details.
  */
@@ -188,6 +188,12 @@ const removeChildView = (parent, childViews) => view => {
   return view;
 };
 
+const testElement = createElement('svg');
+const getChildCount =
+  'children' in testElement
+    ? el => el.children.length
+    : el => el.childNodes.length;
+
 const getViewRect = (elementRect, childViews, offset, scale) => {
   const left = offset[0] || elementRect.left;
   const top = offset[1] || elementRect.top;
@@ -1178,7 +1184,7 @@ const createView =
     });
 
     // append created child views to root node
-    const childCount = element.children.length; // need to know the current child count so appending happens in correct order
+    const childCount = getChildCount(element); // need to know the current child count so appending happens in correct order
     childViews.forEach((child, index) => {
       internalAPI.appendChild(child.element, childCount + index);
     });

dist/filepond.js

@@ -1,5 +1,5 @@
 /*!
- * FilePond 4.8.0
+ * FilePond 4.8.1
  * Licensed under MIT, https://opensource.org/licenses/MIT/
  * Please visit https://pqina.nl/filepond/ for details.
  */
@@ -230,6 +230,16 @@
     };
   };
 
+  var testElement = createElement('svg');
+  var getChildCount =
+    'children' in testElement
+      ? function(el) {
+          return el.children.length;
+        }
+      : function(el) {
+          return el.childNodes.length;
+        };
+
   var getViewRect = function getViewRect(
     elementRect,
     childViews,
@@ -1361,7 +1371,7 @@
         });
 
         // append created child views to root node
-        var childCount = element.children.length; // need to know the current child count so appending happens in correct order
+        var childCount = getChildCount(element); // need to know the current child count so appending happens in correct order
         childViews.forEach(function(child, index) {
           internalAPI.appendChild(child.element, childCount + index);
         });

package.json

@@ -1,6 +1,6 @@
 {
     "name": "filepond",
-    "version": "4.8.0",
+    "version": "4.8.1",
     "description": "FilePond, Where files go to stretch their bits.",
     "license": "MIT",
     "author": {

src/js/app/frame/createView.js

@@ -3,6 +3,7 @@ import { createElement } from './utils/createElement';
 import { appendChild } from './utils/appendChild';
 import { appendChildView } from './utils/appendChildView';
 import { removeChildView } from './utils/removeChildView';
+import { getChildCount } from './utils/getChildCount';
 import { getViewRect } from './utils/getViewRect';
 import { Mixins } from './mixins/index';
 import { updateRect } from './utils/updateRect';
@@ -312,7 +313,7 @@ export const createView =
             });
 
             // append created child views to root node
-            const childCount = element.children.length; // need to know the current child count so appending happens in correct order
+            const childCount = getChildCount(element); // need to know the current child count so appending happens in correct order
             childViews.forEach((child, index) => {
                 internalAPI.appendChild(child.element, childCount + index);
             });

src/js/app/frame/utils/getChildCount.js

@@ -0,0 +1,3 @@
+import { createElement } from './createElement';
+const testElement = createElement('svg');
+export const getChildCount = 'children' in testElement ? el => el.children.length : el => el.childNodes.length;