new file mode 100644
--- /dev/null
+++ b/autoland/ui/src/__tests__/AutolandController.js
@@ -0,0 +1,28 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import AutolandController from '../components/AutolandController';
+
+describe('AutolandController', () => {
+
+  test('Renders "fetching data" message upon creation', () => {
+    const mount = shallow(
+      <AutolandController
+        params={{ series_id: 'example-02-can-be-landed', repo_id: 'test-repo' }} />
+    );
+
+    // The "fetching data" message should show right away
+    expect(mount.find('.fetching-data').length).toBe(1);
+  });
+
+  test('Error notification displays properly', () => {
+    const mount = shallow(
+      <AutolandController
+        params={{ series_id: 'example-02-can-be-landed', repo_id: 'test-repo' }} />
+    );
+
+    mount.instance().setState({ error: 'Error!' });
+    expect(mount.find('.warning').length).toBe(1);
+  });
+
+});

--- a/autoland/ui/src/components/AutolandController.jsx
+++ b/autoland/ui/src/components/AutolandController.jsx
@@ -77,17 +77,17 @@ class AutolandController extends React.C
     // Error!  One example could be a 404 for a bad ID
     if (this.state.error !== null) {
       return <span className="warning">{this.state.error}</span>;
     }
 
     // This is the default text for the element while we fetch data
     // during the initial widget creation
     if (data === null) {
-      return <span>Fetching data...</span>;
+      return <span className="fetching-data">Fetching data...</span>;
     }
 
     // For now, the only push that matters is the first provided back
     const push = data.pushes && data.pushes[0];
     const landing = data.landings && data.landings[0];
     const failures = {};
     let failureCount = 0;