diff --git a/.changeset/techdocs-swift-mugs-invent.md b/.changeset/techdocs-swift-mugs-invent.md
new file mode 100644
index 0000000000..912089fb3c
--- /dev/null
+++ b/.changeset/techdocs-swift-mugs-invent.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs': patch
+---
+
+Add a test id to the shadow root element of the Reader to access it easily in e2e tests
diff --git a/plugins/techdocs/src/reader/components/Reader.test.tsx b/plugins/techdocs/src/reader/components/Reader.test.tsx
new file mode 100644
index 0000000000..b39134b0cd
--- /dev/null
+++ b/plugins/techdocs/src/reader/components/Reader.test.tsx
@@ -0,0 +1,67 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ApiProvider, ApiRegistry } from '@backstage/core';
+import { wrapInTestApp } from '@backstage/test-utils';
+import { act, render } from '@testing-library/react';
+import React from 'react';
+import { TechDocsStorageApi, techdocsStorageApiRef } from '../../api';
+import { Reader } from './Reader';
+
+jest.mock('react-router-dom', () => {
+ const actual = jest.requireActual('react-router-dom');
+ return {
+ ...actual,
+ useParams: jest.fn(),
+ };
+});
+
+const { useParams }: { useParams: jest.Mock } = jest.requireMock(
+ 'react-router-dom',
+);
+
+describe('', () => {
+ it('should render Reader content', async () => {
+ useParams.mockReturnValue({
+ entityId: 'Component::backstage',
+ });
+
+ const techdocsStorageApi: Partial = {};
+
+ const apiRegistry = ApiRegistry.from([
+ [techdocsStorageApiRef, techdocsStorageApi],
+ ]);
+
+ await act(async () => {
+ const rendered = render(
+ wrapInTestApp(
+
+
+ ,
+ ),
+ );
+ expect(
+ rendered.getByTestId('techdocs-content-shadowroot'),
+ ).toBeInTheDocument();
+ });
+ });
+});
diff --git a/plugins/techdocs/src/reader/components/Reader.tsx b/plugins/techdocs/src/reader/components/Reader.tsx
index 874ca5e018..feed758caa 100644
--- a/plugins/techdocs/src/reader/components/Reader.tsx
+++ b/plugins/techdocs/src/reader/components/Reader.tsx
@@ -17,10 +17,10 @@ import { EntityName } from '@backstage/catalog-model';
import { useApi } from '@backstage/core';
import { BackstageTheme } from '@backstage/theme';
import { useTheme } from '@material-ui/core';
+import { Alert } from '@material-ui/lab';
+import React, { useEffect, useRef, useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import { useAsync } from 'react-use';
-import React, { useEffect, useRef, useState } from 'react';
-import { Alert } from '@material-ui/lab';
import { techdocsStorageApiRef } from '../../api';
import transformer, {
addBaseUrl,
@@ -343,7 +343,7 @@ export const Reader = ({ entityId, onReady }: Props) => {
{docLoading || (docLoadError && syncInProgress) ? (
) : null}
-
+
>
);
};