diff --git a/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx b/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
index 4a61c9bf09..4dd18c326f 100644
--- a/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
+++ b/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
@@ -17,18 +17,21 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import mockFetch from 'jest-fetch-mock';
-import ExampleComponent from './ExampleComponent';
+import { GraphiQLPage } from './GraphiQLPage';
 import { ThemeProvider } from '@material-ui/core';
 import { lightTheme } from '@backstage/theme';
 
-describe('ExampleComponent', () => {
+jest.mock('graphiql', () => () => '<GraphiQL />');
+
+describe('GraphiQLPage', () => {
   it('should render', () => {
     mockFetch.mockResponse(() => new Promise(() => {}));
     const rendered = render(
       <ThemeProvider theme={lightTheme}>
-        <ExampleComponent />
+        <GraphiQLPage />
       </ThemeProvider>,
     );
-    expect(rendered.getByText('Welcome to graphiql!')).toBeInTheDocument();
+    expect(rendered.getByText('GraphiQL')).toBeInTheDocument();
+    expect(rendered.getByText('<GraphiQL />')).toBeInTheDocument();
   });
 });