From e50b63c62a779cc8d32382dd43fe83726b415ea2 Mon Sep 17 00:00:00 2001 From: Roy Johnson Date: Thu, 7 Sep 2023 11:45:55 -0500 Subject: [PATCH] Revert loader-page, which was breaking Role Selector --- package.json | 2 +- src/app/components/jsx-helpers/loader-page.js | 43 +++++++++++++ .../components/jsx-helpers/loader-page.tsx | 61 ------------------- .../loading-placeholder.js | 6 +- test/src/pages/adoption/adoption.test.js | 26 ++++---- yarn.lock | 6 +- 6 files changed, 59 insertions(+), 85 deletions(-) create mode 100644 src/app/components/jsx-helpers/loader-page.js delete mode 100644 src/app/components/jsx-helpers/loader-page.tsx diff --git a/package.json b/package.json index f74ce30c5..410f8641a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@openstax/os-webview", - "version": "2.111.0", + "version": "2.111.1", "description": "OpenStax webview", "scripts": { "test": "jest ./test/src", diff --git a/src/app/components/jsx-helpers/loader-page.js b/src/app/components/jsx-helpers/loader-page.js new file mode 100644 index 000000000..0e9d75f8c --- /dev/null +++ b/src/app/components/jsx-helpers/loader-page.js @@ -0,0 +1,43 @@ +import React from 'react'; +import {camelCaseKeys} from '~/helpers/page-data-utils'; +import usePageData from '~/helpers/use-page-data'; +import {setPageTitleAndDescriptionFromBookData, useCanonicalLink} from '~/helpers/use-document-head'; +import LoadingPlaceholder from '~/components/loading-placeholder/loading-placeholder'; +import Error404 from '~/pages/404/404'; + +function LoadedPage({ + Child, data, props, doDocumentSetup, noCamelCase +}) { + const camelCaseData = React.useMemo( + () => noCamelCase ? data : camelCaseKeys(data), + [data, noCamelCase] + ); + + useCanonicalLink(doDocumentSetup); + React.useEffect(() => { + if (doDocumentSetup) { + setPageTitleAndDescriptionFromBookData(data); + } + }, [data, doDocumentSetup]); + + if (data.error) { + return (); + } + + return ( + + ); +} + +export default function LoaderPage({ + slug, Child, props={}, preserveWrapping=false, doDocumentSetup=false, + noCamelCase=false +}) { + const data = usePageData(slug, preserveWrapping, noCamelCase); + + if (!data) { + return ; + } + + return (); +} diff --git a/src/app/components/jsx-helpers/loader-page.tsx b/src/app/components/jsx-helpers/loader-page.tsx deleted file mode 100644 index 7573037c1..000000000 --- a/src/app/components/jsx-helpers/loader-page.tsx +++ /dev/null @@ -1,61 +0,0 @@ -import React from 'react'; -import {fetchPageData} from '~/helpers/use-page-data'; -import loadable from 'react-loadable'; -import {setPageTitleAndDescriptionFromBookData, useCanonicalLink} from '~/helpers/use-document-head'; -import LoadingPlaceholder from '~/components/loading-placeholder/loading-placeholder'; -import Error404 from '~/pages/404/404'; - -type Data = { - error?: unknown; -} -type LoadedPageProps = { - Child: React.JSXElementConstructor; - data: Data; - props: object; - doDocumentSetup: boolean; -} - -function LoadedPage({ - Child, data, props, doDocumentSetup -}: LoadedPageProps) { - useCanonicalLink(doDocumentSetup); - React.useEffect(() => { - if (doDocumentSetup) { - setPageTitleAndDescriptionFromBookData(data); - } - }, [data, doDocumentSetup]); - - if (data.error) { - return (); - } - - return ( - - ); -} - -type LoaderPageProps = LoadedPageProps & { - slug: string; - preserveWrapping: boolean; - noCamelCase: boolean; -} - -const defaultProps = {}; - -export default function LoaderPage({ - slug, Child, props=defaultProps, preserveWrapping=false, doDocumentSetup=false, - noCamelCase=false -}: LoaderPageProps) { - const Page = React.useMemo( - () => loadable({ - loader: () => fetchPageData(slug, preserveWrapping, noCamelCase), - loading: LoadingPlaceholder, - render(data: Data) { - return ; - } - }), - [slug, Child, props, preserveWrapping, doDocumentSetup, noCamelCase] - ); - - return ; -} diff --git a/src/app/components/loading-placeholder/loading-placeholder.js b/src/app/components/loading-placeholder/loading-placeholder.js index c34f6c871..ab0be78d7 100644 --- a/src/app/components/loading-placeholder/loading-placeholder.js +++ b/src/app/components/loading-placeholder/loading-placeholder.js @@ -1,11 +1,7 @@ import React from 'react'; import './loader.scss'; -export default function LoadingPlaceholder(props={}) { - if (props.error) { - return
Error!
; - } - +export default function LoadingPlaceholder() { /* eslint-disable */ return (
diff --git a/test/src/pages/adoption/adoption.test.js b/test/src/pages/adoption/adoption.test.js index df24d8e20..866ef00ea 100644 --- a/test/src/pages/adoption/adoption.test.js +++ b/test/src/pages/adoption/adoption.test.js @@ -24,19 +24,15 @@ beforeEach(async () => { test('creates with role selector', () => expect(screen.queryAllByRole('option', {hidden: true})).toHaveLength(8)); -/* This test works locally, but not on checkin - * Moreover, the form it finds is just the one around the role selector - */ -// test( -// 'form appears when role is selected', -// async () => { -// const listBox = screen.queryByRole('listbox'); -// const user = userEvent.setup(); +test('form appears when role is selected', async () => { + const listBox = screen.queryByRole('listbox'); + const user = userEvent.setup(); -// await user.click(listBox); -// const options = await screen.findAllByRole('option', {hidden: true}); -// const instructorOption = options.find((o) => o.textContent === 'Instructor'); -// await user.click(instructorOption); -// await screen.findByRole('form'); -// } -// ) + await user.click(listBox); + const options = await screen.findAllByRole('option', {hidden: true}); + const instructorOption = options.find( + (o) => o.textContent === 'Instructor' + ); + await user.click(instructorOption); + await screen.findByRole('form'); +}); diff --git a/yarn.lock b/yarn.lock index 96a67cefe..1d4f3a00c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3285,9 +3285,9 @@ integrity sha512-Q5vtl1W5ue16D+nIaW8JWebSSraJVlK+EthKn7e7UcD4KWsaSJ8BqGPXNaPghgtcn/fhvrN17Tv8ksUsQpiplw== "@types/uglify-js@*": - version "3.17.1" - resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.17.1.tgz#e0ffcef756476410e5bce2cb01384ed878a195b5" - integrity sha512-GkewRA4i5oXacU/n4MA9+bLgt5/L3F1mKrYvFGm7r2ouLXhRKjuWwo9XHNnbx6WF3vlGW21S3fCvgqxvxXXc5g== + version "3.17.2" + resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.17.2.tgz#a2ba86fd524f6281a7655463338c546f845b29c3" + integrity sha512-9SjrHO54LINgC/6Ehr81NjAxAYvwEZqjUHLjJYvC4Nmr9jbLQCIZbWSvl4vXQkkmR1UAuaKDycau3O1kWGFyXQ== dependencies: source-map "^0.6.1"