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} -
+
); };