Moving viewport over to queryselector

GoogleChrome · Mar 24, 2016 · f0b1e1c · f0b1e1c
1 parent ff8affc
commit f0b1e1c
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 15 deletions.
diff --git a/test/audits/html/theme-colors.js b/test/audits/html/theme-colors.js
@@ -47,6 +47,13 @@ describe('HTML: theme-color audit', () => {
     return assert.equal(Audit.audit({}).value, false);
   });
 
+  it('fails when invalid HTML and window given', () => {
+    return assert.equal(Audit.audit({
+      window: null,
+      html: null
+    }).value, false);
+  });
+
   it('fails when no theme-color is present in the html', () => {
     return assert.equal(Audit.audit(getMockHtml()).value, false);
   });

diff --git a/test/audits/mobile-friendly/viewport.js b/test/audits/mobile-friendly/viewport.js
@@ -21,35 +21,68 @@ const assert = require('assert');
 // Need to disable camelcase check for dealing with background_color.
 /* eslint-disable camelcase */
 describe('Mobile-friendly: viewport audit', () => {
+  const getMockHtml = (headInsert, bodyInsert) => {
+    headInsert = headInsert || '';
+    bodyInsert = bodyInsert || '';
+
+    const htmlString = `<!doctype html>
+      <html>
+        <head>
+          ${headInsert}
+          <title>Sample page</title>
+        </head>
+        <body>
+          ${bodyInsert}
+        </body>
+      </html>`;
+
+    const jsdom = require('jsdom').jsdom;
+    const doc = jsdom(htmlString);
+
+    return {
+      window: doc.defaultView,
+      html: htmlString
+    };
+  };
+
   it('fails when no input present', () => {
     return assert.equal(Audit.audit({}).value, false);
   });
 
-  it('fails when invalid HTML given', () => {
+  it('fails when invalid HTML and window given', () => {
     return assert.equal(Audit.audit({
+      window: null,
       html: null
     }).value, false);
   });
 
   it('fails when HTML does not contain a viewport meta tag', () => {
-    return assert.equal(Audit.audit({
-      html: ''
-    }).value, false);
+    return assert.equal(Audit.audit(getMockHtml()).value, false);
+  });
+
+  it('fails when a viewport is in the body', () => {
+    return assert.equal(Audit.audit(
+      getMockHtml('', '<meta name="viewport" content="width=device-width">')
+    ).value, false);
+  });
+
+  it('fails when multiple viewports defined', () => {
+    return assert.equal(Audit.audit(
+      getMockHtml(`<meta name="viewport" content="width=device-width">
+      <meta name="viewport" content="width=device-width">`)
+    ).value, false);
   });
 
   it('passes when a viewport is provided', () => {
-    return assert.equal(Audit.audit({
-      html: `<!doctype html>
-             <html>
-             <head>
-               <meta name="viewport" content="width=device-width">
-               <title>Sample page</title>
-             </head>
-             <body></body>
-             </html>`
-    }).value, true);
+    return assert.equal(Audit.audit(
+      getMockHtml('<meta name="viewport" content="width=device-width">')
+    ).value, true);
   });
 
-  // TODO: add test for ensuring the meta tag is in the head.
+  it('passes when a viewport is provided with an id', () => {
+    return assert.equal(Audit.audit(
+      getMockHtml('<meta id="my-viewport" name="viewport" content="width=device-width">')
+    ).value, true);
+  });
 });
 /* eslint-enable */