github.com/quickfeed/quickfeed@v0.0.0-20240507093252-ed8ca812a09c/public/src/__tests__/e2e/navbarResponsive.test.tsx (about)

     1  import { By } from 'selenium-webdriver'
     2  import { isOverlapping, setupDrivers } from '../TestHelpers'
     3  
     4  
     5  describe("Front page elements login and logo should not overlap", () => {
     6  
     7      const overlapTests: { width: number, height: number, want: boolean }[] = [
     8          // Resolutions to test
     9          { width: 1920, height: 1080, want: false }, // Desktop
    10          { width: 1366, height: 768, want: false },  // Laptop
    11          { width: 960, height: 1080, want: false },  // Split screen desktop
    12          { width: 683, height: 768, want: false }    // Split screen laptop
    13      ]
    14  
    15      const drivers = setupDrivers()
    16  
    17      drivers.forEach(driver => {
    18          overlapTests.forEach(test => {
    19              it(`Should not overlap on res ${test.width}x${test.height}`, async () => {
    20                  await driver.manage().window().setRect({ width: test.width, height: test.height })
    21  
    22                  const logo = await driver.findElement(By.className("navbar-brand"))
    23                  const avatar = await driver.findElement(By.id("avatar"))
    24                  const rect = await logo.getRect()
    25                  const rect2 = await avatar.getRect()
    26  
    27                  const overlap = isOverlapping(rect, rect2)
    28  
    29                  jest.setTimeout(50000)
    30                  expect(overlap).toBe(test.want)
    31              }, 50000)
    32          })
    33      })
    34  })