diff --git a/services/web/test/frontend/features/preview/components/preview-recompile-button.test.js b/services/web/test/frontend/features/preview/components/preview-recompile-button.test.js
index df3ec91438..1243fe0127 100644
--- a/services/web/test/frontend/features/preview/components/preview-recompile-button.test.js
+++ b/services/web/test/frontend/features/preview/components/preview-recompile-button.test.js
@@ -96,6 +96,9 @@ describe('<PreviewRecompileButton />', function() {
   })
 
   function renderPreviewRecompileButton(compilerState = {}) {
+    if (!compilerState.logEntries) {
+      compilerState.logEntries = {}
+    }
     render(
       <PreviewRecompileButton
         compilerState={{
diff --git a/services/web/test/frontend/prop-types.test.js b/services/web/test/frontend/prop-types.test.js
new file mode 100644
index 0000000000..6c41bc8727
--- /dev/null
+++ b/services/web/test/frontend/prop-types.test.js
@@ -0,0 +1,28 @@
+/**
+ * Make tests fail when prop-types are incorrect.
+ *
+ * React's prop-types library logs an console.error when the types are
+ * incorrect. Since this error is only in the console, tests that fail the type-
+ * check will still pass.
+ *
+ * To ensure that type-checking is tested, monkey-patch the global console.error
+ * to fail the tests when prop-types errors.
+ */
+const originalConsoleError = global.console.error
+before(function() {
+  global.console.error = (message, ...args) => {
+    // Ensure we still log the error
+    originalConsoleError(message, ...args)
+
+    // Check if the error is from prop-types
+    if (/Failed prop type/.test(message)) {
+      // Throw an error, causing the test to fail
+      throw new Error(message)
+    }
+  }
+})
+
+// Restore the original method
+after(function() {
+  global.console.error = originalConsoleError
+})