feat(utils): 新增 selectElement，selectElementLast，selectElementExists，s…

…electElementAll

package.json

@@ -130,6 +130,7 @@
     "toposort": "^2.0.2",
     "tough-cookie": "^4.0.0",
     "tough-cookie-redisstore": "^0.0.4",
+    "typed-query-selector": "^2.6.0",
     "uuid": "^8.3.2",
     "yup": "~0.31.1"
   },

src/utils/__snapshots__/selectDom.test.ts.snap

@@ -0,0 +1,251 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`selectDom selectElement - baseElement 正常 1`] = `
+<input
+  class="input"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElement - baseElement 正常 2`] = `
+<input
+  class="input"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElement - baseElement 正常 3`] = `
+<input
+  class="input2"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElement - baseElement 正常 4`] = `
+<input
+  class="input"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElement - baseElement 正常 5`] = `
+<input
+  class="input2"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElement - baseElement 正常 6`] = `
+<button
+  class="button"
+  data-main="true"
+>
+  按钮
+</button>
+`;
+
+exports[`selectDom selectElement - selectors 正常 1`] = `
+<input
+  class="input"
+/>
+`;
+
+exports[`selectDom selectElement - selectors 正常 2`] = `
+<input
+  class="input2"
+/>
+`;
+
+exports[`selectDom selectElement 正常 1`] = `
+<input
+  class="input"
+/>
+`;
+
+exports[`selectDom selectElement 正常 2`] = `
+<input
+  class="input"
+/>
+`;
+
+exports[`selectDom selectElement 正常 3`] = `
+<input
+  class="input2"
+/>
+`;
+
+exports[`selectDom selectElement 正常 4`] = `
+<input
+  class="input"
+/>
+`;
+
+exports[`selectDom selectElement 正常 5`] = `
+<input
+  class="input2"
+/>
+`;
+
+exports[`selectDom selectElementAll - selectors 正常 1`] = `
+Array [
+  <input
+    class="input"
+  />,
+  <input
+    class="input2"
+  />,
+  <button
+    class="button"
+  >
+    按钮
+  </button>,
+  <input
+    class="input"
+    data-main="true"
+  />,
+  <input
+    class="input2"
+    data-main="true"
+  />,
+  <button
+    class="button"
+    data-main="true"
+  >
+    按钮
+  </button>,
+]
+`;
+
+exports[`selectDom selectElementAll - selectors 正常 2`] = `
+Array [
+  <input
+    class="input2"
+  />,
+  <input
+    class="input"
+    data-main="true"
+  />,
+  <input
+    class="input2"
+    data-main="true"
+  />,
+]
+`;
+
+exports[`selectDom selectElementAll 正常 1`] = `
+Array [
+  <input
+    class="input"
+  />,
+  <input
+    class="input2"
+  />,
+  <input
+    class="input"
+    data-main="true"
+  />,
+  <input
+    class="input2"
+    data-main="true"
+  />,
+]
+`;
+
+exports[`selectDom selectElementAll 正常 2`] = `
+Array [
+  <input
+    class="input"
+  />,
+  <input
+    class="input"
+    data-main="true"
+  />,
+]
+`;
+
+exports[`selectDom selectElementAll 正常 3`] = `
+Array [
+  <input
+    class="input2"
+  />,
+  <input
+    class="input2"
+    data-main="true"
+  />,
+]
+`;
+
+exports[`selectDom selectElementAll 正常 4`] = `
+Array [
+  <input
+    class="input"
+  />,
+  <input
+    class="input"
+    data-main="true"
+  />,
+]
+`;
+
+exports[`selectDom selectElementAll 正常 5`] = `
+Array [
+  <input
+    class="input2"
+  />,
+  <input
+    class="input2"
+    data-main="true"
+  />,
+]
+`;
+
+exports[`selectDom selectElementAll 正常 6`] = `
+Array [
+  <button
+    class="button"
+  >
+    按钮
+  </button>,
+  <button
+    class="button"
+    data-main="true"
+  >
+    按钮
+  </button>,
+]
+`;
+
+exports[`selectDom selectElementLast 正常 1`] = `
+<input
+  class="input2"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElementLast 正常 2`] = `
+<input
+  class="input"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElementLast 正常 3`] = `
+<input
+  class="input2"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElementLast 正常 4`] = `
+<input
+  class="input"
+  data-main="true"
+/>
+`;
+
+exports[`selectDom selectElementLast 正常 5`] = `
+<input
+  class="input2"
+  data-main="true"
+/>
+`;

