Merge pull request #881 from Shopify/fix-firefox-test

Fix firefox testing

src/iframe.js

@@ -6,7 +6,10 @@ import {addClassToElement, removeClassFromElement} from './utils/element-class';
 const iframeStyles = {
   width: '100%',
   overflow: 'hidden',
-  border: 'none',
+  // Firefox for some reason sets 'border: medium' even if we set it to 'border: none'
+  // when using JavaScript to set the style. The workaround is to set individual border styles
+  'border-width': '0',
+  'border-style': 'none',
 };
 
 const iframeAttrs = {
@@ -91,6 +94,7 @@ export default class iframe {
     Object.keys(iframeStyles).forEach((key) => {
       this.el.style[key] = iframeStyles[key];
     });
+
     Object.keys(iframeAttrs).forEach((key) => this.el.setAttribute(key, iframeAttrs[key]));
     this.el.setAttribute('name', config.name);
     this.styleTag = null;

test/unit/iframe.js

@@ -117,11 +117,12 @@ describe('Iframe class', () => {
       assert.calledWith(setWidthStub, constructorConfig.width);
     });
 
-    it('sets width to 100%, overflow to hidden, and border to none in iframe\'s style', () => {
+    it('sets width to 100%, overflow to hidden, borderWidth to 0px and borderStyle to none in iframe\'s style', () => {
       iframe = new Iframe(parent, constructorConfig);
       assert.equal(iframe.el.style.width, '100%');
       assert.equal(iframe.el.style.overflow, 'hidden');
-      assert.include(iframe.el.style.border, 'none');
+      assert.include(iframe.el.style.borderStyle, 'none');
+      assert.include(iframe.el.style.borderWidth, '0px');
     });
 
     it('disables scrolling, allows transparency, and removes border in iframe\'s attributes', () => {
@@ -507,4 +508,4 @@ describe('Iframe class', () => {
       });
     });
   });
-});
+});

testem-ci.json

@@ -3,7 +3,8 @@
     "Chrome"
   ],
   "launch_in_ci": [
-    "Chrome"
+    "Chrome",
+    "Firefox"
   ],
   "framework": "mocha",
   "src_files": "test/build/test.js"

testem.json

@@ -3,7 +3,8 @@
     "Chrome"
   ],
   "launch_in_ci": [
-    "Chrome"
+    "Chrome",
+    "Firefox"
   ],
   "framework": "mocha",
   "src_files": "test/build/test.js"