码迷,mamicode.com
首页 > 移动开发 > 详细

Cypress学习13-viewport设置不同分辨率,适配不同设备,手机型号

时间:2020-05-12 20:00:24      阅读:88      评论:0      收藏:0      [点我收藏+]

标签:default   ISE   不同   效果   device   change   cli   cep   you   

前言

通常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)

Cypress学习13-viewport设置不同分辨率,适配不同设备,手机型号

标签:default   ISE   不同   效果   device   change   cli   cep   you   

原文地址:https://www.cnblogs.com/yoyoketang/p/12878064.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!