Keine Beschreibung

preventOverflow.test.js 4.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. /**
  2. * @jest-environment puppeteer
  3. * @flow
  4. */
  5. import { scroll, screenshot } from '../utils/puppeteer.js';
  6. it('should not overflow when small reference is at edge of boundary', async () => {
  7. const page = await browser.newPage();
  8. await page.goto(`${TEST_URL}/modifiers/preventOverflow/edge.html`);
  9. await scroll(page, '#scroll', 300);
  10. expect(await screenshot(page)).toMatchImageSnapshot();
  11. });
  12. it('should not be tethered earlier than expected with a point reference', async () => {
  13. const page = await browser.newPage();
  14. await page.goto(`${TEST_URL}/modifiers/preventOverflow/point.html`);
  15. await scroll(page, '#scroll', 300);
  16. expect(await screenshot(page)).toMatchImageSnapshot();
  17. });
  18. it('should take into account the arrow padding (mainSide)', async () => {
  19. const page = await browser.newPage();
  20. await page.goto(`${TEST_URL}/modifiers/preventOverflow/arrow.html`);
  21. await scroll(page, '#scroll', 760);
  22. expect(await screenshot(page)).toMatchImageSnapshot();
  23. });
  24. it('should take into account the arrow padding (altSide)', async () => {
  25. const page = await browser.newPage();
  26. await page.goto(`${TEST_URL}/modifiers/preventOverflow/arrow.html`);
  27. await scroll(page, '#scroll', 20);
  28. expect(await screenshot(page)).toMatchImageSnapshot();
  29. });
  30. it('should not be tethered if `tether: false`', async () => {
  31. const page = await browser.newPage();
  32. await page.goto(`${TEST_URL}/modifiers/preventOverflow/no-tether.html`);
  33. await scroll(page, '#scroll', 1500);
  34. expect(await screenshot(page)).toMatchImageSnapshot();
  35. });
  36. it('should be prevented from overflowing', async () => {
  37. const page = await browser.newPage();
  38. await page.goto(`${TEST_URL}/modifiers/preventOverflow/main.html`);
  39. await scroll(page, '#scroll', 670);
  40. expect(await screenshot(page)).toMatchImageSnapshot();
  41. });
  42. it('(min) should be allowed to overflow once the opposite edges are level', async () => {
  43. const page = await browser.newPage();
  44. await page.goto(`${TEST_URL}/modifiers/preventOverflow/main.html`);
  45. await scroll(page, '#scroll', 780);
  46. expect(await screenshot(page)).toMatchImageSnapshot();
  47. });
  48. it('(max) should be allowed to overflow once the opposite edges are level', async () => {
  49. const page = await browser.newPage();
  50. await page.goto(`${TEST_URL}/modifiers/preventOverflow/main.html`);
  51. await scroll(page, '#scroll', 4);
  52. expect(await screenshot(page)).toMatchImageSnapshot();
  53. });
  54. it('(min) (start-variation) should be allowed to overflow once the opposite edges are level', async () => {
  55. const page = await browser.newPage();
  56. await page.goto(`${TEST_URL}/modifiers/preventOverflow/start-variation.html`);
  57. await scroll(page, '#scroll', 780);
  58. expect(await screenshot(page)).toMatchImageSnapshot();
  59. });
  60. it('(max) (start-variation) should be allowed to overflow once the opposite edges are level', async () => {
  61. const page = await browser.newPage();
  62. await page.goto(`${TEST_URL}/modifiers/preventOverflow/start-variation.html`);
  63. await scroll(page, '#scroll', 4);
  64. expect(await screenshot(page)).toMatchImageSnapshot();
  65. });
  66. it('(min) (end-variation) should be allowed to overflow once the opposite edges are level', async () => {
  67. const page = await browser.newPage();
  68. await page.goto(`${TEST_URL}/modifiers/preventOverflow/end-variation.html`);
  69. await scroll(page, '#scroll', 780);
  70. expect(await screenshot(page)).toMatchImageSnapshot();
  71. });
  72. it('(max) (end-variation) should be allowed to overflow once the opposite edges are level', async () => {
  73. const page = await browser.newPage();
  74. await page.goto(`${TEST_URL}/modifiers/preventOverflow/end-variation.html`);
  75. await scroll(page, '#scroll', 4);
  76. expect(await screenshot(page)).toMatchImageSnapshot();
  77. });
  78. it('should not overflow offset parent borders', async () => {
  79. const page = await browser.newPage();
  80. await page.goto(
  81. `${TEST_URL}/modifiers/preventOverflow/offset-parent-border.html`
  82. );
  83. await scroll(page, '#scroll', 600);
  84. expect(await screenshot(page)).toMatchImageSnapshot();
  85. });
  86. it('should be inside scroller container', async () => {
  87. const page = await browser.newPage();
  88. await page.goto(`${TEST_URL}/modifiers/preventOverflow/body-render.html`);
  89. await scroll(page, '#scroll', 600);
  90. expect(await screenshot(page)).toMatchImageSnapshot();
  91. });