zoukankan      html  css  js  c++  java
  • Cypress web自动化13-viewport设置不同分辨率,适配不同设备,手机型号

    前言

    通常web测试需测下在不同设备,手机上,不同的分辨率显示效果,可以用viewport()方法实现

    viewport()

    设置不同分辨率查看显示效果

    cy.get('#navbar').should('be.visible')
    cy.viewport(320, 480)
    
    // the navbar should have collapse since our screen is smaller
    cy.get('#navbar').should('not.be.visible')
    cy.get('.navbar-toggle').should('be.visible').click()
    cy.get('.nav').find('a').should('be.visible')
    
    // lets see what our app looks like on a super large screen
    cy.viewport(2999, 2999)
    
    // cy.viewport() accepts a set of preset sizes
    // to easily set the screen to a device's width and height
    
    // We added a cy.wait() between each viewport change so you can see
    // the change otherwise it is a little too fast to see :)
    
    cy.viewport('macbook-15')
    cy.wait(200)
    cy.viewport('macbook-13')
    cy.wait(200)
    cy.viewport('macbook-11')
    cy.wait(200)
    cy.viewport('ipad-2')
    cy.wait(200)
    cy.viewport('ipad-mini')
    cy.wait(200)
    cy.viewport('iphone-6+')
    cy.wait(200)
    cy.viewport('iphone-6')
    cy.wait(200)
    cy.viewport('iphone-5')
    cy.wait(200)
    cy.viewport('iphone-4')
    cy.wait(200)
    cy.viewport('iphone-3')
    cy.wait(200)
    
    // cy.viewport() accepts an orientation for all presets
    // the default orientation is 'portrait'
    cy.viewport('ipad-2', 'portrait')
    cy.wait(200)
    cy.viewport('iphone-4', 'landscape')
    cy.wait(200)
    
    // The viewport will be reset back to the default dimensions
    // in between tests (the  default can be set in cypress.json)
    
  • 相关阅读:
    07-2. A+B和C (15)
    07-1. 换个格式输出整数 (15)
    07-0. 写出这个数 (20)
    06-3. 单词长度(15)
    06-2. 字符串字母大小写转换(10)
    06-1. 简单计算器(20)
    06-0. 混合类型数据格式化输入(5)
    05-3. 求a的连续和(15)
    05-2. 念数字(15)
    05-1. 约分最简分式(15)
  • 原文地址:https://www.cnblogs.com/yoyoketang/p/12878064.html
Copyright © 2011-2022 走看看