dom-probe2.mjs 1.7 KB

12345678910111213141516171819202122232425262728
  1. import { chromium } from 'playwright'
  2. const b = await chromium.launch()
  3. const ctx = await b.newContext({ viewport: { width: 1400, height: 900 } })
  4. const p = await ctx.newPage()
  5. await p.goto('http://localhost:8080/')
  6. await p.fill('input[placeholder="请输入账号"]', 'admin')
  7. await p.fill('input[placeholder="请输入密码"]', '123456')
  8. await p.click('button.login-btn')
  9. await p.waitForTimeout(1500)
  10. await p.goto('http://localhost:8080/#/customization/hsbc/equity-products/add')
  11. await p.waitForTimeout(2000)
  12. const r = await p.evaluate(() => {
  13. const tb = document.querySelector('.ql-toolbar')
  14. const root = tb?.parentElement // .quill-editor wrapper
  15. const formItem = root?.closest('.el-form-item')
  16. const formItemContent = root?.closest('.el-form-item__content')
  17. const editor = document.querySelector('.ql-editor')
  18. return {
  19. root: root ? { cls: root.className, display: getComputedStyle(root).display, w: getComputedStyle(root).width, h: getComputedStyle(root).height, position: getComputedStyle(root).position } : null,
  20. formItem: formItem ? { h: getComputedStyle(formItem).height, mb: getComputedStyle(formItem).marginBottom } : null,
  21. formItemContent: formItemContent ? { h: getComputedStyle(formItemContent).height, display: getComputedStyle(formItemContent).display } : null,
  22. toolbar: tb ? { h: getComputedStyle(tb).height } : null,
  23. container: document.querySelector('.ql-container') ? { h: getComputedStyle(document.querySelector('.ql-container')).height, position: getComputedStyle(document.querySelector('.ql-container')).position } : null,
  24. editor: editor ? { h: getComputedStyle(editor).height, minH: getComputedStyle(editor).minHeight } : null
  25. }
  26. })
  27. console.log(JSON.stringify(r, null, 2))
  28. await b.close()