Merge branch 'rosskevin#feature-allow-text-html-node'

floating-ui · May 1, 2016 · 201636a · 201636a
2 parents 9503e09 + 9e06200
commit 201636a
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/src/popper.js b/src/popper.js
@@ -87,8 +87,8 @@
      * @param {Array} [popper.classNames=['popper']] Array of classes to apply to the generated popper.
      * @param {Array} [popper.attributes] Array of attributes to apply, specify `attr:value` to assign a value to it.
      * @param {HTMLElement|String} [popper.parent=window.document.body] The parent element, given as HTMLElement or as query string.
-     * @param {String} [popper.content=''] The content of the popper, it can be text or HTML, in case of HTML, enable `allowHtml`.
-     * @param {Boolean} [popper.allowHtml=false] If set to true, the `content` will be parsed as HTML.
+     * @param {String} [popper.content=''] The content of the popper, it can be text, html, or node; if it is not text, set `contentType` to `html` or `node`.
+     * @param {String} [popper.contentType='text'] If `html`, the `content` will be parsed as HTML. If `node`, it will be appended as-is.
      * @param {String} [popper.arrowTagName='div'] Same as `popper.tagName` but for the arrow element.
      * @param {Array} [popper.arrowClassNames='popper__arrow'] Same as `popper.classNames` but for the arrow element.
      * @param {String} [popper.arrowAttributes=['x-arrow']] Same as `popper.attributes` but for the arrow element.
@@ -276,7 +276,7 @@
             attributes: [],
             parent: root.document.body,
             content: '',
-            allowHtml: false,
+            contentType: 'text',
             arrowTagName: 'div',
             arrowClassNames: [ 'popper__arrow' ],
             arrowAttributes: [ 'x-arrow']
@@ -288,7 +288,9 @@
         var popper = d.createElement(config.tagName);
         addClassNames(popper, config.classNames);
         addAttributes(popper, config.attributes);
-        if (config.allowHtml) {
+        if (config.contentType === 'node') {
+            popper.appendChild(config.content.jquery ? config.content[0] : config.content);
+        }else if (config.contentType === 'html') {
             popper.innerHTML = config.content;
         } else {
             popper.textContent = config.content;

diff --git a/tests/test-popper.js b/tests/test-popper.js
@@ -343,4 +343,22 @@ describe('Popper.js', function() {
             done();
         });
     });
+
+    it('creates a popper with an HTML node as content', function(done) {
+        var reference = appendNewRef(1);
+        reference.style.marginLeft = '700px';
+        var popperContent = document.createElement('div');
+        popperContent.style.width = '700px';
+        popperContent.innerText = 'popper';
+
+        new TestPopper(
+            reference,
+            { contentType: 'node', content: popperContent },
+            { placement: 'left', removeOnDestroy: true }
+        ).onCreate(function(instance) {
+            expect(instance._popper.getBoundingClientRect().left).toBe(548);
+            instance.destroy();
+            done();
+        });
+    });
 });