第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

Cypress - 始終將元素聚焦到距屏幕頂部給定的偏移量

Cypress - 始終將元素聚焦到距屏幕頂部給定的偏移量

aluckdog 2023-09-21 10:54:04
當(dāng)我在 Cypress 中運(yùn)行測試時(shí),它總是向下滾動(dòng)到該元素,因此它位于屏幕的最頂部。但我正在為 WordPress 系統(tǒng)編寫測試,其中固定欄始終位于屏幕頂部,占據(jù) 75 像素(左右)。所以當(dāng)我的測試運(yùn)行時(shí)我永遠(yuǎn)看不到發(fā)生了什么。有沒有一種方法,我可以為所有測試定義所有元素,以便當(dāng)它們處于焦點(diǎn)時(shí),它們距頂部 200px?就像全局常數(shù)一樣?代碼cy.get( 'tr[data-slug="cmb2"]' ).should( 'have.class', 'active' );請參閱這里的問題:.env解決方案嘗試1:在配置文件中設(shè)置如果我可以將它設(shè)置在 -file 中,那就太聰明了cypress.json。我閱讀了Cypress Configuration上的文檔,但在那里找不到它。解決方案嘗試 2:使用 CSS 隱藏管理欄我還可以嘗試添加一個(gè)樣式表以在后端運(yùn)行 Cypress-tests 時(shí)始終加載。但這是解決這個(gè)問題的正常方法嗎?即使我這樣做了,我也不知道該怎么做。解決方案嘗試3:使用scrollIntoView我嘗試添加scrollIntoView一些選項(xiàng):cy.get( 'tr[data-slug="cmb2"]' ).scrollIntoView({ offset: { top: 150, left: 0 } }).should( 'have.class', 'active' );但當(dāng)我將鼠標(biāo)懸停在 div 上時(shí),我仍然看不到它的標(biāo)題。我也嘗試了這里建議的解決方案,看起來有點(diǎn)像它。解決方案嘗試4:將scrollBehavior添加到我的.env文件中我將其添加到我的.env文件中:{   "env": {      "name": "staging",      ...   },   "viewportWidth": 1100,   "viewportHeight": 1800,   "watchForFileChanges": false,   "chromeWebSecurity": true,   "scrollBehavior": "bottom"   <---- My attempt!}但沒有雪茄:
查看完整描述

1 回答

?
紅顏莎娜

TA貢獻(xiàn)1842條經(jīng)驗(yàn) 獲得超13個(gè)贊

.scrollIntoView() 偏移量應(yīng)該為負(fù)數(shù)

it('make Elvis appear', () => {

? cy.viewport(750,480)

? cy.visit('https://mui.com/getting-started/templates/dashboard/');


? cy.contains('Elvis Presley').scrollIntoView({offset:{top: -100}})

})?

使用原生的scrollIntoView


it('make Elvis appear', () => {

? cy.viewport(750,480)

? cy.visit('https://mui.com/getting-started/templates/dashboard/');


? // https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

? cy.contains('Elvis Presley')

? ? .then($el => $el[0].scrollIntoView(false)) // scrolls $el to bottom

})

使標(biāo)題透明


it('make Elvis appear', () => {

? cy.viewport(750,480)

? cy.visit('https://mui.com/getting-started/templates/dashboard/');


? cy.get('header').invoke('css', 'opacity', '0')

? cy.contains('Elvis Presley').scrollIntoView()

})

使用 .scrollTo()


此命令適用于滾動(dòng)容器,而不是您定位的元素,因此定位可能不會(huì)每次都正確顯示。


function getScrollParent(node) {

? if (node == null) return null;


? if (node.scrollHeight > node.clientHeight) {

? ? return node;

? } else {

? ? return getScrollParent(node.parentNode);

? }

}


it('make Elvis appear', () => {

? cy.viewport(750,480)

? cy.visit('https://mui.com/getting-started/templates/dashboard/');


? cy.contains('Elvis Presley')

? ? .then($el => {

? ? ? const scrollParent = getScrollParent($el[0])

? ? ? cy.wrap(scrollParent).scrollTo('center')

? ? })

})


查看完整回答
反對 回復(fù) 2023-09-21
?
波斯汪

TA貢獻(xiàn)1811條經(jīng)驗(yàn) 獲得超4個(gè)贊

解決了 get()、contains()、click() 上的網(wǎng)站頂部菜單隱藏元素的問題。


將以下內(nèi)容添加到 Cypress 全局配置或測試配置。


從我的 cypress.config.ts (簡化為焦點(diǎn)):


import { defineConfig } from 'cypress'


export default defineConfig({


  e2e: {

    scrollBehavior: false

  }

})

然后使用 cy.scrollTo()、cy.scrollIntoView() 動(dòng)態(tài)地“手動(dòng)”滾動(dòng)……


查看完整回答
反對 回復(fù) 2023-09-21
  • 1 回答
  • 0 關(guān)注
  • 176 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)