diff --git a/src/pages/__snapshots__/index.test.js.snap b/src/pages/__snapshots__/index.test.js.snap
index 1efe07c..3a71349 100644
--- a/src/pages/__snapshots__/index.test.js.snap
+++ b/src/pages/__snapshots__/index.test.js.snap
@@ -25,7 +25,19 @@ exports[`Index Page rendering 1`] = `
   <App
     expr=""
     permalinkUrl={null}
-    syntax="js"
+    syntax="testJs"
+    syntaxList={
+      Array [
+        Object {
+          "id": "testJS",
+          "name": "Testing JS",
+        },
+        Object {
+          "id": "other",
+          "name": "Other",
+        },
+      ]
+    }
   />
 </Fragment>
 `;
@@ -56,6 +68,18 @@ exports[`Index Page rendering with an expression on the URL 1`] = `
     expr="testing"
     permalinkUrl="http://example.com"
     syntax="test"
+    syntaxList={
+      Array [
+        Object {
+          "id": "testJS",
+          "name": "Testing JS",
+        },
+        Object {
+          "id": "other",
+          "name": "Other",
+        },
+      ]
+    }
   />
 </Fragment>
 `;
diff --git a/src/pages/index.test.js b/src/pages/index.test.js
index b2e5179..e2f6f9f 100644
--- a/src/pages/index.test.js
+++ b/src/pages/index.test.js
@@ -3,10 +3,22 @@ import { shallow } from 'enzyme';
 
 import { IndexPage } from 'pages/index';
 
+const queryResult = {
+  site: {
+    siteMetadata: {
+      defaultSyntax: 'testJs',
+      syntaxList: [
+        { id: 'testJS', name: 'Testing JS' },
+        { id: 'other', name: 'Other' }
+      ]
+    }
+  }
+};
+
 describe('Index Page', () => {
   test('rendering', () => {
     const component = shallow(
-      <IndexPage location={{ hash: '' }} />
+      <IndexPage location={{ hash: '' }} data={ queryResult } />
     );
     expect(component).toMatchSnapshot();
   });
@@ -16,7 +28,7 @@ describe('Index Page', () => {
       <IndexPage location={{
         hash: '#syntax=test&expr=testing',
         href: 'http://example.com'
-      }} />
+      }} data={ queryResult } />
     );
     expect(component).toMatchSnapshot();
   });