commit message

node_modules/popper.js/tests/.jshintrc

@@ -0,0 +1,6 @@
+{
+    "extends":  "../.jshintrc",
+    "jasmine":  true,
+    "debug":    true,
+    "undef":    false
+}

node_modules/popper.js/tests/_helpers.js

@@ -0,0 +1,40 @@
+function appendNewPopper(id, text, container) {
+    var popper = document.createElement('div');
+    popper.id = id;
+    popper.classList.add('popper');
+    popper.textContent = text || 'popper';
+    var arrow = document.createElement('div');
+    arrow.classList.add('popper__arrow');
+    arrow.setAttribute('x-arrow', '');
+    popper.appendChild(arrow);
+    (container || jasmineWrapper).appendChild(popper);
+    return popper;
+}
+function appendNewRef(id, text, container) {
+    var popper = document.createElement('div');
+    popper.id = id;
+    popper.classList.add('ref');
+    popper.textContent = text || 'reference';
+    (container || jasmineWrapper).appendChild(popper);
+    return popper;
+}
+
+
+/**
+ * Get the prefixed supported property name
+ * @function
+ * @ignore
+ * @argument {String} property (camelCase)
+ * @returns {String} prefixed property (camelCase)
+ */
+function getSupportedPropertyName(property) {
+    var prefixes = ['', 'ms', 'webkit', 'moz', 'o'];
+
+    for (var i = 0; i < prefixes.length; i++) {
+        var toCheck = prefixes[i] ? prefixes[i] + property.charAt(0).toUpperCase() + property.slice(1) : property;
+        if (typeof document.body.style[toCheck] !== 'undefined') {
+            return toCheck;
+        }
+    }
+    return null;
+}

node_modules/popper.js/tests/_setup.js

@@ -0,0 +1,19 @@
+var baseTemplate = window.document.body.innerHTML;
+var wrapper = document.createElement('div');
+wrapper.id = 'jasmineWrapper';
+document.body.appendChild(wrapper);
+
+beforeEach(function() {
+    jasmineWrapper.innerHTML = '';
+
+    jasmine.addMatchers({
+        toBeApprox: function() {
+            return {
+                compare: function(actual, expected, within) {
+                    within = within || 1;
+                    return { pass: (actual >= (expected - within)) && (actual <= (expected + within)) };
+                }
+            };
+        }
+    });
+});

node_modules/popper.js/tests/styles/test.css

@@ -0,0 +1,84 @@
+#rel {
+    position: absolute;
+    color: black;
+    background: yellow;
+    top: 40vh;
+    left: 50vw;
+    padding: 30px;
+}
+
+#theEvilBoundary {
+    position: absolute;
+    top: 300px;
+    left: 100px;
+    background: red;
+    padding: 200px;
+}
+
+#thePopper3 {
+    height: 200px;
+}
+.ref {
+    display: inline-block;
+    background: red;
+    padding: 10px;
+}
+.popper {
+    background: #222;
+    color: white;
+    width: 150px;
+    border-radius: 2px;
+    box-shadow: 0 0 2px rgba(0,0,0,0.5);
+    padding: 5px;
+}
+.popper .popper__arrow {
+    width: 0;
+    height: 0;
+    border-style: solid;
+    position: absolute;
+    margin: 5px;
+}
+.popper[x-placement^="top"] {
+    margin-bottom: 5px;
+}
+.popper[x-placement^="top"] .popper__arrow {
+    border-width: 5px 5px 0 5px;
+    border-color: #222 transparent transparent transparent;
+    bottom: -5px;
+    left: calc(50% - 5px);
+    margin-top: 0;
+    margin-bottom: 0;
+}
+.popper[x-placement^="bottom"] {
+    margin-top: 5px;
+}
+.popper[x-placement^="bottom"] .popper__arrow {
+    border-width: 0 5px 5px 5px;
+    border-color: transparent transparent #222 transparent;
+    top: -5px;
+    left: calc(50% - 5px);
+    margin-top: 0;
+    margin-bottom: 0;
+}
+.popper[x-placement^="right"] {
+    margin-left: 5px;
+}
+.popper[x-placement^="right"] .popper__arrow {
+    border-width: 5px 5px 5px 0;
+    border-color: transparent #222 transparent transparent;
+    left: -5px;
+    top: calc(50% - 5px);
+    margin-left: 0;
+    margin-right: 0;
+}
+.popper[x-placement^="left"] {
+    margin-right: 5px;
+}
+.popper[x-placement^="left"] .popper__arrow {
+    border-width: 5px 0 5px 5px;
+    border-color: transparent transparent transparent #222;
+    right: -5px;
+    top: calc(50% - 5px);
+    margin-left: 0;
+    margin-right: 0;
+}