src/utils/index.ts

@@ -69,6 +69,7 @@ export * from './roundTo'
 export * from './run'
 export * from './sampleBy'
 export * from './sampleIndex'
+export * from './selectDom'
 export * from './swap'
 export * from './traverse'
 export * from './TreeData'

src/utils/selectDom.test.ts

@@ -0,0 +1,88 @@
+import {
+  selectElement,
+  selectElementAll,
+  selectElementExists,
+  selectElementLast,
+} from './selectDom'
+
+describe('selectDom', () => {
+  beforeAll(() => {
+    const content = document.createElement('div')
+    content.innerHTML = `
+      <div>
+        <input class="input" />
+        <input class="input2" />
+        <button class="button">按钮</button>
+      </div>
+
+      <div id="main">
+        <input data-main="true" class="input" />
+        <input data-main="true" class="input2" />
+        <button data-main="true" class="button">按钮</button>
+      </div>
+    `
+    document.body.appendChild(content)
+  })
+
+  test('selectElement 正常', () => {
+    expect(selectElement('input')).toMatchSnapshot()
+    expect(selectElement('input.input')).toMatchSnapshot()
+    expect(selectElement('input.input2')).toMatchSnapshot()
+    expect(selectElement('.input')).toMatchSnapshot()
+    expect(selectElement('.input2')).toMatchSnapshot()
+    expect(selectElement('button.button')?.textContent?.trim()).toBe('按钮')
+  })
+
+  test('selectElementLast 正常', () => {
+    expect(selectElementLast('input')).toMatchSnapshot()
+    expect(selectElementLast('input.input')).toMatchSnapshot()
+    expect(selectElementLast('input.input2')).toMatchSnapshot()
+    expect(selectElementLast('.input')).toMatchSnapshot()
+    expect(selectElementLast('.input2')).toMatchSnapshot()
+    expect(selectElementLast('button.button')?.textContent?.trim()).toBe('按钮')
+  })
+
+  test('selectElementExists 正常', () => {
+    expect(selectElementExists('input')).toBeTrue()
+    expect(selectElementExists('input.input')).toBeTrue()
+    expect(selectElementExists('input.input2')).toBeTrue()
+    expect(selectElementExists('.input')).toBeTrue()
+    expect(selectElementExists('.input2')).toBeTrue()
+    expect(selectElementExists('button.button')).toBeTrue()
+    expect(selectElementExists('div.x')).toBeFalse()
+  })
+
+  test('selectElementAll 正常', () => {
+    expect(selectElementAll('input')).toMatchSnapshot()
+    expect(selectElementAll('input.input')).toMatchSnapshot()
+    expect(selectElementAll('input.input2')).toMatchSnapshot()
+    expect(selectElementAll('.input')).toMatchSnapshot()
+    expect(selectElementAll('.input2')).toMatchSnapshot()
+    expect(selectElementAll('button.button')).toMatchSnapshot()
+  })
+
+  test('selectElement - baseElement 正常', () => {
+    expect(selectElement('input', selectElement('#main'))).toMatchSnapshot()
+    expect(
+      selectElement('input.input', selectElement('#main')),
+    ).toMatchSnapshot()
+    expect(
+      selectElement('input.input2', selectElement('#main')),
+    ).toMatchSnapshot()
+    expect(selectElement('.input', selectElement('#main'))).toMatchSnapshot()
+    expect(selectElement('.input2', selectElement('#main'))).toMatchSnapshot()
+    expect(
+      selectElement('button.button', selectElement('#main')),
+    ).toMatchSnapshot()
+  })
+
+  test('selectElement - selectors 正常', () => {
+    expect(selectElement(['input', 'button'])).toMatchSnapshot()
+    expect(selectElement(['.input2', '#main .input'])).toMatchSnapshot()
+  })
+
+  test('selectElementAll - selectors 正常', () => {
+    expect(selectElementAll(['input', 'button'])).toMatchSnapshot()
+    expect(selectElementAll(['.input2', '#main .input'])).toMatchSnapshot()
+  })
+})