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

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

賽普拉斯點(diǎn)擊/觸發(fā)不觸發(fā)事件監(jiān)聽器

賽普拉斯點(diǎn)擊/觸發(fā)不觸發(fā)事件監(jiān)聽器

在過去的幾個(gè)月里，我一直在為 SO 驅(qū)動(dòng)的 SE 教育的最后階段開發(fā)一個(gè)工作流建模器。我一直在使用mxGraph和 vanilla javascript，并嘗試使用 Cypress 設(shè)置一些基本的 E2E 測(cè)試。我在（我假設(shè)）觸發(fā)事件偵聽器時(shí)遇到了一些問題。有些按鈕確實(shí)響應(yīng)柏樹點(diǎn)擊/觸發(fā)，而有些按鈕則不響應(yīng)。我的應(yīng)用程序中的所有按鈕都沒有 onClick 操作或任何其他包含模型或控制器方法的屬性。相反，所有按鈕和鍵都有處理程序和偵聽器，由 mxGraph-editor 實(shí)用程序類創(chuàng)建。我嘗試在 mxGraph 的公共示例上使用相同的 E2E 測(cè)試重新創(chuàng)建一些操作（請(qǐng)參閱柏樹代碼）。拖動(dòng)對(duì)象（從菜單到畫布（#1）和從畫布到畫布（#4））和選擇對(duì)象（#2）很遺憾不起作用。雙擊一個(gè)對(duì)象并修改文本（#3）確實(shí)有效……但我迷路了。我嘗試了所有不同的強(qiáng)制、等待、點(diǎn)擊和觸發(fā)方式，但都無濟(jì)于事。describe('mxGraph "ports" example', function () {    it('Start ports example', function () {        cy.visit('https://jgraph.github.io/mxgraph/javascript/examples/ports.html')        cy.wait(500)    })    // Example #1 : FAIL    it('#1 Create new object by dragging', function () {        cy.get('div[id="sidebarContainer"]').find('img[title="Drag this to the diagram to create a new vertex"]').first()           .trigger('mousedown', { force: true})            .trigger('mousemove', { clientX: 250, clientY: 250, force: true})            .trigger('mouseup', {force: true})        cy.get('div[id="graphContainer"]').find('svg').trigger('drop', { force: true })        cy.wait(500)    })})describe('mxGraph "user object" example', function () {    it('Start userobject example', function () {        cy.visit('https://jgraph.github.io/mxgraph/javascript/examples/userobject.html')        cy.wait(500)    })    // Example #2 : FAIL    it('#2 Single click on object (green highlight should appear)', function () {        cy.get('rect').first().click({ force: true })        cy.wait(500)    })    // Example #3 : PASS    it('#3 Double click & edit object (Text should be modified)', function () {        cy.get('rect').first().dblclick({ force: true })        cy.wait(500)        cy.get('div [class="mxCellEditor mxPlainTextEditor"]').first().type('text modified')        cy.wait(500)    })任何幫助是極大的贊賞。提前致謝！
查看完整描述

1 回答

?
偶然的你

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

您的應(yīng)用似乎正在使用指針事件，因此請(qǐng)嘗試將所有這些事件名稱中的替換mouse為pointer。


此外，這里有一個(gè)關(guān)于拖放的更完整的抽象：



const dragTo = (subject, to, opts) => {


  opts = Cypress._.defaults(opts, {

    // delay inbetween steps

    delay: 0,

    // interpolation between coords

    steps: 0,

    // >=10 steps

    smooth: false,

  })


  if (opts.smooth) {

    opts.steps = Math.max(opts.steps, 10)

  }


  const win = subject[0].ownerDocument.defaultView


  const elFromCoords = (coords) => win.document.elementFromPoint(coords.x, coords.y)

  const winMouseEvent = win.MouseEvent


  const send = (type, coords, el) => {


    el = el || elFromCoords(coords)


    if (type.includes('drag') || type === 'drop') {

      return el.dispatchEvent(

        new Event(type, Object.assign({}, { clientX: coords.x, clientY: coords.y }, { bubbles: true, cancelable: true }))

      )

    }


    el.dispatchEvent(

      new winMouseEvent(type, Object.assign({}, { clientX: coords.x, clientY: coords.y }, { bubbles: true, cancelable: true }))

    )

  }


  const toSel = to


  function drag (from, to, steps = 1) {


    const fromEl = elFromCoords(from)


    const _log = Cypress.log({

      $el: fromEl,

      name: 'drag to',

      message: toSel,

    })


    _log.snapshot('before', { next: 'after', at: 0 })


    _log.set({ coords: to })


    send('mouseover', from, fromEl)

    send('pointerover', from, fromEl)

    send('mousedown', from, fromEl)

    send('pointerdown', from, fromEl)

    send('dragstart', from, fromEl)


    cy.then(() => {

      return Cypress.Promise.try(() => {


        if (steps > 0) {


          const dx = (to.x - from.x) / steps

          const dy = (to.y - from.y) / steps


          return Cypress.Promise.map(Array(steps).fill(), (v, i) => {

            i = steps - 1 - i


            let _to = {

              x: from.x + dx * (i),

              y: from.y + dy * (i),

            }


            send('mousemove', _to, fromEl)


            return Cypress.Promise.delay(opts.delay)


          }, { concurrency: 1 })

        }

      })

      .then(() => {


        send('mousemove', to, fromEl)

        send('pointermove', to, fromEl)

        send('drag', to, fromEl)

        send('mouseover', to)

        send('pointerover', to)

        send('dragover', to)

        send('mousemove', to)

        send('pointermove', to)

        send('drag', to)

        send('mouseup', to)

        send('pointerup', to)

        send('dragend', to)

        send('drop', to)


        _log.snapshot('after', { at: 1 }).end()


      })


    })


  }


  const $el = subject

  const fromCoords = getCoords($el)

  const toCoords = getCoords(cy.$$(to))


  drag(fromCoords, toCoords, opts.steps)

}


const getCoords = ($el) => {

  const domRect = $el[0].getBoundingClientRect()

  const coords = { x: domRect.left + (domRect.width / 2 || 0), y: domRect.top + (domRect.height / 2 || 0) }


  return coords

}


Cypress.Commands.addAll(

  { prevSubject: 'element' },

  {

    dragTo,

  }

)

以下是您如何使用它：


describe('mxGraph "ports" example', function () {

  beforeEach(() => {

    cy.visit('https://jgraph.github.io/mxgraph/javascript/examples/ports.html')

    cy.get('div#splash').should('not.be.visible')

  })


  // Example #1 : FAIL

  it('#1 Create new object by dragging', function () {

    cy.get('div[id="sidebarContainer"]').find('img[title="Drag this to the diagram to create a new vertex"]').first()

    .dragTo('div[id="graphContainer"]')

  })

})


查看完整回答
反對(duì) 回復(fù) 2021-11-12
  • 1 回答
  • 0 關(guān)注
  • 149 瀏覽
慕課專欄
更多

添加回答

舉報(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)