angular-docs-cn/aio/tests/e2e/src/scroll.e2e-spec.ts

92 lines
3.1 KiB
TypeScript

import { browser } from 'protractor';
import { SitePage } from './app.po';
describe('site auto-scrolling', () => {
let page: SitePage;
// Helpers
const scrollAndWait = async (y: Parameters<SitePage['scrollTo']>[0] = 'bottom') => {
await page.scrollTo(y);
await browser.sleep(500); // Scroll position is stored every 250ms for performance reasons.
};
beforeEach(async () => {
page = new SitePage();
await page.navigateTo('');
});
it('should be initially scrolled to top', async () => {
expect(await page.getScrollTop()).toBe(0);
});
it('should scroll to top when navigating to a different page', async () => {
await scrollAndWait();
expect(await page.getScrollTop()).not.toBe(0);
await page.navigateTo('docs');
expect(await page.getScrollTop()).toBe(0);
});
it('should retain the scroll position on reload', async () => {
await scrollAndWait();
expect(await page.getScrollTop()).not.toBe(0);
await browser.refresh();
expect(await page.getScrollTop()).not.toBe(0);
});
it('should scroll to top when navigating to a different page via a link', async () => {
await scrollAndWait();
expect(await page.getScrollTop()).not.toBe(0);
await page.docsMenuLink.click();
// On some environments (e.g. CI) it takes some time for the page to load (and scroll to top).
await browser.wait(async () => await page.getScrollTop() === 0, 1000);
});
it('should scroll to top when navigating to the same page via a link', async () => {
await scrollAndWait();
expect(await page.getScrollTop()).not.toBe(0);
await page.homeLink.click();
expect(await page.getScrollTop()).toBe(0);
});
// TODO: Find a way to accurately emulate clicking the browser back/forward button. Apparently,
// both `browser.navigate().back()` and `browser.executeScript('history.back()')` cause a full
// page load, which behaves differently than clicking the browser back button (and triggering a
// `popstate` event instead of a navigation). Same for `forward()`.
xit('should retain the scroll position when navigating back/forward', async () => {
await scrollAndWait(100);
expect(await page.getScrollTop()).toBeCloseTo(100, -1);
await page.navigateTo('docs');
await scrollAndWait(50);
expect(await page.getScrollTop()).toBeCloseTo(50, -1);
await page.navigateTo('features');
await scrollAndWait(75);
expect(await page.getScrollTop()).toBeCloseTo(75, -1);
// Go back.
await browser.navigate().back();
expect(await page.locationPath()).toBe('/docs');
expect(await page.getScrollTop()).toBeCloseTo(50, -1);
// Go back.
await browser.navigate().back();
expect(await page.locationPath()).toBe('/');
expect(await page.getScrollTop()).toBeCloseTo(100, -1);
// Go forward.
await browser.navigate().forward();
expect(await page.locationPath()).toBe('/docs');
expect(await page.getScrollTop()).toBeCloseTo(50, -1);
// Go forward.
await browser.navigate().forward();
expect(await page.locationPath()).toBe('/features');
expect(await page.getScrollTop()).toBeCloseTo(75, -1);
});
});