node_modules/popper.js/tests/test-popper.js

@@ -0,0 +1,470 @@
+describe('Popper.js', function() {
+    // define modules paths
+    require.config({
+        paths: {
+            popper: 'base/src/popper'
+        }
+    });
+
+    var TestPopper;
+
+    it('loads the AMD module', function(done) {
+        require(['popper'], function(Popper) {
+            TestPopper = Popper;
+            expect(Popper).toBeDefined();
+            done();
+        });
+    });
+
+    it('can access the AMD module to create a new instance', function() {
+        // append popper element
+        var popper = document.createElement('div');
+        popper.style.width = '100px';
+        popper.style.height = '100px';
+        jasmineWrapper.appendChild(popper);
+
+        // append trigger element
+        var trigger = document.createElement('div');
+        jasmineWrapper.appendChild(trigger);
+
+        // initialize new popper instance
+        var pop = new TestPopper(trigger, popper);
+
+        expect(pop).toBeDefined();
+    });
+
+    it('inits a bottom popper', function() {
+        var reference = appendNewRef(1);
+        var popper    = appendNewPopper(2);
+
+        var pop = new TestPopper(reference, popper);
+
+        var top = popper.getBoundingClientRect().top;
+        expect(top).toBeApprox(51);
+
+        pop.destroy();
+    });
+
+    it('inits a bottom-start popper', function(done) {
+        var reference = appendNewRef(1);
+        reference.style.marginLeft = '200px';
+        var popper    = appendNewPopper(2);
+
+        var pop = new TestPopper(reference, popper, {placement: 'bottom-start'}).onCreate(function() {
+            expect(popper.getBoundingClientRect().left).toBeApprox(reference.getBoundingClientRect().left);
+            pop.destroy();
+            done();
+        });
+    });
+
+    it('inits a right popper', function(done) {
+        var reference = appendNewRef(1);
+        var popper    = appendNewPopper(2);
+
+        new TestPopper(reference, popper, {
+            placement: 'right'
+        }).onCreate(function(pop) {
+            var left    = popper.getBoundingClientRect().left;
+            var local   = 92;
+            var ci      = 110;
+            expect([local, ci]).toContain(left);
+
+            pop.destroy();
+            done();
+        });
+
+    });
+
+    it('inits a popper inside a scrolling div, contained in a relative div', function(done) {
+        var relative = document.createElement('div');
+        relative.style.height = '800px';
+        relative.style.width = '800px';
+        jasmineWrapper.appendChild(relative);
+
+        var scrolling = document.createElement('div');
+        scrolling.style.width = '800px';
+        scrolling.style.height = '800px';
+        scrolling.style.overflow = 'auto';
+        relative.appendChild(scrolling);
+
+        var superHigh = document.createElement('div');
+        superHigh.style.width = '800px';
+        superHigh.style.height = '1600px';
+        scrolling.appendChild(superHigh);
+
+        var ref = appendNewRef(1, 'ref', superHigh);
+        var popper = appendNewPopper(2, 'popper', superHigh);
+
+        scrolling.scrollTop = 500;
+        new TestPopper(ref, popper).onCreate(function(pop) {
+            var top = popper.getBoundingClientRect().top;
+            expect(top).toBeApprox(-449);
+            pop.destroy();
+            done();
+        });
+
+    });
+
+    it('inits a popper inside a body, with its reference element inside a relative div', function(done) {
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        jasmineWrapper.appendChild(relative);
+
+        var ref = appendNewRef(1, 'ref', relative);
+        var popper = appendNewPopper(2, 'popper');
+
+        new TestPopper(ref, popper).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().top).toBeApprox(63);
+            expect(popper.getBoundingClientRect().left).toBeApprox(5);
+            pop.destroy();
+            done();
+        });
+
+    });
+
+    it('inits a popper inside a scrolled body, with its reference element inside a relative div', function(done) {
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        relative.style.height = '300vh';
+        jasmineWrapper.appendChild(relative);
+        document.body.scrollTop = 800;
+
+        var ref = appendNewRef(1, 'ref', relative);
+        ref.style.marginTop = '200px';
+        var popper = appendNewPopper(2, 'popper');
+
+        new TestPopper(ref, popper).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().top).toBeApprox(-800 + 263);
+            expect(popper.getBoundingClientRect().left).toBeApprox(5);
+            pop.destroy();
+            done();
+        });
+    });
+
+    it('inits a popper inside a scrolled body, with its reference element inside a scrolling div, wrapped in a relative div', function(done) {
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        relative.style.height = '200vh';
+        jasmineWrapper.appendChild(relative);
+        document.body.scrollTop = 800;
+
+        var scrolling = document.createElement('div');
+        scrolling.style.width = '800px';
+        scrolling.style.height = '800px';
+        scrolling.style.overflow = 'auto';
+        relative.appendChild(scrolling);
+
+        var superHigh = document.createElement('div');
+        superHigh.style.width = '800px';
+        superHigh.style.height = '1600px';
+        scrolling.appendChild(superHigh);
+
+        scrolling.scrollTop = 500;
+
+        var ref = appendNewRef(1, 'ref', scrolling);
+        ref.style.marginTop = '200px';
+        var popper = appendNewPopper(2, 'popper');
+
+        new TestPopper(ref, popper).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().top).toBeApprox(ref.getBoundingClientRect().bottom + 5);
+            expect(popper.getBoundingClientRect().left).toBeApprox(5);
+            pop.destroy();
+            done();
+        });
+    });
+
+    it('inits a popper near a reference element, both inside a fixed element, inside a scrolled body', function(done) {
+        var fixed = document.createElement('div');
+        fixed.style.position = 'fixed';
+        fixed.style.margin = '20px';
+        fixed.style.height = '50px';
+        fixed.style.width = '100%';
+        jasmineWrapper.appendChild(fixed);
+
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        relative.style.height = '200vh';
+        jasmineWrapper.appendChild(relative);
+        document.body.scrollTop = 800;
+
+        var ref = appendNewRef(1, 'ref', fixed);
+        var popper = appendNewPopper(2, 'popper', fixed);
+
+        new TestPopper(ref, popper).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().top).toBeApprox(83);
+            expect(popper.getBoundingClientRect().left).toBeApprox(5);
+            pop.destroy();
+            done();
+        });
+    });
+
+    it('inits a popper near a reference element, both inside a fixed element with CSS transforms, inside a scrolled body', function(done) {
+        var fixed = document.createElement('div');
+        fixed.style.position = 'fixed';
+        fixed.style.margin = '20px';
+        fixed.style.height = '50px';
+        fixed.style.width = '100%';
+        fixed.style.transform = 'translateX(0)';
+        jasmineWrapper.appendChild(fixed);
+
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        relative.style.height = '200vh';
+        jasmineWrapper.appendChild(relative);
+        document.body.scrollTop = 800;
+
+        var ref = appendNewRef(1, 'ref', fixed);
+        var popper = appendNewPopper(2, 'popper', fixed);
+
+        new TestPopper(ref, popper).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().top).toBeApprox(83);
+            expect(popper.getBoundingClientRect().left).toBeApprox(33);
+            pop.destroy();
+            done();
+        });
+    });
+
+    it('inits a popper near a reference element, both inside a fixed element on bottom of viewport, inside a scrolled body', function(done) {
+        var fixed = document.createElement('div');
+        fixed.style.position = 'fixed';
+        fixed.style.bottom = '0';
+        fixed.style.height = '38px';
+        fixed.style.width = '100%';
+        jasmineWrapper.appendChild(fixed);
+
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        relative.style.height = '200vh';
+        jasmineWrapper.appendChild(relative);
+        document.body.scrollTop = 800;
+
+        var ref = appendNewRef(1, 'ref', fixed);
+        var popper = appendNewPopper(2, 'popper', fixed);
+
+        new TestPopper(ref, popper, { placement: 'top' }).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().bottom + 5).toBeApprox(ref.getBoundingClientRect().top);
+            expect(popper.getBoundingClientRect().left).toBeApprox(5);
+            expect(popper.getAttribute('x-placement')).toBe('top');
+            pop.destroy();
+            done();
+        });
+    });
+
+    it('inits a popper and destroy it using its callback', function(done) {
+        var reference = appendNewRef(1);
+        var popper    = appendNewPopper(2);
+
+        new TestPopper(reference, popper).onCreate(function(pop) {
+            pop.destroy();
+            expect(popper.style.top).toBe('');
+            done();
+        });
+    });
+
+    it('creates a popper using the default configuration', function(done) {
+        var reference = appendNewRef(1);
+
+        new TestPopper(reference).onCreate(function(instance) {
+            expect(document.querySelectorAll('.popper').length).toBe(1);
+            document.body.removeChild(instance._popper);
+            instance.destroy();
+            done();
+        });
+    });
+
+    it('creates a popper using a custom configuration', function(done) {
+        var reference = appendNewRef(1);
+
+        new TestPopper(reference, {
+            content: 'something'
+        }).onCreate(function(instance) {
+            expect(instance._popper.innerText).toBe('something');
+            document.body.removeChild(instance._popper);
+            instance.destroy();
+            done();
+        });
+    });
+
+    it('creates a popper and sets an onUpdate callback', function(done) {
+        var reference = appendNewRef(1);
+
+        var pop = new TestPopper(reference, {content: 'react'}, {
+            modifiersIgnored: ['applyStyle']
+        }).onUpdate(function(data) {
+            expect(data.offsets.popper.top).toBeApprox(46);
+            document.body.removeChild(data.instance._popper);
+            data.instance.destroy();
+            done();
+        });
+
+        window.setTimeout(function() {
+            pop.update();
+            // simulates update
+            window.dispatchEvent(new Event('resize'));
+        }, 3000);
+    });
+
+    it('creates a popper when content is undefined', function(done) {
+        var reference = appendNewRef(1);
+
+        new TestPopper(reference).onCreate(function(instance) {
+            expect(instance._popper).toBeDefined();
+            expect(instance._popper.innerText).toBe('');
+            document.body.removeChild(instance._popper);
+            instance.destroy();
+            done();
+        });
+    });
+
+    it('creates a popper with an empty form as parent, then auto remove it on destroy', function(done) {
+        var form = document.createElement('form');
+        var reference = appendNewRef(1, 'ref', form);
+        jasmineWrapper.appendChild(form);
+
+        new TestPopper(reference, { parent: form, content: 'test'}, { removeOnDestroy: true }).onCreate(function(instance) {
+            expect(instance._popper).toBeDefined();
+            expect(instance._popper.innerText).toBe('test');
+            instance.destroy();
+            expect(document.contains(instance._popper)).toBeFalsy();
+            done();
+        });
+    });
+
+    it('creates a popper with a not empty form as parent, then auto remove it on destroy', function(done) {
+        var form = document.createElement('form');
+        var input = document.createElement('input');
+        form.appendChild(input);
+        var reference = appendNewRef(1, 'ref', form);
+        jasmineWrapper.appendChild(form);
+
+        new TestPopper(reference, { parent: form, content: 'test'}, { removeOnDestroy: true }).onCreate(function(instance) {
+            expect(instance._popper).toBeDefined();
+            expect(instance._popper.innerText).toBe('test');
+            instance.destroy();
+            expect(document.contains(instance._popper)).toBeFalsy();
+            done();
+        });
+    });
+
+    it('creates a popper and make sure it\'s position is correct on init', function(done) {
+        var reference = appendNewRef(1);
+
+        new TestPopper(
+            reference,
+            { content: 'popper', classNames: ['none'] },
+            { placement: 'right', removeOnDestroy: true }
+        ).onCreate(function(instance) {
+            instance.update();
+            var local = 87;
+            var ci = 105;
+            expect([local, ci]).toContain(instance._popper.getBoundingClientRect().left);
+            instance.destroy();
+            done();
+        });
+    });
+
+    it('inits a popper inside a scrolled body, with its reference element inside a scrolling div, wrapped in a relative div', function(done) {
+        var relative = document.createElement('div');
+        relative.style.position = 'relative';
+        relative.style.margin = '20px';
+        relative.style.height = '200vh';
+        relative.style.paddingTop = '100px';
+        relative.style.backgroundColor = 'yellow';
+        jasmineWrapper.appendChild(relative);
+        document.body.scrollTop = 100;
+
+        var scrolling = document.createElement('div');
+        scrolling.style.width = '100%';
+        scrolling.style.height = '100vh';
+        scrolling.style.overflow = 'auto';
+        scrolling.style.backgroundColor = 'green';
+        relative.appendChild(scrolling);
+
+        var superHigh = document.createElement('div');
+        superHigh.style.width = '1px';
+        superHigh.style.float = 'right';
+        superHigh.style.height = '300vh';
+        scrolling.appendChild(superHigh);
+
+        scrolling.scrollTop = 100;
+
+        var ref = appendNewRef(1, 'ref', scrolling);
+        ref.style.width = '100px';
+        ref.style.height = '100px';
+        ref.style.marginTop = '100px';
+        var popper = appendNewPopper(2, 'popper', scrolling);
+
+        new TestPopper(ref, popper, { placement: 'right-start', boundariesElement: scrolling }).onCreate(function(pop) {
+            expect(popper.getBoundingClientRect().top).toBeApprox(ref.getBoundingClientRect().top + 5);
+            expect(popper.getBoundingClientRect().left).toBeApprox(153);
+
+            pop.destroy();
+            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(543);
+            instance.destroy();
+            done();
+        });
+    });
+
+    it('creates a popper with a custom modifier that should hide it', function(done) {
+        var reference = appendNewRef(1);
+        var popper    = appendNewPopper(2);
+
+        function hidePopper(data) {
+            data.styles.display = 'none';
+            return data;
+        }
+
+        var options = {
+            modifiers: [hidePopper, 'applyStyle'],
+        };
+
+        new TestPopper(reference, popper, options).onCreate(function(pop) {
+            expect(popper.style.display).toBe('none');
+            pop.destroy();
+            done();
+        });
+    });
+
+
+    it('creates a popper with a custom modifier that set its top to 3px', function(done) {
+        var reference = appendNewRef(1);
+        var popper    = appendNewPopper(2);
+
+        function hidePopper(data) {
+            data.styles.top = '3px';
+            return data;
+        }
+
+        var options = {
+            modifiers: [hidePopper, 'applyStyle'],
+        };
+
+        new TestPopper(reference, popper, options).onCreate(function(pop) {
+            expect(popper.style.top).toBe('3px');
+            pop.destroy();
+            done();
+        });
+    });
+});

node_modules/popper.js/tests/test.html

@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+.target {
+  background:#ff0000;
+  width:50px;
+  height:50px;
+  border:1px solid red;
+}
+
+.popper {
+  background:yellow;
+  width:120px;
+  height:120px;
+}
+
+.scrollable {
+  width:400px;
+  height:300px;
+  overflow:auto;
+  border:1px solid red;
+}
+
+.scrollable-for-scroll {
+  content:" ";
+  height:100px;
+  width:200px;
+  border:1px solid red;
+}
+
+</style>
+</head>
+<body>
+    <div class="scrollable" id="boundaries">
+      <div class="scrollable-for-scroll">some content before</div>
+      <div class="target"></div>
+      <div class="popper">test popper</div>
+     <div class="scrollable-for-scroll" style="height:500px">some content after</div>
+    </div>
+
+    <script src="../src/popper.js"></script>
+    <script>
+    var reference = document.querySelector('.target');
+    var popperElem = document.querySelector('.popper');
+    var thePopper = new Popper(
+        reference,
+        popperElem,
+        {
+            placement: 'right',
+            boundariesElement: boundaries
+        }
+    );
+
+    </script>
+</body>
+</html>