Skip to content

Commit

Permalink
OE-673: Update transform-origin (#138)
Browse files Browse the repository at this point in the history
  • Loading branch information
Toxiapo authored Oct 20, 2022
1 parent 9c3f955 commit 0890f26
Show file tree
Hide file tree
Showing 8 changed files with 46,360 additions and 26,252 deletions.
285 changes: 181 additions & 104 deletions cypress/integration/html-reader/page-button.ts
Original file line number Diff line number Diff line change
@@ -1,150 +1,227 @@
describe('PageButton visibility on useHtmlReader', () => {
beforeEach(() => {
cy.loadPage('/html/streamed-alice-epub');
});
describe('Reflowable layout', () => {
beforeEach(() => {
cy.loadPage('/html/streamed-alice-epub');
});

it('Paginated mode & at the start of the book previous page button should be disabled', () => {
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
it('Paginated mode & at the start of the book previous page button should be disabled', () => {
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');

cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Paginated').click();
cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Paginated').click();

cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
});
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
});

it('Scrolling mode & at the start of the book previous page button should be disabled', () => {
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
it('Scrolling mode & at the start of the book previous page button should be disabled', () => {
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');

cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Scrolling').click();
cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Scrolling').click();

cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
});
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
});

it('Paginated mode & at the end of the book the next page button should be disabled', () => {
cy.intercept('GET', 'https://alice.dita.digital/text/uncopyright.xhtml').as(
'uncopyright'
);
it('Paginated mode & at the end of the book the next page button should be disabled', () => {
cy.intercept(
'GET',
'https://alice.dita.digital/text/uncopyright.xhtml'
).as('uncopyright');

cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Paginated').click();
cy.wait(1000);
cy.findByRole('button', { name: 'Table of Contents' }).click();
cy.wait(1000);
cy.log('move to last chapter');
cy.findByRole('menuitem', { name: /(.*copy.*right$)/ }).click();
cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Paginated').click();
cy.wait(1000);
cy.findByRole('button', { name: 'Table of Contents' }).click();
cy.wait(1000);
cy.log('move to last chapter');
cy.findByRole('menuitem', { name: /(.*copy.*right$)/ }).click();

cy.wait('@uncopyright', { timeout: 10000 });
cy.wait('@uncopyright', { timeout: 10000 });

cy.wait(1000);
cy.wait(1000);

cy.log('move to last page');
cy.findByRole('button', { name: 'Next Page' }).click();
cy.log('move to last page');
cy.findByRole('button', { name: 'Next Page' }).click();

cy.wait(1000);
cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);

cy.log('Press the Previous page button to reveal the next page button');
cy.findByRole('button', { name: 'Previous Page' }).click();
cy.log('Press the Previous page button to reveal the next page button');
cy.findByRole('button', { name: 'Previous Page' }).click();

cy.wait(1000);
cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
});
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
});

it('Scrolling mode & at the end of the book the next page button should be disabled', () => {
cy.intercept('GET', 'https://alice.dita.digital/text/uncopyright.xhtml').as(
'uncopyright'
);
it('Scrolling mode & at the end of the book the next page button should be disabled', () => {
cy.intercept(
'GET',
'https://alice.dita.digital/text/uncopyright.xhtml'
).as('uncopyright');

cy.findByRole('button', { name: 'Settings' }).click();
cy.wait(500);
cy.findByText('Scrolling').click();
cy.findByRole('button', { name: 'Settings' }).click();
cy.wait(500);
cy.findByText('Scrolling').click();

cy.findByRole('button', { name: 'Table of Contents' }).click();
cy.log('move to last chapter');
cy.findByRole('menuitem', { name: /(.*copy.*right$)/ }).click();
cy.findByRole('button', { name: 'Table of Contents' }).click();
cy.log('move to last chapter');
cy.findByRole('menuitem', { name: /(.*copy.*right$)/ }).click();

cy.wait('@uncopyright', { timeout: 10000 });
cy.wait('@uncopyright', { timeout: 10000 });

cy.wait(1000);
cy.wait(1000);

cy.getIframeBody().find('.copyright-page').should('exist');
cy.getIframeBody().find('.copyright-page').should('exist');

cy.wait(1000);
cy.wait(1000);

cy.log('move to last page');
cy.findByRole('button', { name: 'Next Page' }).click();
cy.log('move to last page');
cy.findByRole('button', { name: 'Next Page' }).click();

cy.wait(1000);
cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);

cy.log('Press the Previous page button to reveal the next page button');
cy.findByRole('button', { name: 'Previous Page' }).click();
cy.log('Press the Previous page button to reveal the next page button');
cy.findByRole('button', { name: 'Previous Page' }).click();

cy.wait(1000);
cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
});
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
});

it('Scrolling mode & screen resize should show/hide the page buttons', () => {
cy.intercept(
'GET',
'https://alice.dita.digital/text/uncopyright.xhtml'
).as('uncopyright');

cy.findByRole('button', { name: 'Settings' }).click();

cy.wait(1000);

cy.findByText('Scrolling').click();

cy.findByRole('button', { name: 'Table of Contents' }).click();
cy.log('move to last chapter');
cy.findByRole('menuitem', { name: /(.*copy.*right$)/ }).click();

cy.wait('@uncopyright', { timeout: 10000 });

it('Scrolling mode & screen resize should show/hide the page buttons', () => {
cy.intercept('GET', 'https://alice.dita.digital/text/uncopyright.xhtml').as(
'uncopyright'
);
cy.wait(1000);

cy.findByRole('button', { name: 'Settings' }).click();
cy.getIframeBody().find('.copyright-page').should('exist');

cy.wait(1000);
cy.wait(1000);

cy.findByText('Scrolling').click();
cy.log('scroll to the bottom of the page');
cy.get('iframe').then(($iframe) => {
console.log($iframe.contents().scrollTop(Number.MAX_SAFE_INTEGER));
});
cy.wait(1000);

cy.findByRole('button', { name: 'Table of Contents' }).click();
cy.log('move to last chapter');
cy.findByRole('menuitem', { name: /(.*copy.*right$)/ }).click();
cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);

cy.wait('@uncopyright', { timeout: 10000 });
cy.log('Small screen should disable next button');
cy.viewport(300, 300);

cy.wait(1000);
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
});
});

describe('FXL layout', () => {
beforeEach(() => {
cy.loadPage('/html/fxl-poems');
});

cy.getIframeBody().find('.copyright-page').should('exist');
it('Paginated mode & at the start of the book previous page button should be disabled', () => {
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');

cy.wait(1000);
cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Paginated').click();

cy.log('scroll to the bottom of the page');
cy.get('iframe').then(($iframe) => {
console.log($iframe.contents().scrollTop(Number.MAX_SAFE_INTEGER));
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should('be.disabled');
});
cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
it.only('Paginated mode & at the end of the book the next page button should be disabled', () => {
cy.findByRole('button', { name: 'Settings' }).click();
cy.findByText('Paginated').click();

cy.findByRole('button', { name: 'Table of Contents' }).click();

cy.log('move to last chapter and last page');
cy.findByRole('menuitem', { name: /(Everyone Sang)/ }).click();

cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);

cy.log('Press the Previous page button to reveal the next page button');
cy.findByRole('button', { name: 'Previous Page' }).click();

cy.log('Small screen should disable next button');
cy.viewport(300, 300);
cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);

cy.log('Should work for mobile screen');
cy.viewport(300, 300);

cy.wait(1000);

cy.findByRole('button', { name: 'Next Page' }).click();
cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);

cy.wait(1000);

cy.log('Should work for tablet screen');
cy.viewport(630, 300);
cy.wait(1000);

cy.findByRole('button', { name: 'Previous Page' }).click();
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
cy.findByRole('button', { name: 'Next Page' }).should('not.be.disabled');

cy.wait(1000);
cy.findByRole('button', { name: 'Next Page' }).click();
cy.findByRole('button', { name: 'Next Page' }).should('be.disabled');
cy.findByRole('button', { name: 'Previous Page' }).should(
'not.be.disabled'
);
});
});
});
1 change: 1 addition & 0 deletions cypress/support/commands.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ declare global {
| '/html/moby-epub3'
| '/html/axisnow-encrypted'
| '/html/axisnow-decrypted'
| '/html/fxl-poems'
| '/html/test/no-injectables'
| '/html/test/with-reflowable-layout'
| '/html/test/with-script-injectable'
Expand Down
4 changes: 2 additions & 2 deletions example/axisnow-encrypted.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { Heading, Box, Text } from '@chakra-ui/react';
import { Injectable } from '../src/Readium/Injectable';

type AxisNowEncryptedProps = {
injectables: Injectable[];
injectablesReflowable: Injectable[];
};

const webpubManifestUrl = `${origin}/samples/dickens-axisnow/encrypted/manifest.json`;
Expand Down Expand Up @@ -73,7 +73,7 @@ const AxisNowEncrypted: React.FC<AxisNowEncryptedProps> = (props) => {

return (
<WebReader
injectables={props.injectables}
injectablesReflowable={props.injectablesReflowable}
webpubManifestUrl={webpubManifestUrl}
getContent={getContent}
/>
Expand Down
2 changes: 1 addition & 1 deletion example/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -190,7 +190,7 @@ const HtmlReaders = () => {
return (
<Switch>
<Route path={`/html/axisnow-encrypted`}>
<AxisNowEncrypted injectables={htmlInjectablesReflowable} />
<AxisNowEncrypted injectablesReflowable={htmlInjectablesReflowable} />
</Route>
<Route path={`/html/axisnow-decrypted`}>
<WebReader
Expand Down
Loading

1 comment on commit 0890f26

@vercel
Copy link

@vercel vercel bot commented on 0890f26 Oct 20, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

web-reader – ./

web-reader-git-main-nypl.vercel.app
web-reader-nypl.vercel.app
nypl-web-reader.vercel.app

Please sign in to comment.