diff --git a/package.json b/package.json
index c2707220..0a494e7b 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
     "init": "yarn && yarn run link && cd example && yarn",
     "dev": "cd example && yarn run dev",
     "link": "node ./scripts/link",
-    "codeformat": "prettier --write packages/quark-reactify/src/**/*.ts",
+    "codeformat": "prettier --write packages/quark/src/**/*.test.js",
     "clean": "lerna clean -y",
     "prepare": "husky install",
     "copydocs": "node ./scripts/copydocs",
diff --git a/packages/quark/src/cell/index.test.js b/packages/quark/src/cell/index.test.js
index 3b4d8cf0..a27c5228 100644
--- a/packages/quark/src/cell/index.test.js
+++ b/packages/quark/src/cell/index.test.js
@@ -1,40 +1,41 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/cell';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/cell";
 
 const data = {
-  title: '标题',
-  desc : '描述',
-  to : '#/button'
-}
+  title: "标题",
+  desc: "描述",
+  to: "#/button",
+};
 let el;
 
-describe('<quark-cell>', async () => {
-  it('to attribute', async () => {
+describe("<quark-cell>", async () => {
+  it("to attribute", async () => {
     el = await fixture(
-        `<quark-cell 
+      `<quark-cell 
         to=${data.to}
         >
-        </quark-cell>`);
+        </quark-cell>`
+    );
     expect(el.to).to.be.equal(data.to);
   });
 
-
-  it('title attribute', async () => {
+  it("title attribute", async () => {
     el = await fixture(
-        `<quark-cell title=${data.title}>
-        </quark-cell>`);
-    const titleE = el.shadowRoot.querySelector('.title');
+      `<quark-cell title=${data.title}>
+        </quark-cell>`
+    );
+    const titleE = el.shadowRoot.querySelector(".title");
     expect(titleE.innerHTML).to.equal(data.title);
     expect(el.title).to.equal(data.title);
   });
 
-  it('desc attribute', async () => {
+  it("desc attribute", async () => {
     el = await fixture(
-        `<quark-cell desc=${data.desc}>
-        </quark-cell>`);
-    const descE = el.shadowRoot.querySelector('.desc');
+      `<quark-cell desc=${data.desc}>
+        </quark-cell>`
+    );
+    const descE = el.shadowRoot.querySelector(".desc");
     expect(descE.innerHTML).to.equal(data.desc);
     expect(el.desc).to.equal(data.desc);
   });
-
 });
diff --git a/packages/quark/src/checkbox/index.test.js b/packages/quark/src/checkbox/index.test.js
index 41736498..620db9d4 100644
--- a/packages/quark/src/checkbox/index.test.js
+++ b/packages/quark/src/checkbox/index.test.js
@@ -1,54 +1,55 @@
-import { expect, fixture, html } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/checkbox';
+import { expect, fixture, html } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/checkbox";
 const data = {
-  disabled: 'true',
-  shape: 'square',
-  size : 'big',
+  disabled: "true",
+  shape: "square",
+  size: "big",
   checked: true,
-}
+};
 let el;
-describe('quark-checkbox', async () => {
+describe("quark-checkbox", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-checkbox 
+      `<quark-checkbox 
       disabled=${data.disabled} 
       shape=${data.shape} 
       size=${data.size}
       checked=${data.checked}
     >
-    </quark-checkbox>`);
+    </quark-checkbox>`
+    );
   });
 
-  it('checkbox exist', async () => {
-    const badge = el.shadowRoot.querySelector('.quark-checkbox-wrapper');
+  it("checkbox exist", async () => {
+    const badge = el.shadowRoot.querySelector(".quark-checkbox-wrapper");
     expect(badge).to.exist;
   });
 
-  it('disabled attribute', () => {
+  it("disabled attribute", () => {
     expect(el.type).to.equal(data.type);
   });
 
-  it('shape attribute', () => {
+  it("shape attribute", () => {
     expect(el.content).to.equal(data.content);
   });
 
-  it('size attribute', () => {
+  it("size attribute", () => {
     expect(el.size).to.equal(data.size);
   });
 
-  it('checked attribute', () => {
+  it("checked attribute", () => {
     expect(el.checked).to.equal(data.checked);
   });
 
-  it('click Event', async() => {
+  it("click Event", async () => {
     const node = await fixture(
       `<quark-checkbox :checked="false">方形</quark-checkbox>`
     );
     const eventspy = sinon.spy();
-    node.addEventListener('change', eventspy);
-    const checkbox = node.shadowRoot.querySelector('.quark-checkbox-wrapper');
-    checkbox.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    node.addEventListener("change", eventspy);
+    const checkbox = node.shadowRoot.querySelector(".quark-checkbox-wrapper");
+    checkbox.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
 });
diff --git a/packages/quark/src/countdown/index.test.js b/packages/quark/src/countdown/index.test.js
index 7569ce36..bc9c5027 100644
--- a/packages/quark/src/countdown/index.test.js
+++ b/packages/quark/src/countdown/index.test.js
@@ -1,66 +1,69 @@
-
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/button';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/button";
 
 const data = {
-  slotText: '主要按钮',
-  disabled : false,
-  type : 'primary',
-  icon : 'user',
+  slotText: "主要按钮",
+  disabled: false,
+  type: "primary",
+  icon: "user",
   loading: true,
-  shape: 'round',
-}
+  shape: "round",
+};
 let el;
 
-describe('<quark-button>', async () => {
-
-    it('icon exist', async () => {
+describe("<quark-button>", async () => {
+  it("icon exist", async () => {
     el = await fixture(
-        `<quark-button 
+      `<quark-button 
           icon=${data.user}
         >
           ${data.slotText}
-        </quark-button>`);
-    const icon = el.shadowRoot.querySelector('.icon');
+        </quark-button>`
+    );
+    const icon = el.shadowRoot.querySelector(".icon");
     expect(icon).to.exist;
   });
 
-
-  it('disabled attribute', async () => {
+  it("disabled attribute", async () => {
     el = await fixture(
-        `<quark-button disabled=${data.disabled}>
+      `<quark-button disabled=${data.disabled}>
           ${data.slotText}
-        </quark-button>`);
+        </quark-button>`
+    );
     expect(el.disabled).to.equal(data.disabled);
   });
 
-  it('type attribute', async () => {
+  it("type attribute", async () => {
     el = await fixture(
-        `<quark-button type=${data.type}>
+      `<quark-button type=${data.type}>
           ${data.slotText}
-        </quark-button>`);
+        </quark-button>`
+    );
     expect(el.type).to.equal(data.type);
   });
 
-  it('loading attribute', async () => {
+  it("loading attribute", async () => {
     el = await fixture(
-        `<quark-button loading=${data.loading}>
+      `<quark-button loading=${data.loading}>
           ${data.slotText}
-        </quark-button>`);
+        </quark-button>`
+    );
     expect(el.loading).to.equal(data.loading);
   });
 
-  it('shape attribute', async () => {
+  it("shape attribute", async () => {
     el = await fixture(
-        `<quark-button shape=${data.shape}>
+      `<quark-button shape=${data.shape}>
           ${data.slotText}
-        </quark-button>`);
+        </quark-button>`
+    );
     expect(el.shape).to.equal(data.shape);
   });
 
-  it('slot attribute', async () => {
+  it("slot attribute", async () => {
     el = await fixture(
-      `<quark-button shape=${data.shape}>${data.slotText}</quark-button>`);
+      `<quark-button shape=${data.shape}>${data.slotText}</quark-button>`
+    );
     const slot = el.textContent;
     expect(data.slotText).to.equal(slot);
   });
diff --git a/packages/quark/src/datetimepicker/index.test.js b/packages/quark/src/datetimepicker/index.test.js
index 7ba98c04..bdf5caca 100644
--- a/packages/quark/src/datetimepicker/index.test.js
+++ b/packages/quark/src/datetimepicker/index.test.js
@@ -1,31 +1,31 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/datetime-picker';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/datetime-picker";
 
 const data = {
-  title: '请选择时间',
+  title: "请选择时间",
   open: true,
-  bottomhidden : true,
-}
+  bottomhidden: true,
+};
 let el;
 
-describe('<quark-datetime-picker>', async () => {
-
-    it('element exist', async () => {
-      el = await fixture(
-        `<quark-datetime-picker
+describe("<quark-datetime-picker>", async () => {
+  it("element exist", async () => {
+    el = await fixture(
+      `<quark-datetime-picker
           title=${data.title}
           open=${data.open}
         >
-        </quark-datetime-picker>`);
-      const container = el.shadowRoot.querySelector('.picker-container');
-      const header = el.shadowRoot.querySelector('.picker-header');
-      const headerTitle = el.shadowRoot.querySelector('.header-title');
-      const content = el.shadowRoot.querySelector('.picker-content');
-      const bottom = el.shadowRoot.querySelector('.picker-bottom');
-      expect(container).to.exist;
-      expect(header).to.exist;
-      expect(headerTitle).to.exist;
-      expect(content).to.exist;
-      expect(bottom).to.exist;
+        </quark-datetime-picker>`
+    );
+    const container = el.shadowRoot.querySelector(".picker-container");
+    const header = el.shadowRoot.querySelector(".picker-header");
+    const headerTitle = el.shadowRoot.querySelector(".header-title");
+    const content = el.shadowRoot.querySelector(".picker-content");
+    const bottom = el.shadowRoot.querySelector(".picker-bottom");
+    expect(container).to.exist;
+    expect(header).to.exist;
+    expect(headerTitle).to.exist;
+    expect(content).to.exist;
+    expect(bottom).to.exist;
   });
 });
diff --git a/packages/quark/src/dialog/index.test.js b/packages/quark/src/dialog/index.test.js
index 97a714fb..11466668 100644
--- a/packages/quark/src/dialog/index.test.js
+++ b/packages/quark/src/dialog/index.test.js
@@ -1,31 +1,31 @@
-import { expect, fixture  } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/dialog/index';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/dialog/index";
 const data = {
-  'title': '我是标题',
-  'oktext': '确定',
-  'canceltext': '取消',
+  title: "我是标题",
+  oktext: "确定",
+  canceltext: "取消",
 };
 let el;
-describe('quark-dialog base attribute', async () => {
+describe("quark-dialog base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-dialog
-        title=${data['title']}
-        oktext=${data['oktext']}
-        canceltext=${data['canceltext']}
+        title=${data["title"]}
+        oktext=${data["oktext"]}
+        canceltext=${data["canceltext"]}
         
     >
     </quark-dialog>`
     );
   });
-  it('quark-dialog exist', async () => {
-    const dialog = el.shadowRoot.querySelector('.dialog');
+  it("quark-dialog exist", async () => {
+    const dialog = el.shadowRoot.querySelector(".dialog");
     expect(dialog).to.exist;
   });
 
-  it('title attribute', () => {
-    expect(el.title).to.equal(data['title']);
+  it("title attribute", () => {
+    expect(el.title).to.equal(data["title"]);
   });
 
   // it('content attribute', () => {
@@ -33,59 +33,55 @@ describe('quark-dialog base attribute', async () => {
   //   expect(el.content).to.equal(data['content']);
   // });
 
-  it('oktext attribute', () => {
-    expect(el['oktext']).to.equal(data['oktext']);
+  it("oktext attribute", () => {
+    expect(el["oktext"]).to.equal(data["oktext"]);
   });
 
-  it('canceltext attribute', () => {
-    expect(el['canceltext']).to.equal(data['canceltext']);
+  it("canceltext attribute", () => {
+    expect(el["canceltext"]).to.equal(data["canceltext"]);
   });
-  
-  it('close slot ', async () => {
-    const closeSlot =  `<span slot="close">关闭</span>`
-    el = await fixture(
-        `<quark-dialog>${closeSlot}</quark-dialog>`);
+
+  it("close slot ", async () => {
+    const closeSlot = `<span slot="close">关闭</span>`;
+    el = await fixture(`<quark-dialog>${closeSlot}</quark-dialog>`);
     const closeNode = el.shadowRoot.querySelector("slot[name='close']");
     const slotResult = closeNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(closeSlot);
   });
 
-  it('footer slot ', async () => {
-    const footerSlot =  `<span slot="footer">窗脚</span>`
-    el = await fixture(
-        `<quark-dialog>${footerSlot}</quark-dialog>`);
+  it("footer slot ", async () => {
+    const footerSlot = `<span slot="footer">窗脚</span>`;
+    el = await fixture(`<quark-dialog>${footerSlot}</quark-dialog>`);
     const footerNode = el.shadowRoot.querySelector("slot[name='footer']");
     const slotResult = footerNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(footerSlot);
   });
-
 });
 
-describe('quark-dialog Dom attribute', async () => {
-
-  it('cancelBtn event', async() => {
+describe("quark-dialog Dom attribute", async () => {
+  it("cancelBtn event", async () => {
     const node = await fixture(
       `<quark-dialog
       >
         </quark-dialog>`
     );
-    const cancelBtn = node.shadowRoot.querySelector('#cancelBtn');
-    const eventspy = sinon.spy()  
-    node.addEventListener('cancel', eventspy);
-    cancelBtn.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    const cancelBtn = node.shadowRoot.querySelector("#cancelBtn");
+    const eventspy = sinon.spy();
+    node.addEventListener("cancel", eventspy);
+    cancelBtn.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
 
-  it('okBtn event', async() => {
+  it("okBtn event", async () => {
     const node = await fixture(
       `<quark-dialog
       >
         </quark-dialog>`
     );
-    const okBtn = node.shadowRoot.querySelector('#okBtn');
-    const eventspy = sinon.spy()  
-    node.addEventListener('confirm', eventspy);
-    okBtn.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    const okBtn = node.shadowRoot.querySelector("#okBtn");
+    const eventspy = sinon.spy();
+    node.addEventListener("confirm", eventspy);
+    okBtn.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
-})
+});
diff --git a/packages/quark/src/empty/index.test.js b/packages/quark/src/empty/index.test.js
index 7a3a339f..a40eec51 100644
--- a/packages/quark/src/empty/index.test.js
+++ b/packages/quark/src/empty/index.test.js
@@ -1,44 +1,46 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/empty';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/empty";
 
 const data = {
-  title:'暂无数据',
-  desc:'暂无数据'
-}
+  title: "暂无数据",
+  desc: "暂无数据",
+};
 let el;
 
-describe('<quark-empty>', async () => {
-  it('element exist', async () => {
+describe("<quark-empty>", async () => {
+  it("element exist", async () => {
     el = await fixture(
-        `<quark-empty >
-        </quark-empty>`);
-    const desc = el.shadowRoot.querySelector('#desc');
+      `<quark-empty >
+        </quark-empty>`
+    );
+    const desc = el.shadowRoot.querySelector("#desc");
     expect(desc).to.null;
   });
 
-  it('title attribute', async () => {
+  it("title attribute", async () => {
     el = await fixture(
-        `<quark-empty title=${data.title}>
-        </quark-empty>`);
-    const titleE = el.shadowRoot.querySelector('#title');
+      `<quark-empty title=${data.title}>
+        </quark-empty>`
+    );
+    const titleE = el.shadowRoot.querySelector("#title");
     expect(titleE.innerHTML).to.equal(data.title);
     expect(el.title).to.equal(data.title);
   });
 
-  it('desc attribute', async () => {
+  it("desc attribute", async () => {
     el = await fixture(
-        `<quark-empty desc=${data.desc}>
-        </quark-empty>`);
-    const descE = el.shadowRoot.querySelector('#desc');
+      `<quark-empty desc=${data.desc}>
+        </quark-empty>`
+    );
+    const descE = el.shadowRoot.querySelector("#desc");
     expect(descE.innerHTML).to.equal(data.desc);
     expect(el.desc).to.equal(data.desc);
   });
-  
-  it('slot attribute', async () => {
-    const slot = '<span>我是空状态</span>'
-    el = await fixture(
-        `<quark-empty desc=${data.desc}>${slot}</quark-empty>`);
-    const descE = el.shadowRoot.querySelector('slot');
+
+  it("slot attribute", async () => {
+    const slot = "<span>我是空状态</span>";
+    el = await fixture(`<quark-empty desc=${data.desc}>${slot}</quark-empty>`);
+    const descE = el.shadowRoot.querySelector("slot");
     const slotResult = descE.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(slot);
   });
diff --git a/packages/quark/src/field/index.test.js b/packages/quark/src/field/index.test.js
index a06079c4..d4f345d4 100644
--- a/packages/quark/src/field/index.test.js
+++ b/packages/quark/src/field/index.test.js
@@ -1,22 +1,22 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/field/index';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/field/index";
 const data = {
-  name: 'test',
-  label: '标题',
-  value: '12',
-  defaultvalue: '12',
-  type: 'text',
-  placeholder: '你好啊',
-  max: '12',
-  maxlength: '13',
-  min: '10',
-  minlength: '12',
-  errormsg: '不能为空'
+  name: "test",
+  label: "标题",
+  value: "12",
+  defaultvalue: "12",
+  type: "text",
+  placeholder: "你好啊",
+  max: "12",
+  maxlength: "13",
+  min: "10",
+  minlength: "12",
+  errormsg: "不能为空",
 };
 let el;
 // color size 无法测试
-describe('quark-field base attribute', async () => {
+describe("quark-field base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-field
@@ -35,70 +35,67 @@ describe('quark-field base attribute', async () => {
     );
   });
 
-
-  it('quark-field name attribute ', async () => {
+  it("quark-field name attribute ", async () => {
     expect(el.name).to.equal(data.name);
   });
 
-  it('quark-field value attribute ', async () => {
+  it("quark-field value attribute ", async () => {
     expect(el.value).to.equal(data.value);
   });
 
-  it('quark-field defaultvalue attribute ', async () => {
+  it("quark-field defaultvalue attribute ", async () => {
     expect(el.defaultvalue).to.equal(data.defaultvalue);
   });
 
-  it('quark-field type attribute ', async () => {
+  it("quark-field type attribute ", async () => {
     expect(el.type).to.equal(data.type);
   });
-  
-  it('quark-field placeholder attribute ', async () => {
+
+  it("quark-field placeholder attribute ", async () => {
     expect(el.placeholder).to.equal(data.placeholder);
   });
 
-  it('quark-field max attribute ', async () => {
+  it("quark-field max attribute ", async () => {
     expect(el.max).to.equal(data.max);
   });
 
-  it('quark-field maxlength attribute ', async () => {
+  it("quark-field maxlength attribute ", async () => {
     expect(el.maxlength).to.equal(data.maxlength);
   });
 
-  it('quark-field minlength attribute ', async () => {
+  it("quark-field minlength attribute ", async () => {
     expect(el.minlength).to.equal(data.minlength);
   });
 
-  it('quark-field min attribute ', async () => {
+  it("quark-field min attribute ", async () => {
     expect(el.min).to.equal(data.min);
   });
 
-  it('quark-field errormsg attribute ', async () => {
+  it("quark-field errormsg attribute ", async () => {
     expect(el.errormsg).to.equal(data.errormsg);
   });
-  
-  it('label slot', async () => {
-    const slot = `<span slot="label">我是标题</span>`
-    el = await fixture(
-       `<quark-field>${slot}</quark-field>`);
-        const descE = el.shadowRoot.querySelector("slot[name='label']");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+
+  it("label slot", async () => {
+    const slot = `<span slot="label">我是标题</span>`;
+    el = await fixture(`<quark-field>${slot}</quark-field>`);
+    const descE = el.shadowRoot.querySelector("slot[name='label']");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
-  it('quark-field event', async() => {
-    const eventspy = sinon.spy(); 
-    const blurEventspy = sinon.spy(); 
-    const focesEventspy = sinon.spy(); 
-    el.addEventListener('change', eventspy);
-    el.addEventListener('blur', blurEventspy);
-    el.addEventListener('focus', focesEventspy);
-    const input = el.shadowRoot.querySelector('input');
-    if(!input) return
-    input.dispatchEvent(new Event('change'));
-    input.dispatchEvent(new Event('blur'));
-    input.dispatchEvent(new Event('focus'));
-    expect(eventspy.called).to.equal(false); 
-    expect(blurEventspy.called).to.equal(false); 
-    expect(focesEventspy.called).to.equal(false); 
+  it("quark-field event", async () => {
+    const eventspy = sinon.spy();
+    const blurEventspy = sinon.spy();
+    const focesEventspy = sinon.spy();
+    el.addEventListener("change", eventspy);
+    el.addEventListener("blur", blurEventspy);
+    el.addEventListener("focus", focesEventspy);
+    const input = el.shadowRoot.querySelector("input");
+    if (!input) return;
+    input.dispatchEvent(new Event("change"));
+    input.dispatchEvent(new Event("blur"));
+    input.dispatchEvent(new Event("focus"));
+    expect(eventspy.called).to.equal(false);
+    expect(blurEventspy.called).to.equal(false);
+    expect(focesEventspy.called).to.equal(false);
   });
-
 });
diff --git a/packages/quark/src/form/index.test.js b/packages/quark/src/form/index.test.js
index ab7f3a44..899a4fa1 100644
--- a/packages/quark/src/form/index.test.js
+++ b/packages/quark/src/form/index.test.js
@@ -1,27 +1,27 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/form';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/form";
 
 let el;
 
-describe('<quark-progress>', async () => {
+describe("<quark-progress>", async () => {
   before(async () => {
     el = await fixture(
       `<quark-form
       >
-      </quark-form>`);
+      </quark-form>`
+    );
   });
 
-  it('quark-form exist', async () => {
-    const form = el.shadowRoot.querySelector('form');
+  it("quark-form exist", async () => {
+    const form = el.shadowRoot.querySelector("form");
     expect(form).to.exist;
   });
-  
-  it('slot ', async () => {
-    const slot = `<quark-field name="age"></quark-field>`
-    el = await fixture(
-       `<quark-form>${slot}</quark-form>`);
-        const descE = el.shadowRoot.querySelector("slot");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+
+  it("slot ", async () => {
+    const slot = `<quark-field name="age"></quark-field>`;
+    el = await fixture(`<quark-form>${slot}</quark-form>`);
+    const descE = el.shadowRoot.querySelector("slot");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
 });
diff --git a/packages/quark/src/grid/index.test.js b/packages/quark/src/grid/index.test.js
index 124c55ff..0e04c24d 100644
--- a/packages/quark/src/grid/index.test.js
+++ b/packages/quark/src/grid/index.test.js
@@ -1,40 +1,39 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/grid';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/grid";
 const data = {
-  column : '3',
-  square : true,
+  column: "3",
+  square: true,
   noborder: true,
-  text : '文字',
-  icon: 'https://m.hellobike.com/resource/helloyun/16682/dyElZ_img.png',
-}
+  text: "文字",
+  icon: "https://m.hellobike.com/resource/helloyun/16682/dyElZ_img.png",
+};
 let el;
-describe('<quark-grid>', async () => {
+describe("<quark-grid>", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-grid column=${data.column} square=${data.square} noborder=${data.noborder}> 
+      `<quark-grid column=${data.column} square=${data.square} noborder=${data.noborder}> 
       <quark-grid-item icon=${data.icon} text=${data.text} />
       <quark-grid-item icon=${data.icon} text=${data.text} />
       <quark-grid-item icon=${data.icon} text=${data.text} />
       <quark-grid-item icon=${data.icon} text=${data.text} />
     </quark-grid>`
-  );
+    );
   });
 
-  it('element exist', async () => {
-    const container = el.shadowRoot.querySelector('.container');
+  it("element exist", async () => {
+    const container = el.shadowRoot.querySelector(".container");
     expect(container).to.exist;
   });
 
-  it('column attribute', () => {
+  it("column attribute", () => {
     expect(el.column).to.equal(data.column);
   });
 
-  it('square attribute', () => {
+  it("square attribute", () => {
     expect(el.square).to.equal(data.square);
   });
 
-  it('noborder attribute', () => {
+  it("noborder attribute", () => {
     expect(el.noborder).to.equal(data.noborder);
   });
-  
 });
diff --git a/packages/quark/src/icon/index.test.js b/packages/quark/src/icon/index.test.js
index 0d0ab3f2..39c0f575 100644
--- a/packages/quark/src/icon/index.test.js
+++ b/packages/quark/src/icon/index.test.js
@@ -1,36 +1,38 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/icon';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/icon";
 
 const data = {
-  name: 'user',
-  size : '26',
-  color : '#666'
-}
+  name: "user",
+  size: "26",
+  color: "#666",
+};
 let el;
 
-describe('<quark-icon>', async () => {
-  it('icon exist', async () => {
+describe("<quark-icon>", async () => {
+  it("icon exist", async () => {
     el = await fixture(
-        `<quark-icon 
+      `<quark-icon 
             name=${data.name}
         >
-        </quark-icon>`);
-    const icon = el.shadowRoot.querySelector('.icon');
+        </quark-icon>`
+    );
+    const icon = el.shadowRoot.querySelector(".icon");
     expect(icon).to.exist;
   });
 
-  it('size attribute', async () => {
+  it("size attribute", async () => {
     el = await fixture(
-        `<quark-icon size=${data.size}>
-        </quark-icon>`);
+      `<quark-icon size=${data.size}>
+        </quark-icon>`
+    );
     expect(el.size).to.equal(data.size);
   });
 
-  it('color attribute', async () => {
+  it("color attribute", async () => {
     el = await fixture(
-        `<quark-icon color=${data.color}>
-        </quark-icon>`);
+      `<quark-icon color=${data.color}>
+        </quark-icon>`
+    );
     expect(el.color).to.equal(data.color);
   });
-
 });
diff --git a/packages/quark/src/image/index.test.js b/packages/quark/src/image/index.test.js
index 66ca9d8b..6edc80ba 100644
--- a/packages/quark/src/image/index.test.js
+++ b/packages/quark/src/image/index.test.js
@@ -1,20 +1,20 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/image';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/image";
 
 const data = {
-  src: 'https://m.hellobike.com/resource/helloyun/13459/_zZAz_2546.jpg_wh300.jpg',
-  alt: '哈士奇',
-  width: '100px',
-  height: '100px',
+  src: "https://m.hellobike.com/resource/helloyun/13459/_zZAz_2546.jpg_wh300.jpg",
+  alt: "哈士奇",
+  width: "100px",
+  height: "100px",
   lazy: false,
   round: false,
-  raidus: '50px',
-  fit: 'scale-down'
+  raidus: "50px",
+  fit: "scale-down",
 };
 
 let el;
 
-describe('<quark-image>', async () => {
+describe("<quark-image>", async () => {
   // it('element exist', async () => {
   //   el = await fixture(
   //     `<quark-image
@@ -23,7 +23,6 @@ describe('<quark-image>', async () => {
   //   const img = el.shadowRoot.querySelector('img');
   //   expect(img).to.exist;
   // });
-
   // it('element attribute exist', async () => {
   //   el = await fixture(
   //     `<quark-image
diff --git a/packages/quark/src/imagepreview/index.test.js b/packages/quark/src/imagepreview/index.test.js
index 592e7600..8ff25abd 100644
--- a/packages/quark/src/imagepreview/index.test.js
+++ b/packages/quark/src/imagepreview/index.test.js
@@ -1 +1 @@
-// Tip: 没有 props  属性暂时不需要
\ No newline at end of file
+// Tip: 没有 props  属性暂时不需要
diff --git a/packages/quark/src/list/index.test.js b/packages/quark/src/list/index.test.js
index 1f352e23..c6998140 100644
--- a/packages/quark/src/list/index.test.js
+++ b/packages/quark/src/list/index.test.js
@@ -1,122 +1,135 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/list';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/list";
 
 const data = {
   error: false,
   finished: false,
   loading: false,
   offset: 300,
-  errortext: '错误提示',
-  loadingtext: '加载中',
-  finishedtext: '加载完成',
-  textcolor: '提示文字颜色'
-}
+  errortext: "错误提示",
+  loadingtext: "加载中",
+  finishedtext: "加载完成",
+  textcolor: "提示文字颜色",
+};
 let el;
 
-describe('<quark-list>', async () => {
-  it('element exist', async () => {
+describe("<quark-list>", async () => {
+  it("element exist", async () => {
     el = await fixture(
-        `<quark-list >
-        </quark-list>`);
-    const list  = el.shadowRoot.querySelector('.list');
+      `<quark-list >
+        </quark-list>`
+    );
+    const list = el.shadowRoot.querySelector(".list");
     expect(list).to.exist;
   });
 
-  it('error attribute', async () => {
+  it("error attribute", async () => {
     el = await fixture(
-        `<quark-list error=${data.error}>
-        </quark-list>`);
+      `<quark-list error=${data.error}>
+        </quark-list>`
+    );
     expect(el.error).to.equal(data.error);
   });
 
-  it('finished attribute', async () => {
+  it("finished attribute", async () => {
     el = await fixture(
-        `<quark-list finished=${data.finished}>
-        </quark-list>`);
+      `<quark-list finished=${data.finished}>
+        </quark-list>`
+    );
     expect(el.finished).to.equal(data.finished);
   });
 
-  it('loading attribute', async () => {
+  it("loading attribute", async () => {
     el = await fixture(
-        `<quark-list loading=${data.loading}>
-        </quark-list>`);
+      `<quark-list loading=${data.loading}>
+        </quark-list>`
+    );
     expect(el.loading).to.equal(data.loading);
   });
 
-  it('offset attribute', async () => {
+  it("offset attribute", async () => {
     el = await fixture(
-        `<quark-list offset=${data.offset}>
-        </quark-list>`);
+      `<quark-list offset=${data.offset}>
+        </quark-list>`
+    );
     expect(el.offset).to.equal(data.offset);
   });
 
-  it('errortext attribute', async () => {
+  it("errortext attribute", async () => {
     el = await fixture(
-        `<quark-list errortext=${data.errortext}>
-        </quark-list>`);
+      `<quark-list errortext=${data.errortext}>
+        </quark-list>`
+    );
     expect(el.errortext).to.equal(data.errortext);
   });
 
-  it('loadingtext attribute', async () => {
+  it("loadingtext attribute", async () => {
     el = await fixture(
-        `<quark-list loadingtext=${data.loadingtext}>
-        </quark-list>`);
+      `<quark-list loadingtext=${data.loadingtext}>
+        </quark-list>`
+    );
     expect(el.loadingtext).to.equal(data.loadingtext);
   });
 
-  it('finishedtext attribute', async () => {
+  it("finishedtext attribute", async () => {
     el = await fixture(
-        `<quark-list finishedtext=${data.finishedtext}>
-        </quark-list>`);
+      `<quark-list finishedtext=${data.finishedtext}>
+        </quark-list>`
+    );
     expect(el.finishedtext).to.equal(data.finishedtext);
   });
 
-  it('textcolor attribute', async () => {
+  it("textcolor attribute", async () => {
     el = await fixture(
-        `<quark-list textcolor=${data.textcolor}>
-        </quark-list>`);
+      `<quark-list textcolor=${data.textcolor}>
+        </quark-list>`
+    );
     expect(el.textcolor).to.equal(data.textcolor);
   });
 
-  it('content slot ', async () => {
-    const contentSlot =  `<span slot="content">content</span>`
+  it("content slot ", async () => {
+    const contentSlot = `<span slot="content">content</span>`;
     el = await fixture(
-        `<quark-list>
+      `<quark-list>
          ${contentSlot}
-        </quark-list>`);
+        </quark-list>`
+    );
     const contentNode = el.shadowRoot.querySelector("slot[name='content']");
     const slotResult = contentNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(contentSlot);
   });
 
-  it('finished slot ', async () => {
-    const finishedSlot =  `<span slot="finished">finished</span>`
+  it("finished slot ", async () => {
+    const finishedSlot = `<span slot="finished">finished</span>`;
     el = await fixture(
-        `<quark-list finished="true">
+      `<quark-list finished="true">
          ${finishedSlot}
-        </quark-list>`);
+        </quark-list>`
+    );
     const finishedNode = el.shadowRoot.querySelector("slot[name='finished']");
     const slotResult = finishedNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(finishedSlot);
   });
 
-  it('error slot ', async () => {
-    const errorSlot =  `<span slot="error">error</span>`
+  it("error slot ", async () => {
+    const errorSlot = `<span slot="error">error</span>`;
     el = await fixture(
-        `<quark-list error="true">
+      `<quark-list error="true">
          ${errorSlot}
-        </quark-list>`);
+        </quark-list>`
+    );
     const node = el.shadowRoot.querySelector("slot[name='error']");
     const slotResult = node.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(errorSlot);
   });
 
-  it('loading slot ', async () => {
-    const slot =  `<span slot="loading">loading</span>`
+  it("loading slot ", async () => {
+    const slot = `<span slot="loading">loading</span>`;
     el = await fixture(
-        `<quark-list loading="true">
+      `<quark-list loading="true">
          ${slot}
-        </quark-list>`);
+        </quark-list>`
+    );
     const node = el.shadowRoot.querySelector("slot[name='loading']");
     const slotResult = node.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(slot);
diff --git a/packages/quark/src/loading/index.test.js b/packages/quark/src/loading/index.test.js
index a6746839..e4a6f620 100644
--- a/packages/quark/src/loading/index.test.js
+++ b/packages/quark/src/loading/index.test.js
@@ -1,11 +1,11 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/loading';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/loading";
 let el;
 const data = {
-  color:'red',
-  size:40
-}
-describe('quark-loading', async () => {
+  color: "red",
+  size: 40,
+};
+describe("quark-loading", async () => {
   before(async () => {
     el = await fixture(
       `<quark-loading color=${data.color} size=${data.size}>
@@ -13,8 +13,8 @@ describe('quark-loading', async () => {
       </quark-loading>`
     );
   });
-  it('quark-loading exist', async () => {
-    const loading = el.shadowRoot.querySelector('.spinner-loading');
+  it("quark-loading exist", async () => {
+    const loading = el.shadowRoot.querySelector(".spinner-loading");
     expect(loading).to.exist;
   });
 
@@ -22,5 +22,4 @@ describe('quark-loading', async () => {
   //   expect(el.color).to.equal(data.color);
   //   expect(el.size).to.equal(data.size);
   // });
-
 });
diff --git a/packages/quark/src/marketdialog/index.test.js b/packages/quark/src/marketdialog/index.test.js
index 5f6cbb7b..9d3e4285 100644
--- a/packages/quark/src/marketdialog/index.test.js
+++ b/packages/quark/src/marketdialog/index.test.js
@@ -1,41 +1,41 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/progress';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/progress";
 
 const data = {
-  value: '10',
-  color : 'red',
-}
+  value: "10",
+  color: "red",
+};
 let el;
 
-describe('<quark-progress>', async () => {
+describe("<quark-progress>", async () => {
   before(async () => {
     el = await fixture(
       `<quark-progress 
         value=${data.value}
         color=${data.color}
       >
-      </quark-progress>`);
+      </quark-progress>`
+    );
   });
 
-  it('quark-progress exist', async () => {
-    const progress = el.shadowRoot.querySelector('.progress');
+  it("quark-progress exist", async () => {
+    const progress = el.shadowRoot.querySelector(".progress");
     expect(progress).to.exist;
   });
-  
-  it('quark-progress value attribute', async () => {
+
+  it("quark-progress value attribute", async () => {
     expect(el.value).to.equal(data.value);
   });
 
-  it('quark-progress color attribute', async () => {
+  it("quark-progress color attribute", async () => {
     expect(el.color).to.equal(data.color);
   });
 
-  it('slot percent', async () => {
-    const slot = `<span slot="percent">我是右标题</span>`
-    el = await fixture(
-       `<quark-progress>${slot}</quark-progress>`);
-        const descE = el.shadowRoot.querySelector("slot[name=percent]");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+  it("slot percent", async () => {
+    const slot = `<span slot="percent">我是右标题</span>`;
+    el = await fixture(`<quark-progress>${slot}</quark-progress>`);
+    const descE = el.shadowRoot.querySelector("slot[name=percent]");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
 });
diff --git a/packages/quark/src/marquee/index.test.js b/packages/quark/src/marquee/index.test.js
index cd91741a..8c733033 100644
--- a/packages/quark/src/marquee/index.test.js
+++ b/packages/quark/src/marquee/index.test.js
@@ -1,12 +1,13 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/marquee/index';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/marquee/index";
 let el;
 const data = {
-  title: '这是一段多行隐藏的新闻3月25日起，湖北境内铁路客运逐步恢复出,请大家提前购买好车票依次上车，不要坐错车',
-  speed: '100'
-}
+  title:
+    "这是一段多行隐藏的新闻3月25日起，湖北境内铁路客运逐步恢复出,请大家提前购买好车票依次上车，不要坐错车",
+  speed: "100",
+};
 // color size 无法测试
-describe('quark-marquee base attribute', async () => {
+describe("quark-marquee base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-marquee
@@ -17,17 +18,16 @@ describe('quark-marquee base attribute', async () => {
     );
   });
 
-  it('quark-marquee exist', async () => {
-    const marquee = el.shadowRoot.querySelector('.title');
+  it("quark-marquee exist", async () => {
+    const marquee = el.shadowRoot.querySelector(".title");
     expect(marquee).to.exist;
   });
 
-  it('quark-marquee title attribute ', async () => {
+  it("quark-marquee title attribute ", async () => {
     expect(el.title).to.equal(data.title);
   });
-  
-  it('quark-marquee speed attribute ', async () => {
+
+  it("quark-marquee speed attribute ", async () => {
     expect(el.speed).to.equal(data.speed);
   });
-
-});
\ No newline at end of file
+});
diff --git a/packages/quark/src/nativeuploader/index.test.js b/packages/quark/src/nativeuploader/index.test.js
index 626ce57f..c93a6a41 100644
--- a/packages/quark/src/nativeuploader/index.test.js
+++ b/packages/quark/src/nativeuploader/index.test.js
@@ -1,21 +1,20 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/uploader';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/uploader";
 
 const data = {
-  name:'uploader',
-  accept: '*',
+  name: "uploader",
+  accept: "*",
   multiple: true,
   disabled: true,
   preview: true,
   capture: true,
-  maxcount: '2',
-  maxsize: '1024'
-}
+  maxcount: "2",
+  maxsize: "1024",
+};
 let el;
 
-describe('<quark-uploader>', async () => {
-
+describe("<quark-uploader>", async () => {
   before(async () => {
     el = await fixture(
       `<quark-uploader
@@ -27,48 +26,50 @@ describe('<quark-uploader>', async () => {
         maxcount=${data.maxcount}
         maxsize=${data.maxsize}
       >
-      </quark-uploader>`);
+      </quark-uploader>`
+    );
   });
 
-  it('element exist', async () => {
-    const uploader  = el.shadowRoot.querySelector('.wrap');
+  it("element exist", async () => {
+    const uploader = el.shadowRoot.querySelector(".wrap");
     expect(uploader).to.exist;
   });
-  
-  it('name attribute', async () => {
+
+  it("name attribute", async () => {
     expect(el.name).to.equal(data.name);
   });
-  
-  it('accept attribute', async () => {
+
+  it("accept attribute", async () => {
     expect(el.accept).to.equal(data.accept);
   });
 
-  it('disabled attribute', async () => {
+  it("disabled attribute", async () => {
     expect(el.disabled).to.equal(data.disabled);
   });
 
-  it('multiple attribute', async () => {
+  it("multiple attribute", async () => {
     expect(el.multiple).to.equal(data.multiple);
   });
 
-  it('capture attribute', async () => {
+  it("capture attribute", async () => {
     expect(el.capture).to.equal(data.capture);
-  })
+  });
 
-  it('maxcount attribute', async () => {
+  it("maxcount attribute", async () => {
     expect(el.maxcount).to.equal(data.maxcount);
-  })
+  });
 
-  it('maxsize attribute', async () => {
+  it("maxsize attribute", async () => {
     expect(el.maxsize).to.equal(data.maxsize);
-  })
+  });
 
-  it('uploader slot ', async () => {
-    const titleSlot =  `<span slot="uploader">自定义上传</span>`
+  it("uploader slot ", async () => {
+    const titleSlot = `<span slot="uploader">自定义上传</span>`;
     el = await fixture(
-        `<quark-uploader>
+      `<quark-uploader>
          ${titleSlot}
-        </quark-uploader>`);
+        </quark-uploader>`
+    );
     const titleNode = el.shadowRoot.querySelector("slot[name='uploader']");
     const slotResult = titleNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(titleSlot);
@@ -78,11 +79,11 @@ describe('<quark-uploader>', async () => {
   //   const node = await fixture(
   //     '<quark-uploader/>'
   //   );
-  //   const eventspy = sinon.spy()  
+  //   const eventspy = sinon.spy()
   //   node.addEventListener('afterread', eventspy);
   //   const leftBtn = node.shadowRoot;
   //   leftBtn.dispatchEvent(new Event('change'));
   //   console.log(eventspy)
-  //   expect(eventspy.called).to.equal(true); 
+  //   expect(eventspy.called).to.equal(true);
   // });
 });
diff --git a/packages/quark/src/navbar/index.test.js b/packages/quark/src/navbar/index.test.js
index 489a1263..f736e5db 100644
--- a/packages/quark/src/navbar/index.test.js
+++ b/packages/quark/src/navbar/index.test.js
@@ -1,118 +1,115 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/navbar/index';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/navbar/index";
 const data = {
-  'lefthide': true,
-  'right': 'right',
-  title: '测试'
+  lefthide: true,
+  right: "right",
+  title: "测试",
 };
 let el;
-describe('quark-navbar base attribute', async () => {
+describe("quark-navbar base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-navbar
-        lefthide=${data['lefthide']}
-        right=${data['right']}
+        lefthide=${data["lefthide"]}
+        right=${data["right"]}
         title=${data.title}
     >
     </quark-navbar>`
     );
   });
-  it('quark-navbar exist', async () => {
-    const navbar = el.shadowRoot.querySelector('.title');
+  it("quark-navbar exist", async () => {
+    const navbar = el.shadowRoot.querySelector(".title");
     expect(navbar).to.exist;
   });
 
-  it('lefthide attribute', () => {
+  it("lefthide attribute", () => {
     expect(el.lefthide).to.exist;
   });
 
-  it('right attribute', () => {
-    expect(el.right).to.equal(data['right']);
+  it("right attribute", () => {
+    expect(el.right).to.equal(data["right"]);
   });
 
-  it('title attribute', () => {
-    expect(el['title']).to.equal(data['title']);
+  it("title attribute", () => {
+    expect(el["title"]).to.equal(data["title"]);
   });
 });
 
-describe('quark-navbar Dom attribute', async () => {
-
-  it('lefthide attribute hide', async () => {
+describe("quark-navbar Dom attribute", async () => {
+  it("lefthide attribute hide", async () => {
     const node = await fixture(
       `<quark-navbar
          lefthide=${true}
       >
         </quark-navbar>`
     );
-    const leftWrap = node.shadowRoot.querySelector('.navbar-left');
-    expect(leftWrap).to.equal(null)
+    const leftWrap = node.shadowRoot.querySelector(".navbar-left");
+    expect(leftWrap).to.equal(null);
   });
 
-  it('rightBtn attribute show', async() => {
+  it("rightBtn attribute show", async () => {
     const node = await fixture(
       `<quark-navbar
-         right=${data['right']}
+         right=${data["right"]}
       >
         </quark-navbar>`
     );
-    const rightBtn = node.shadowRoot.querySelector('#right');
+    const rightBtn = node.shadowRoot.querySelector("#right");
     expect(rightBtn).to.exist;
   });
 
-  it('rightBtn attribute hide', async() => {
+  it("rightBtn attribute hide", async () => {
     const node = await fixture(
       `<quark-navbar
       >
         </quark-navbar>`
     );
-    const rightBtn = node.shadowRoot.querySelector('#right');
-    const { innerHTML } = rightBtn
-    expect(innerHTML).to.equal('');
+    const rightBtn = node.shadowRoot.querySelector("#right");
+    const { innerHTML } = rightBtn;
+    expect(innerHTML).to.equal("");
   });
 
-  it('left-btn Event', async() => {
+  it("left-btn Event", async () => {
     const node = await fixture(
       `<quark-navbar
       >
       </quark-navbar>`
     );
-    const eventspy = sinon.spy()  
-    node.addEventListener('leftclick', eventspy);
-    const leftBtn = node.shadowRoot.getElementById('left');
-    leftBtn.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    const eventspy = sinon.spy();
+    node.addEventListener("leftclick", eventspy);
+    const leftBtn = node.shadowRoot.getElementById("left");
+    leftBtn.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
 
-  it('right-btn Event', async() => {
+  it("right-btn Event", async () => {
     const node = await fixture(
       `<quark-navbar
-        right=${data['right']}
+        right=${data["right"]}
       >
       </quark-navbar>`
     );
-    const eventspy = sinon.spy()  
-    node.addEventListener('rightclick', eventspy);
-    const leftBtn = node.shadowRoot.getElementById('right');
-    leftBtn.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    const eventspy = sinon.spy();
+    node.addEventListener("rightclick", eventspy);
+    const leftBtn = node.shadowRoot.getElementById("right");
+    leftBtn.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
 
-  it('left slot', async () => {
-    const slot = `<span slot="left">我是左标题</span>`
-    el = await fixture(
-       `<quark-navbar>${slot}</quark-navbar>`);
-        const descE = el.shadowRoot.querySelector("slot[name='left']");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+  it("left slot", async () => {
+    const slot = `<span slot="left">我是左标题</span>`;
+    el = await fixture(`<quark-navbar>${slot}</quark-navbar>`);
+    const descE = el.shadowRoot.querySelector("slot[name='left']");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
 
-  it('right slot', async () => {
-    const slot = `<span slot="right">我是右标题</span>`
-    el = await fixture(
-       `<quark-navbar>${slot}</quark-navbar>`);
-        const descE = el.shadowRoot.querySelector("slot[name='right']");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+  it("right slot", async () => {
+    const slot = `<span slot="right">我是右标题</span>`;
+    el = await fixture(`<quark-navbar>${slot}</quark-navbar>`);
+    const descE = el.shadowRoot.querySelector("slot[name='right']");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
-})
+});
diff --git a/packages/quark/src/noticebar/index.test.js b/packages/quark/src/noticebar/index.test.js
index e97a7c48..e795e6e8 100644
--- a/packages/quark/src/noticebar/index.test.js
+++ b/packages/quark/src/noticebar/index.test.js
@@ -1,52 +1,55 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/noticebar';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/noticebar";
 
 const data = {
-  text:'暂无数据',
-  desc:'暂无数据'
-}
+  text: "暂无数据",
+  desc: "暂无数据",
+};
 let el;
 
-describe('<quark-noticebar>', async () => {
-  it('element exist', async () => {
+describe("<quark-noticebar>", async () => {
+  it("element exist", async () => {
     el = await fixture(
-        `<quark-noticebar >
-        </quark-noticebar>`);
-    const noticebar  = el.shadowRoot.querySelector('slot');
+      `<quark-noticebar >
+        </quark-noticebar>`
+    );
+    const noticebar = el.shadowRoot.querySelector("slot");
     expect(noticebar).to.exist;
   });
 
-  it('text slot ', async () => {
-    const textSlot =  `<span slot="text">123</span>`
+  it("text slot ", async () => {
+    const textSlot = `<span slot="text">123</span>`;
     el = await fixture(
-        `<quark-noticebar>
+      `<quark-noticebar>
          ${textSlot}
-        </quark-noticebar>`);
+        </quark-noticebar>`
+    );
     const textNode = el.shadowRoot.querySelector("slot[name='text']");
     const slotResult = textNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(textSlot);
   });
-  
-  it('left slot ', async () => {
-    const leftSlot =  `<span slot="left">123</span>`
+
+  it("left slot ", async () => {
+    const leftSlot = `<span slot="left">123</span>`;
     el = await fixture(
-        `<quark-noticebar>
+      `<quark-noticebar>
          ${leftSlot}
-        </quark-noticebar>`);
+        </quark-noticebar>`
+    );
     const leftNode = el.shadowRoot.querySelector("slot[name='left']");
     const slotResult = leftNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(leftSlot);
   });
 
-  it('right slot ', async () => {
-    const rightSlot =  `<span slot="right">123</span>`
+  it("right slot ", async () => {
+    const rightSlot = `<span slot="right">123</span>`;
     el = await fixture(
-        `<quark-noticebar>
+      `<quark-noticebar>
          ${rightSlot}
-        </quark-noticebar>`);
+        </quark-noticebar>`
+    );
     const rightNode = el.shadowRoot.querySelector("slot[name='right']");
     const slotResult = rightNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(rightSlot);
   });
-  
 });
diff --git a/packages/quark/src/overlay/index.test.js b/packages/quark/src/overlay/index.test.js
index ea28480e..5302c907 100644
--- a/packages/quark/src/overlay/index.test.js
+++ b/packages/quark/src/overlay/index.test.js
@@ -1,36 +1,35 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/overlay';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/overlay";
 
 const data = {
   open: true,
-  zindex: 1
-}
+  zindex: 1,
+};
 let el;
 
-describe('<quark-overlay>', async () => {
-
-    it('element exist', async () => {
-      el = await fixture(
-        `<quark-overlay 
+describe("<quark-overlay>", async () => {
+  it("element exist", async () => {
+    el = await fixture(
+      `<quark-overlay 
         open=${data.open}
         zindex=${data.zindex}
         >
-        </quark-overlay>`);
-      const container = el.shadowRoot.querySelector('.content');
-      const mask = el.shadowRoot.querySelector('.mask');
-      expect(container).to.exist;
-      expect(mask).to.exist;
-      expect(el.open).to.equal(data.open);
-      expect(el.zindex).to.equal(`${data.zindex}`);
+        </quark-overlay>`
+    );
+    const container = el.shadowRoot.querySelector(".content");
+    const mask = el.shadowRoot.querySelector(".mask");
+    expect(container).to.exist;
+    expect(mask).to.exist;
+    expect(el.open).to.equal(data.open);
+    expect(el.zindex).to.equal(`${data.zindex}`);
   });
 
-  it('content slot', async () => {
-    const slot = `<div>content</div>`
-    el = await fixture(
-       `<quark-overlay>${slot}</quark-overlay>`);
-        const descE = el.shadowRoot.querySelector("slot");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+  it("content slot", async () => {
+    const slot = `<div>content</div>`;
+    el = await fixture(`<quark-overlay>${slot}</quark-overlay>`);
+    const descE = el.shadowRoot.querySelector("slot");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
 });
diff --git a/packages/quark/src/picker/index.test.js b/packages/quark/src/picker/index.test.js
index 012bf2fa..44cc4759 100644
--- a/packages/quark/src/picker/index.test.js
+++ b/packages/quark/src/picker/index.test.js
@@ -1,45 +1,44 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/picker';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/picker";
 
 const data = {
-  title: '请选择时间',
+  title: "请选择时间",
   open: true,
-  bottomhidden : true,
-}
+  bottomhidden: true,
+};
 let el;
 
-describe('<quark-picker>', async () => {
-
-    it('element exist', async () => {
-      el = await fixture(
-        `<quark-picker 
+describe("<quark-picker>", async () => {
+  it("element exist", async () => {
+    el = await fixture(
+      `<quark-picker 
         title=${data.title}
         open=${data.open}
         >
-        </quark-picker>`);
-      const container = el.shadowRoot.querySelector('.picker-container');
-      const header = el.shadowRoot.querySelector('.picker-header');
-      const headerTitle = el.shadowRoot.querySelector('.header-title');
-      const content = el.shadowRoot.querySelector('.picker-content');
-      const bottom = el.shadowRoot.querySelector('.picker-bottom');
-      expect(container).to.exist;
-      expect(header).to.exist;
-      expect(headerTitle).to.exist;
-      expect(content).to.exist;
-      expect(bottom).to.exist;
+        </quark-picker>`
+    );
+    const container = el.shadowRoot.querySelector(".picker-container");
+    const header = el.shadowRoot.querySelector(".picker-header");
+    const headerTitle = el.shadowRoot.querySelector(".header-title");
+    const content = el.shadowRoot.querySelector(".picker-content");
+    const bottom = el.shadowRoot.querySelector(".picker-bottom");
+    expect(container).to.exist;
+    expect(header).to.exist;
+    expect(headerTitle).to.exist;
+    expect(content).to.exist;
+    expect(bottom).to.exist;
   });
 
-  it('header slot', async () => {
+  it("header slot", async () => {
     const slot = `<div slot="header">
     <span class="cancel">取消</span>
     <span class="picker-title">请选择城市</span>
     <span class="ensure">确定</span>
-  </div>`
-    el = await fixture(
-       `<quark-picker>${slot}</quark-picker>`);
-        const descE = el.shadowRoot.querySelector("slot[name='header']");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+  </div>`;
+    el = await fixture(`<quark-picker>${slot}</quark-picker>`);
+    const descE = el.shadowRoot.querySelector("slot[name='header']");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
 });
diff --git a/packages/quark/src/popover/index.test.js b/packages/quark/src/popover/index.test.js
index 75e5c143..545bf570 100644
--- a/packages/quark/src/popover/index.test.js
+++ b/packages/quark/src/popover/index.test.js
@@ -1,38 +1,40 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/tooltip';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/tooltip";
 
 const data = {
-  slotText : 'tips 宿主',
-  tips: '内容',
-  placement : 'top',
-  color : 'red',
-}
+  slotText: "tips 宿主",
+  tips: "内容",
+  placement: "top",
+  color: "red",
+};
 let el;
 
-describe('<quark-tooltip>', async () => {
+describe("<quark-tooltip>", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-tooltip 
+      `<quark-tooltip 
       tips=${data.tips}
       placement=${data.placement}
       color=${data.color}
     >
       ${data.slotText}
-    </quark-tooltip>`);
+    </quark-tooltip>`
+    );
   });
 
-  it('tips attribute', async () => {
+  it("tips attribute", async () => {
     el = await fixture(
-        `<quark-tooltip tips=${data.tips}>
-        </quark-tooltip>`);
+      `<quark-tooltip tips=${data.tips}>
+        </quark-tooltip>`
+    );
     expect(el.tips).to.exist;
   });
 
-  it('placement attribute', async () => {
+  it("placement attribute", async () => {
     el = await fixture(
-        `<quark-tooltip placement=${data.placement}>
-        </quark-tooltip>`);
+      `<quark-tooltip placement=${data.placement}>
+        </quark-tooltip>`
+    );
     expect(el.placement).to.equal(data.placement);
   });
-
 });
diff --git a/packages/quark/src/popup/index.test.js b/packages/quark/src/popup/index.test.js
index 261b26a4..5ad6bfe8 100644
--- a/packages/quark/src/popup/index.test.js
+++ b/packages/quark/src/popup/index.test.js
@@ -1,74 +1,76 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/popup';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/popup";
 
 const data = {
-    slotText: '弹框内容',
-    position: 'bottom',
-    round : true,
-    open : true,
-    closeable : true
-}
+  slotText: "弹框内容",
+  position: "bottom",
+  round: true,
+  open: true,
+  closeable: true,
+};
 let el;
-  
-describe('<quark-popup>', async () => {
-  
-    it('position attribute', async () => {
-        el = await fixture(
-            `<quark-popup 
+
+describe("<quark-popup>", async () => {
+  it("position attribute", async () => {
+    el = await fixture(
+      `<quark-popup 
             position=${data.position}
           >
-          </quark-popup>`);
-        expect(el.position).to.equal(data.position);
-    });
+          </quark-popup>`
+    );
+    expect(el.position).to.equal(data.position);
+  });
 
-    it('round attribute', async () => {
-        el = await fixture(
-            `<quark-popup 
+  it("round attribute", async () => {
+    el = await fixture(
+      `<quark-popup 
             round=${data.round}
           >
-          </quark-popup>`);
-        expect(el.round).to.exist;
-    });
+          </quark-popup>`
+    );
+    expect(el.round).to.exist;
+  });
 
-    it('open attribute', async () => {
-        el = await fixture(
-            `<quark-popup 
+  it("open attribute", async () => {
+    el = await fixture(
+      `<quark-popup 
             open=${data.open}
           >
-          </quark-popup>`);
-        expect(el.open).to.exist;
-    });
+          </quark-popup>`
+    );
+    expect(el.open).to.exist;
+  });
 
-    it('closeable attribute', async () => {
-        el = await fixture(
-            `<quark-popup 
+  it("closeable attribute", async () => {
+    el = await fixture(
+      `<quark-popup 
             closeable=${data.closeable}
           >
-          </quark-popup>`);
-        expect(el.closeable).to.exist;
-    });
+          </quark-popup>`
+    );
+    expect(el.closeable).to.exist;
+  });
 
-    it('onClose event', async () => {
-        el = await fixture(
-            `<quark-popup 
+  it("onClose event", async () => {
+    el = await fixture(
+      `<quark-popup 
             closeable=${data.closeable}
           >
-          </quark-popup>`);
-        const eventspy = sinon.spy()  
-        el.addEventListener('closed', eventspy);
-        const maskRef = el.shadowRoot.getElementById('mask');
-        maskRef.dispatchEvent(new Event('click'));
-        expect(eventspy.called).to.equal(true); 
-    });
+          </quark-popup>`
+    );
+    const eventspy = sinon.spy();
+    el.addEventListener("closed", eventspy);
+    const maskRef = el.shadowRoot.getElementById("mask");
+    maskRef.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
+  });
 
-    it('slot', async () => {
-      const slot = `<span>我是右标题</span>`
-      el = await fixture(
-         `<quark-popup>${slot}</quark-popup>`);
-          const descE = el.shadowRoot.querySelector("slot");
-          const slotResult = descE.assignedNodes()[0];
-          expect(slotResult.outerHTML).to.equal(slot);
-    });
+  it("slot", async () => {
+    const slot = `<span>我是右标题</span>`;
+    el = await fixture(`<quark-popup>${slot}</quark-popup>`);
+    const descE = el.shadowRoot.querySelector("slot");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
-  
+});
diff --git a/packages/quark/src/popupextra/index.test.js b/packages/quark/src/popupextra/index.test.js
index 95654be2..8be3a993 100644
--- a/packages/quark/src/popupextra/index.test.js
+++ b/packages/quark/src/popupextra/index.test.js
@@ -1,71 +1,73 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/popupextra';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/popupextra";
 
 const data = {
-    title   : '主标题',
-    subtitle: '副标题',
-    round   : true,
-    open    : true,
-}
+  title: "主标题",
+  subtitle: "副标题",
+  round: true,
+  open: true,
+};
 let el;
-  
-describe('<quark-popupextra>', async () => {
-  
-    it('round attribute', async () => {
-        el = await fixture(
-            `<quark-popupextra 
+
+describe("<quark-popupextra>", async () => {
+  it("round attribute", async () => {
+    el = await fixture(
+      `<quark-popupextra 
             round=${data.round}
           >
-          </quark-popupextra>`);
-        expect(el.round).to.exist;
-    });
+          </quark-popupextra>`
+    );
+    expect(el.round).to.exist;
+  });
 
-    it('open attribute', async () => {
-        el = await fixture(
-            `<quark-popupextra 
+  it("open attribute", async () => {
+    el = await fixture(
+      `<quark-popupextra 
             open=${data.open}
           >
-          </quark-popupextra>`);
-        expect(el.open).to.exist;
-    });
+          </quark-popupextra>`
+    );
+    expect(el.open).to.exist;
+  });
 
-    it('title attribute', async () => {
-        el = await fixture(
-            `<quark-popupextra 
+  it("title attribute", async () => {
+    el = await fixture(
+      `<quark-popupextra 
             title=${data.title}
           >
-          </quark-popupextra>`);
-        expect(el.closeable).to.exist;
-    });
+          </quark-popupextra>`
+    );
+    expect(el.closeable).to.exist;
+  });
 
-    it('subtitle attribute', async () => {
-        el = await fixture(
-            `<quark-popupextra 
+  it("subtitle attribute", async () => {
+    el = await fixture(
+      `<quark-popupextra 
             subtitle=${data.subtitle}
           >
-          </quark-popupextra>`);
-        expect(el.closeable).to.exist;
-    });
+          </quark-popupextra>`
+    );
+    expect(el.closeable).to.exist;
+  });
 
-    it('onClose event', async () => {
-        el = await fixture(
-            `<quark-popupextra>
-          </quark-popupextra>`);
-        const eventspy = sinon.spy()  
-        el.addEventListener('closed', eventspy);
-        const maskRef = el.shadowRoot.getElementById('mask');
-        maskRef.dispatchEvent(new Event('click'));
-        expect(eventspy.called).to.equal(true); 
-    });
+  it("onClose event", async () => {
+    el = await fixture(
+      `<quark-popupextra>
+          </quark-popupextra>`
+    );
+    const eventspy = sinon.spy();
+    el.addEventListener("closed", eventspy);
+    const maskRef = el.shadowRoot.getElementById("mask");
+    maskRef.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
+  });
 
-    it('slot', async () => {
-      const slot = `<span>我是正文</span>`
-      el = await fixture(
-         `<quark-popupextra>${slot}</quark-popupextra>`);
-          const descE = el.shadowRoot.querySelector("slot");
-          const slotResult = descE.assignedNodes()[0];
-          expect(slotResult.outerHTML).to.equal(slot);
-    });
+  it("slot", async () => {
+    const slot = `<span>我是正文</span>`;
+    el = await fixture(`<quark-popupextra>${slot}</quark-popupextra>`);
+    const descE = el.shadowRoot.querySelector("slot");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
-  
+});
diff --git a/packages/quark/src/progress/index.test.js b/packages/quark/src/progress/index.test.js
index 5f6cbb7b..9d3e4285 100644
--- a/packages/quark/src/progress/index.test.js
+++ b/packages/quark/src/progress/index.test.js
@@ -1,41 +1,41 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/progress';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/progress";
 
 const data = {
-  value: '10',
-  color : 'red',
-}
+  value: "10",
+  color: "red",
+};
 let el;
 
-describe('<quark-progress>', async () => {
+describe("<quark-progress>", async () => {
   before(async () => {
     el = await fixture(
       `<quark-progress 
         value=${data.value}
         color=${data.color}
       >
-      </quark-progress>`);
+      </quark-progress>`
+    );
   });
 
-  it('quark-progress exist', async () => {
-    const progress = el.shadowRoot.querySelector('.progress');
+  it("quark-progress exist", async () => {
+    const progress = el.shadowRoot.querySelector(".progress");
     expect(progress).to.exist;
   });
-  
-  it('quark-progress value attribute', async () => {
+
+  it("quark-progress value attribute", async () => {
     expect(el.value).to.equal(data.value);
   });
 
-  it('quark-progress color attribute', async () => {
+  it("quark-progress color attribute", async () => {
     expect(el.color).to.equal(data.color);
   });
 
-  it('slot percent', async () => {
-    const slot = `<span slot="percent">我是右标题</span>`
-    el = await fixture(
-       `<quark-progress>${slot}</quark-progress>`);
-        const descE = el.shadowRoot.querySelector("slot[name=percent]");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
+  it("slot percent", async () => {
+    const slot = `<span slot="percent">我是右标题</span>`;
+    el = await fixture(`<quark-progress>${slot}</quark-progress>`);
+    const descE = el.shadowRoot.querySelector("slot[name=percent]");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
   });
 });
diff --git a/packages/quark/src/pullrefresh/index.test.js b/packages/quark/src/pullrefresh/index.test.js
index 11d213cb..a690eec8 100644
--- a/packages/quark/src/pullrefresh/index.test.js
+++ b/packages/quark/src/pullrefresh/index.test.js
@@ -1,89 +1,99 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/pull-refresh';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/pull-refresh";
 
 const data = {
-  dark: false,    
+  dark: false,
   disabled: false,
   headheight: 50,
   loading: false,
-  pullingtext: '下拉即可刷新',
-  loosingtext: '松开立即刷新',
-  loadingtext: '加载中',
-  textcolor: '提示文字颜色'
-}
+  pullingtext: "下拉即可刷新",
+  loosingtext: "松开立即刷新",
+  loadingtext: "加载中",
+  textcolor: "提示文字颜色",
+};
 let el;
 
-describe('<quark-pull-refresh>', async () => {
-  it('element exist', async () => {
+describe("<quark-pull-refresh>", async () => {
+  it("element exist", async () => {
     el = await fixture(
-        `<quark-pull-refresh >
-        </quark-pull-refresh>`);
-    const pull = el.shadowRoot.querySelector('.pull-refresh');
+      `<quark-pull-refresh >
+        </quark-pull-refresh>`
+    );
+    const pull = el.shadowRoot.querySelector(".pull-refresh");
     expect(pull).to.exist;
   });
 
-  it('dark attribute', async () => {
+  it("dark attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh dark=${data.dark}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh dark=${data.dark}>
+        </quark-pull-refresh>`
+    );
     expect(el.dark).to.equal(data.dark);
   });
 
-  it('disabled attribute', async () => {
+  it("disabled attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh disabled=${data.disabled}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh disabled=${data.disabled}>
+        </quark-pull-refresh>`
+    );
     expect(el.disabled).to.equal(data.disabled);
   });
 
-  it('loading attribute', async () => {
+  it("loading attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh loading=${data.loading}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh loading=${data.loading}>
+        </quark-pull-refresh>`
+    );
     expect(el.loading).to.equal(data.loading);
   });
 
-  it('headheight attribute', async () => {
+  it("headheight attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh headheight=${data.headheight}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh headheight=${data.headheight}>
+        </quark-pull-refresh>`
+    );
     expect(el.headheight).to.equal(data.headheight);
   });
 
-  it('pullingtext attribute', async () => {
+  it("pullingtext attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh pullingtext=${data.pullingtext}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh pullingtext=${data.pullingtext}>
+        </quark-pull-refresh>`
+    );
     expect(el.pullingtext).to.equal(data.pullingtext);
   });
 
-  it('loadingtext attribute', async () => {
+  it("loadingtext attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh loadingtext=${data.loadingtext}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh loadingtext=${data.loadingtext}>
+        </quark-pull-refresh>`
+    );
     expect(el.loadingtext).to.equal(data.loadingtext);
   });
 
-  it('loosingtext attribute', async () => {
+  it("loosingtext attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh loosingtext=${data.loosingtext}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh loosingtext=${data.loosingtext}>
+        </quark-pull-refresh>`
+    );
     expect(el.loosingtext).to.equal(data.loosingtext);
   });
 
-  it('textcolor attribute', async () => {
+  it("textcolor attribute", async () => {
     el = await fixture(
-        `<quark-pull-refresh textcolor=${data.textcolor}>
-        </quark-pull-refresh>`);
+      `<quark-pull-refresh textcolor=${data.textcolor}>
+        </quark-pull-refresh>`
+    );
     expect(el.textcolor).to.equal(data.textcolor);
   });
 
-  it('content slot ', async () => {
-    const contentSlot =  `<span slot="content">content</span>`
+  it("content slot ", async () => {
+    const contentSlot = `<span slot="content">content</span>`;
     el = await fixture(
-        `<quark-pull-refresh>
+      `<quark-pull-refresh>
          ${contentSlot}
-        </quark-pull-refresh>`);
+        </quark-pull-refresh>`
+    );
     const contentNode = el.shadowRoot.querySelector("slot[name='content']");
     const slotResult = contentNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(contentSlot);
diff --git a/packages/quark/src/radio/index.test.js b/packages/quark/src/radio/index.test.js
index 2478a86a..abd6d7bb 100644
--- a/packages/quark/src/radio/index.test.js
+++ b/packages/quark/src/radio/index.test.js
@@ -1,50 +1,50 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/radio';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/radio";
 const data = {
   disabled: true,
-  shape: 'square',
-  size : 'big',
-}
+  shape: "square",
+  size: "big",
+};
 let el;
-describe('quark-radio base attribute', async () => {
+describe("quark-radio base attribute", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-radio 
+      `<quark-radio 
       disabled=${data.disabled} 
       shape=${data.shape} 
       size=${data.size}
     >
-    </quark-radio>`);
+    </quark-radio>`
+    );
   });
 
-  it('radio exist', async () => {
-    const radio = el.shadowRoot.querySelector('.quark-radio-wrapper');
+  it("radio exist", async () => {
+    const radio = el.shadowRoot.querySelector(".quark-radio-wrapper");
     expect(radio).to.exist;
   });
 
-  it('disabled attribute', () => {
+  it("disabled attribute", () => {
     expect(el.disabled).to.equal(data.disabled);
   });
 
-  it('shape attribute', () => {
+  it("shape attribute", () => {
     expect(el.shape).to.equal(data.shape);
   });
 
-  it('size attribute', () => {
+  it("size attribute", () => {
     expect(el.size).to.equal(data.size);
   });
 
-  it('click Event', async() => {
+  it("click Event", async () => {
     const node = await fixture(
       `<quark-radio :checked="false">
       </quark-radio>`
     );
-    const eventspy = sinon.spy()  
-    node.addEventListener('change', eventspy);
-    const radio = node.shadowRoot.querySelector('.quark-radio-wrapper');
-    radio.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    const eventspy = sinon.spy();
+    node.addEventListener("change", eventspy);
+    const radio = node.shadowRoot.querySelector(".quark-radio-wrapper");
+    radio.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
-
 });
diff --git a/packages/quark/src/rate/index.test.js b/packages/quark/src/rate/index.test.js
index 9c33d017..8832f7b4 100644
--- a/packages/quark/src/rate/index.test.js
+++ b/packages/quark/src/rate/index.test.js
@@ -1,56 +1,55 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/rate/index';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/rate/index";
 let el;
 const data = {
-  value: '2',
-  size: '25',
-  icon: 'star',
-  'activeColor': 'red'
-}
+  value: "2",
+  size: "25",
+  icon: "star",
+  activeColor: "red",
+};
 // color size 无法测试
-describe('quark-rate base attribute', async () => {
+describe("quark-rate base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-rate
         value=${data.value}
         size=${data.size}
         icon=${data.icon}
-        activeColor='${data['activeColor']}'
+        activeColor='${data["activeColor"]}'
       >
       </quark-rate>`
     );
   });
 
-  it('quark-rate exist', async () => {
-    const rate = el.shadowRoot.querySelector('quark-icon');
+  it("quark-rate exist", async () => {
+    const rate = el.shadowRoot.querySelector("quark-icon");
     expect(rate).to.exist;
   });
 
-  it('quark-rate value attribute ', async () => {
+  it("quark-rate value attribute ", async () => {
     expect(el.value).to.equal(data.value);
   });
-  
-  it('quark-rate size attribute ', async () => {
+
+  it("quark-rate size attribute ", async () => {
     expect(el.size).to.equal(data.size);
   });
 
-  it('quark-rate icon attribute ', async () => {
+  it("quark-rate icon attribute ", async () => {
     expect(el.icon).to.equal(data.icon);
   });
-
 });
-describe('quark-rate Dom attribute', async () => {
-  it('change event', async() => {
+describe("quark-rate Dom attribute", async () => {
+  it("change event", async () => {
     const node = await fixture(
       `<quark-rate
       >
         </quark-rate>`
     );
-    const rate = node.shadowRoot.querySelector('quark-icon');
-    const eventspy = sinon.spy()  
-    node.addEventListener('change', eventspy);
-    rate.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(true); 
+    const rate = node.shadowRoot.querySelector("quark-icon");
+    const eventspy = sinon.spy();
+    node.addEventListener("change", eventspy);
+    rate.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(true);
   });
-})
+});
diff --git a/packages/quark/src/search/index.test.js b/packages/quark/src/search/index.test.js
index 7d09a5b9..0c89d110 100644
--- a/packages/quark/src/search/index.test.js
+++ b/packages/quark/src/search/index.test.js
@@ -1,24 +1,24 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/search';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/search";
 // import './index'
 const data = {
-  value: '默认值',
-  placeholder: 'placeholder',
-  maxlength: '5',
-  iconcolor: 'red',
+  value: "默认值",
+  placeholder: "placeholder",
+  maxlength: "5",
+  iconcolor: "red",
   dark: true,
   showback: true,
   showaction: false,
   clearable: false,
   autofocus: true,
-  actiontext: '操作按钮',
+  actiontext: "操作按钮",
   disabled: true,
-  readonly: true
+  readonly: true,
 };
 let el;
 // color size 无法测试
-describe('quark-search base attribute', async () => {
+describe("quark-search base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-search
@@ -32,112 +32,96 @@ describe('quark-search base attribute', async () => {
     );
   });
 
-  it('quark-search exist', async () => {
-    const search = el.shadowRoot.querySelector('.quark-search');
+  it("quark-search exist", async () => {
+    const search = el.shadowRoot.querySelector(".quark-search");
     expect(search).to.exist;
   });
 
-
-  it('quark-search value attribute ', async () => {
+  it("quark-search value attribute ", async () => {
     expect(el.value).to.equal(data.value);
   });
 
-  it('quark-search placeholder attribute ', async () => {
+  it("quark-search placeholder attribute ", async () => {
     expect(el.placeholder).to.equal(data.placeholder);
   });
 
-
-  it('quark-search maxlength attribute ', async () => {
+  it("quark-search maxlength attribute ", async () => {
     expect(el.maxlength).to.equal(data.maxlength);
   });
 
-  it('quark-search readonly attribute ', async () => {
+  it("quark-search readonly attribute ", async () => {
     expect(el.readonly).to.equal(data.readonly);
   });
 
-  it('quark-search disabled attribute ', async () => {
+  it("quark-search disabled attribute ", async () => {
     expect(el.disabled).to.equal(data.disabled);
   });
-
 });
-describe('quark-search Dom attribute', async () => {
-  it('dark exit', async () => {
-    const el = await fixture(
-      `<quark-search dark="true"></quark-search>`
-    );
-    const dark = el.shadowRoot.querySelector('.quark-search__dark');
+describe("quark-search Dom attribute", async () => {
+  it("dark exit", async () => {
+    const el = await fixture(`<quark-search dark="true"></quark-search>`);
+    const dark = el.shadowRoot.querySelector(".quark-search__dark");
     expect(dark).to.be.exist;
   });
 
-  it('dark null', async () => {
-    const el = await fixture(
-      `<quark-search></quark-search>`
-    );
-    const dark = el.shadowRoot.querySelector('.quark-search__dark');
+  it("dark null", async () => {
+    const el = await fixture(`<quark-search></quark-search>`);
+    const dark = el.shadowRoot.querySelector(".quark-search__dark");
     expect(dark).to.be.null;
   });
 
-  it('onBackClicked Event', async () => {
+  it("onBackClicked Event", async () => {
     const el = await fixture(
       `<quark-search showback=${data.showback}></quark-search>`
     );
     const eventspy = sinon.spy();
-    el.addEventListener('back', eventspy);
-    const backRef = el.shadowRoot.querySelector('.quark-search__back');
-    backRef.dispatchEvent(new Event('click'));
+    el.addEventListener("back", eventspy);
+    const backRef = el.shadowRoot.querySelector(".quark-search__back");
+    backRef.dispatchEvent(new Event("click"));
     expect(eventspy.called).to.equal(true);
-  })
+  });
 
-  it('onCancelClicked Event', async () => {
-    const el = await fixture(
-      `<quark-search></quark-search>`
-    );
+  it("onCancelClicked Event", async () => {
+    const el = await fixture(`<quark-search></quark-search>`);
     const eventspy = sinon.spy();
-    el.addEventListener('cancel', eventspy);
-    const cancelRef = el.shadowRoot.querySelector('.quark-search__action');
-    cancelRef.dispatchEvent(new Event('click'));
+    el.addEventListener("cancel", eventspy);
+    const cancelRef = el.shadowRoot.querySelector(".quark-search__action");
+    cancelRef.dispatchEvent(new Event("click"));
     expect(eventspy.called).to.equal(true);
-  })
+  });
 
-  it('input change Event', async () => {
-    const el = await fixture(
-      `<quark-search></quark-search>`
-    );
+  it("input change Event", async () => {
+    const el = await fixture(`<quark-search></quark-search>`);
     const eventspy = sinon.spy();
-    el.addEventListener('change', eventspy);
-    const input = el.shadowRoot.querySelector('input');
-    input.dispatchEvent(new Event('input'));
+    el.addEventListener("change", eventspy);
+    const input = el.shadowRoot.querySelector("input");
+    input.dispatchEvent(new Event("input"));
     expect(eventspy.called).to.equal(true);
-  })
+  });
 
-  it('input blur Event', async () => {
-    const el = await fixture(
-      `<quark-search></quark-search>`
-    );
+  it("input blur Event", async () => {
+    const el = await fixture(`<quark-search></quark-search>`);
     const eventspy = sinon.spy();
-    el.addEventListener('blur', eventspy);
-    const input = el.shadowRoot.querySelector('input');
-    input.dispatchEvent(new Event('blur'));
+    el.addEventListener("blur", eventspy);
+    const input = el.shadowRoot.querySelector("input");
+    input.dispatchEvent(new Event("blur"));
     expect(eventspy.called).to.equal(true);
-  })
+  });
 
-  it('input focus Event', async () => {
-    const el = await fixture(
-      `<quark-search></quark-search>`
-    );
+  it("input focus Event", async () => {
+    const el = await fixture(`<quark-search></quark-search>`);
     const eventspy = sinon.spy();
-    el.addEventListener('focus', eventspy);
-    const input = el.shadowRoot.querySelector('input');
-    input.dispatchEvent(new Event('focus'));
+    el.addEventListener("focus", eventspy);
+    const input = el.shadowRoot.querySelector("input");
+    input.dispatchEvent(new Event("focus"));
     expect(eventspy.called).to.equal(true);
-  })
-  
-  it('slot action', async () => {
-    const slot = `<span slot="action">action</span>`
-    el = await fixture(
-       `<quark-search>${slot}</quark-search>`);
-        const descE = el.shadowRoot.querySelector("slot[name=action]");
-        const slotResult = descE.assignedNodes()[0];
-        expect(slotResult.outerHTML).to.equal(slot);
   });
-});
\ No newline at end of file
+
+  it("slot action", async () => {
+    const slot = `<span slot="action">action</span>`;
+    el = await fixture(`<quark-search>${slot}</quark-search>`);
+    const descE = el.shadowRoot.querySelector("slot[name=action]");
+    const slotResult = descE.assignedNodes()[0];
+    expect(slotResult.outerHTML).to.equal(slot);
+  });
+});
diff --git a/packages/quark/src/sharesheet/index.test.js b/packages/quark/src/sharesheet/index.test.js
index 9425d260..5b02dca2 100644
--- a/packages/quark/src/sharesheet/index.test.js
+++ b/packages/quark/src/sharesheet/index.test.js
@@ -1,55 +1,71 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import ShareSheet from '../../../lib/share-sheet';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import ShareSheet from "../../../lib/share-sheet";
 
 const data = {
-    titleColor: 'red',
-    titleFontSize : 20,
-    options: [
-        { name: '微信', icon:  'https://m.hellobike.com/resource/helloyun/16682/LY3mn00VTX.png'}, 
-        { name: '微信朋友圈', icon:  'https://m.hellobike.com/resource/helloyun/16682/QOiMPs9BLj.png'}, 
-        { name: 'QQ', icon:  'https://m.hellobike.com/resource/helloyun/16682/J4TWX9Jpca.png'}, 
-        { name: 'QQ空间', icon:  'https://m.hellobike.com/resource/helloyun/16682/wG7wG2CHQx.png'}, 
-        { name: '微博', icon:  'https://m.hellobike.com/resource/helloyun/16682/vt_vyR3M8I.png'}, 
-        { name: '二维码', icon:  'https://m.hellobike.com/resource/helloyun/16682/hvu4xjJpNY.png'}, 
-    ],
-    cancelColor: 'red',
-    cancelFontSize: 20,
-}
-  
-describe('<quark-sharesheet>', async () => {
-  
-    it('sharesheet attribute', async () => {
-        const actionSheet = ShareSheet({
-            titleColor: data.titleColor,
-            titleFontSize: data.titleFontSize,
-            options: data.options,
-            cancelTextColor: data.cancelTextColor,
-            cancelTextFontSize: data.cancelTextFontSize,
-        });
-        expect(actionSheet.titleColor).to.equal(data.titleColor);
-        expect(actionSheet.titleFontSize).to.equal(data.titleFontSize);
-        expect(actionSheet.options).to.equal(data.options);
-        expect(actionSheet.cancelTextColor).to.equal(data.cancelTextColor);
-        expect(actionSheet.cancelTextFontSize).to.equal(data.cancelTextFontSize);
+  titleColor: "red",
+  titleFontSize: 20,
+  options: [
+    {
+      name: "微信",
+      icon: "https://m.hellobike.com/resource/helloyun/16682/LY3mn00VTX.png",
+    },
+    {
+      name: "微信朋友圈",
+      icon: "https://m.hellobike.com/resource/helloyun/16682/QOiMPs9BLj.png",
+    },
+    {
+      name: "QQ",
+      icon: "https://m.hellobike.com/resource/helloyun/16682/J4TWX9Jpca.png",
+    },
+    {
+      name: "QQ空间",
+      icon: "https://m.hellobike.com/resource/helloyun/16682/wG7wG2CHQx.png",
+    },
+    {
+      name: "微博",
+      icon: "https://m.hellobike.com/resource/helloyun/16682/vt_vyR3M8I.png",
+    },
+    {
+      name: "二维码",
+      icon: "https://m.hellobike.com/resource/helloyun/16682/hvu4xjJpNY.png",
+    },
+  ],
+  cancelColor: "red",
+  cancelFontSize: 20,
+};
+
+describe("<quark-sharesheet>", async () => {
+  it("sharesheet attribute", async () => {
+    const actionSheet = ShareSheet({
+      titleColor: data.titleColor,
+      titleFontSize: data.titleFontSize,
+      options: data.options,
+      cancelTextColor: data.cancelTextColor,
+      cancelTextFontSize: data.cancelTextFontSize,
     });
+    expect(actionSheet.titleColor).to.equal(data.titleColor);
+    expect(actionSheet.titleFontSize).to.equal(data.titleFontSize);
+    expect(actionSheet.options).to.equal(data.options);
+    expect(actionSheet.cancelTextColor).to.equal(data.cancelTextColor);
+    expect(actionSheet.cancelTextFontSize).to.equal(data.cancelTextFontSize);
+  });
 
-    it('event dispatch', async () => {
-        const selecEvent = sinon.spy();
-        const cancelEvent = sinon.spy()  
-        const closeEvent = sinon.spy()   
-        const actionSheet = ShareSheet({
-            options: data.options,
-            select: selecEvent,
-            cancel: cancelEvent,
-            close: closeEvent
-        });
-        actionSheet.select();
-        expect(selecEvent.called).to.equal(true); 
-        actionSheet.cancel();
-        expect(cancelEvent.called).to.equal(true); 
-        actionSheet.close();
-        expect(closeEvent.called).to.equal(true); 
+  it("event dispatch", async () => {
+    const selecEvent = sinon.spy();
+    const cancelEvent = sinon.spy();
+    const closeEvent = sinon.spy();
+    const actionSheet = ShareSheet({
+      options: data.options,
+      select: selecEvent,
+      cancel: cancelEvent,
+      close: closeEvent,
     });
+    actionSheet.select();
+    expect(selecEvent.called).to.equal(true);
+    actionSheet.cancel();
+    expect(cancelEvent.called).to.equal(true);
+    actionSheet.close();
+    expect(closeEvent.called).to.equal(true);
   });
-  
\ No newline at end of file
+});
diff --git a/packages/quark/src/skeleton/index.test.js b/packages/quark/src/skeleton/index.test.js
index 57f2c482..3c47fc6c 100644
--- a/packages/quark/src/skeleton/index.test.js
+++ b/packages/quark/src/skeleton/index.test.js
@@ -1,15 +1,15 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/skeleton';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/skeleton";
 
 let el;
 
-describe('<quark-skeleton>', async () => {
-  it('element exist', async () => {
+describe("<quark-skeleton>", async () => {
+  it("element exist", async () => {
     el = await fixture(
       `<quark-skeleton
       ></quark-skeleton>`
     );
-    const container = el.shadowRoot.querySelector('skeleton-container');
+    const container = el.shadowRoot.querySelector("skeleton-container");
     expect(container).to.exist;
   });
 });
diff --git a/packages/quark/src/stepper/index.test.js b/packages/quark/src/stepper/index.test.js
index 3934b87d..ea00d34e 100644
--- a/packages/quark/src/stepper/index.test.js
+++ b/packages/quark/src/stepper/index.test.js
@@ -1,6 +1,6 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/stepper';
-import sinon from 'sinon';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/stepper";
+import sinon from "sinon";
 
 let el;
 
@@ -10,13 +10,13 @@ const data = {
   max: 100,
   interger: true,
   disabled: true,
-  decimallength: '2',
+  decimallength: "2",
   steps: 1,
-  name: 'stepper'
-}
+  name: "stepper",
+};
 
-describe('quark-stepper base attribute', async() => {
-  before(async() => {
+describe("quark-stepper base attribute", async () => {
+  before(async () => {
     el = await fixture(
       `<quark-stepper
          value=${data.value}
@@ -29,42 +29,39 @@ describe('quark-stepper base attribute', async() => {
          steps=${data.steps}
       >
       </quark-stepper>`
-    )
-  })
-
+    );
+  });
 
-  it('quark-stepper value attribute', async () => {
+  it("quark-stepper value attribute", async () => {
     expect(el.value).to.equal(data.value);
   });
-  it('quark-stepper name attribute', async () => {
-    expect(el.name).to.equal(data.name)
+  it("quark-stepper name attribute", async () => {
+    expect(el.name).to.equal(data.name);
   });
-  it('quark-stepper min attribute', async () => {
-    expect(el.min).to.equal(data.min)
+  it("quark-stepper min attribute", async () => {
+    expect(el.min).to.equal(data.min);
   });
-  it('quark-stepper max attribute', async () => {
-    expect(el.max).to.equal(data.max)
+  it("quark-stepper max attribute", async () => {
+    expect(el.max).to.equal(data.max);
   });
-  it('quark-stepper interger attribute', async () => {
-    expect(el.interger).to.equal(data.interger)
+  it("quark-stepper interger attribute", async () => {
+    expect(el.interger).to.equal(data.interger);
   });
-  it('quark-stepper disabled attribute', async () => {
-    expect(el.disabled).to.equal(data.disabled)
+  it("quark-stepper disabled attribute", async () => {
+    expect(el.disabled).to.equal(data.disabled);
   });
-  it('quark-stepper steps attribute', async () => {
-    expect(el.steps).to.equal(data.steps)
+  it("quark-stepper steps attribute", async () => {
+    expect(el.steps).to.equal(data.steps);
   });
-})
+});
 
-describe('quark-stepper dom attribute', async () => {
-  it('change event', async() => {
-    const node = await fixture(
-      `<quark-stepper />`
-    );
-    const rate = node.shadowRoot.querySelector('#stepper');
-    const eventspy = sinon.spy()  
-    node.addEventListener('change', eventspy);
-    rate.dispatchEvent(new Event('click'));
-    expect(eventspy.called).to.equal(false); 
+describe("quark-stepper dom attribute", async () => {
+  it("change event", async () => {
+    const node = await fixture(`<quark-stepper />`);
+    const rate = node.shadowRoot.querySelector("#stepper");
+    const eventspy = sinon.spy();
+    node.addEventListener("change", eventspy);
+    rate.dispatchEvent(new Event("click"));
+    expect(eventspy.called).to.equal(false);
   });
-})
+});
diff --git a/packages/quark/src/steps/index.test.js b/packages/quark/src/steps/index.test.js
index a87340ac..e6dd403b 100644
--- a/packages/quark/src/steps/index.test.js
+++ b/packages/quark/src/steps/index.test.js
@@ -1,31 +1,31 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/steps';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/steps";
 // slot 内容无法被探测，因此只能测试 quark-steps
 const data = {
-  direction : 'vertical'
-}
+  direction: "vertical",
+};
 let el;
 
-describe('<quark-step>', async () => {
-    // it('element exist', async () => {
-    //     el = await fixture(
-    //         `<quark-steps>
-    //             <quark-step status="done" title="步骤一">1</quark-step>
-    //             <quark-step status="doing" title="步骤二">2</quark-step>
-    //             <quark-step status="todo" title="步骤三">3</quark-step>
-    //         </quark-steps>`);
-    //     const step = el.shadowRoot.querySelector('.quark-steps-horizontal');
-    //     expect(step).to.exist;
-    // });
-    // it('direction attribute', async () => {
-    //     el = await fixture(
-    //         `<quark-steps direction=${data.direction}>
-    //             <quark-step status="done" title="步骤一">1</quark-step>
-    //             <quark-step status="doing" title="步骤二">2</quark-step>
-    //             <quark-step status="todo" title="步骤三">3</quark-step>
-    //         </quark-steps>`);
-    //     const step = el.shadowRoot.querySelector('.quark-steps');
-    //     expect(step).to.exist;
-    //     expect(el.direction).to.equal(data.direction);
-    // });
-});
\ No newline at end of file
+describe("<quark-step>", async () => {
+  // it('element exist', async () => {
+  //     el = await fixture(
+  //         `<quark-steps>
+  //             <quark-step status="done" title="步骤一">1</quark-step>
+  //             <quark-step status="doing" title="步骤二">2</quark-step>
+  //             <quark-step status="todo" title="步骤三">3</quark-step>
+  //         </quark-steps>`);
+  //     const step = el.shadowRoot.querySelector('.quark-steps-horizontal');
+  //     expect(step).to.exist;
+  // });
+  // it('direction attribute', async () => {
+  //     el = await fixture(
+  //         `<quark-steps direction=${data.direction}>
+  //             <quark-step status="done" title="步骤一">1</quark-step>
+  //             <quark-step status="doing" title="步骤二">2</quark-step>
+  //             <quark-step status="todo" title="步骤三">3</quark-step>
+  //         </quark-steps>`);
+  //     const step = el.shadowRoot.querySelector('.quark-steps');
+  //     expect(step).to.exist;
+  //     expect(el.direction).to.equal(data.direction);
+  // });
+});
diff --git a/packages/quark/src/sticky/index.test.js b/packages/quark/src/sticky/index.test.js
index 8eeebbea..f2ddf444 100644
--- a/packages/quark/src/sticky/index.test.js
+++ b/packages/quark/src/sticky/index.test.js
@@ -1,23 +1,24 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/sticky/index';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/sticky/index";
 const data = {
-  'offsettop': '17vw'
-}
+  offsettop: "17vw",
+};
 let el;
-describe('<quark-sticky>', async () => {
+describe("<quark-sticky>", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-sticky offsettop=${data.offsettop}>
+      `<quark-sticky offsettop=${data.offsettop}>
       <div>基础用法</div>
-    </quark-badge>`);
+    </quark-badge>`
+    );
   });
 
-  it('sticky exist', async () => {
-    const sticky = el.shadowRoot.querySelector('#container');
+  it("sticky exist", async () => {
+    const sticky = el.shadowRoot.querySelector("#container");
     expect(sticky).to.exist;
   });
 
-  it('offsettop attribute', () => {
+  it("offsettop attribute", () => {
     expect(el.offsettop).to.equal(data.offsettop);
   });
 });
diff --git a/packages/quark/src/swipe/index.test.js b/packages/quark/src/swipe/index.test.js
index 384b654b..0f7ec821 100644
--- a/packages/quark/src/swipe/index.test.js
+++ b/packages/quark/src/swipe/index.test.js
@@ -1,23 +1,22 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/swipe';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/swipe";
 
 const data = {
-  type: 'round',
-  duration : 500,
-  interval : 3000,
-  defaultindex : 1,
+  type: "round",
+  duration: 500,
+  interval: 3000,
+  defaultindex: 1,
   autoplay: true,
-  activecolor: 'red',
-  inactivecolor: '#999',
-}
+  activecolor: "red",
+  inactivecolor: "#999",
+};
 let el;
 
-describe('<quark-swipe>', async () => {
-
-    it('element exist', async () => {
-      el = await fixture(
-        `<quark-swipe 
+describe("<quark-swipe>", async () => {
+  it("element exist", async () => {
+    el = await fixture(
+      `<quark-swipe 
         >
           <quark-swipe-item>
             <div class="one">1</div>
@@ -31,14 +30,15 @@ describe('<quark-swipe>', async () => {
           <quark-swipe-item>
             <div class="two">4</div>
           </quark-swipe-item>
-        </quark-swipe>`);
-      const swipteItemContainer = el.shadowRoot.querySelector('.container');
-      const indicatorsContainer = el.shadowRoot.querySelector('.indicators');
-      expect(swipteItemContainer).to.exist;
-      expect(indicatorsContainer).to.exist;
+        </quark-swipe>`
+    );
+    const swipteItemContainer = el.shadowRoot.querySelector(".container");
+    const indicatorsContainer = el.shadowRoot.querySelector(".indicators");
+    expect(swipteItemContainer).to.exist;
+    expect(indicatorsContainer).to.exist;
   });
 
-  it('swipe base attribute ', async () => {
+  it("swipe base attribute ", async () => {
     el = await fixture(
       `<quark-swipe 
         type=${data.type}
@@ -61,7 +61,8 @@ describe('<quark-swipe>', async () => {
         <quark-swipe-item>
           <div class="two">4</div>
         </quark-swipe-item>
-      </quark-swipe>`);
+      </quark-swipe>`
+    );
     expect(el.duration).to.equal(data.duration);
     expect(el.interval).to.equal(data.interval);
     expect(el.defaultindex).to.equal(data.defaultindex);
@@ -69,8 +70,8 @@ describe('<quark-swipe>', async () => {
     expect(el.activecolor).to.equal(data.activecolor);
     expect(el.inactivecolor).to.equal(data.inactivecolor);
   });
-  
-  it('change event', async () => {
+
+  it("change event", async () => {
     el = await fixture(
       `<quark-swipe 
       >
@@ -86,11 +87,11 @@ describe('<quark-swipe>', async () => {
         <quark-swipe-item>
           <div class="two">4</div>
         </quark-swipe-item>
-      </quark-swipe>`);
-      const eventspy = sinon.spy()  
-      el.addEventListener('change', eventspy);
-      el.dispatchChanage();
-      expect(eventspy.called).to.equal(true); 
+      </quark-swipe>`
+    );
+    const eventspy = sinon.spy();
+    el.addEventListener("change", eventspy);
+    el.dispatchChanage();
+    expect(eventspy.called).to.equal(true);
   });
-
 });
diff --git a/packages/quark/src/switch/index.test.js b/packages/quark/src/switch/index.test.js
index 3a739a30..68707ed0 100644
--- a/packages/quark/src/switch/index.test.js
+++ b/packages/quark/src/switch/index.test.js
@@ -1,10 +1,10 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/switch';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/switch";
 
 let el;
 // color size 无法测试
-describe('quark-switch base attribute', async () => {
+describe("quark-switch base attribute", async () => {
   before(async () => {
     el = await fixture(
       `<quark-switch
@@ -14,26 +14,26 @@ describe('quark-switch base attribute', async () => {
       </quark-switch>`
     );
   });
-  
-  it('quark-switch exist', async () => {
-    const switchNode = el.shadowRoot.querySelector('#switch');
+
+  it("quark-switch exist", async () => {
+    const switchNode = el.shadowRoot.querySelector("#switch");
     expect(switchNode).to.exist;
   });
 
-  it('quark-switch checked attribute', async () => {
+  it("quark-switch checked attribute", async () => {
     expect(el.checked).to.equal(true);
   });
 
-  it('quark-switch disabled attribute', async () => {
-    expect(el.disabled).to.equal(true)
+  it("quark-switch disabled attribute", async () => {
+    expect(el.disabled).to.equal(true);
   });
-  
-  it('change event', async () => {
-    const eventspy = sinon.spy()  
-    el.addEventListener('change', eventspy);
-    const switchNode = el.shadowRoot.querySelector('#switch');
-    if(!switchNode) return
-    switchNode.dispatchEvent(new Event('change'));
-    expect(eventspy.called).to.equal(false); 
+
+  it("change event", async () => {
+    const eventspy = sinon.spy();
+    el.addEventListener("change", eventspy);
+    const switchNode = el.shadowRoot.querySelector("#switch");
+    if (!switchNode) return;
+    switchNode.dispatchEvent(new Event("change"));
+    expect(eventspy.called).to.equal(false);
   });
 });
diff --git a/packages/quark/src/tab/index.test.js b/packages/quark/src/tab/index.test.js
index e45e0395..1c430497 100644
--- a/packages/quark/src/tab/index.test.js
+++ b/packages/quark/src/tab/index.test.js
@@ -1,11 +1,11 @@
-import { expect, fixture, html } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/tab';
+import { expect, fixture, html } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/tab";
 const data = {
   activekey: "1",
-}
+};
 let el;
-describe('quark-tabs base attribute', async () => {
+describe("quark-tabs base attribute", async () => {
   // before(async () => {
   //   el = await fixture(
   //   `<quark-tabs
@@ -19,16 +19,13 @@ describe('quark-tabs base attribute', async () => {
   //     </quark-tab-content>
   //   </quark-tabs>`);
   // });
-
   // it('tabs exist', async () => {
   //   const tabs = el.shadowRoot.querySelector('.tabs');
   //   expect(tabs).to.exist;
   // });
-
   // it('activekey attribute', () => {
   //   expect(el.activekey).to.equal(data.activekey);
   // });
-
   // it('change Event', async() => {
   //   const node = await fixture(
   //     `<quark-tabs activekey=${data.activekey}>
@@ -40,12 +37,10 @@ describe('quark-tabs base attribute', async () => {
   //       </quark-tab-content>
   //     </quark-tabs>`
   //   );
-  //   const eventspy = sinon.spy()  
+  //   const eventspy = sinon.spy()
   //   node.addEventListener('change', eventspy);
   //   const nav = node.shadowRoot.querySelector('#nav');
   //   nav.dispatchEvent(new Event('click'));
-  //   expect(eventspy.called).to.equal(true); 
+  //   expect(eventspy.called).to.equal(true);
   // });
-
 });
-
diff --git a/packages/quark/src/tabbar/index.test.js b/packages/quark/src/tabbar/index.test.js
index 4b66a82d..70031890 100644
--- a/packages/quark/src/tabbar/index.test.js
+++ b/packages/quark/src/tabbar/index.test.js
@@ -1,48 +1,53 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/tabbar';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/tabbar";
 
 const data = {
   fixed: false,
-  inactivecolor: '#879099',
-  activecolor: '#0088FF',
-  value: '0'
-}
+  inactivecolor: "#879099",
+  activecolor: "#0088FF",
+  value: "0",
+};
 let el;
 
-describe('<quark-tabbar>', async () => {
-  it('element exist', async () => {
+describe("<quark-tabbar>", async () => {
+  it("element exist", async () => {
     el = await fixture(
-        `<quark-tabbar>
-        </quark-tabbar>`);
-    const list  = el.shadowRoot.querySelector('.tabbar');
+      `<quark-tabbar>
+        </quark-tabbar>`
+    );
+    const list = el.shadowRoot.querySelector(".tabbar");
     expect(list).to.exist;
   });
 
-  it('fixed attribute', async () => {
+  it("fixed attribute", async () => {
     el = await fixture(
-        `<quark-tabbar fixed=${data.fixed}>
-        </quark-tabbar>`);
+      `<quark-tabbar fixed=${data.fixed}>
+        </quark-tabbar>`
+    );
     expect(el.fixed).to.equal(data.fixed);
   });
 
-  it('inactivecolor attribute', async () => {
+  it("inactivecolor attribute", async () => {
     el = await fixture(
-        `<quark-tabbar inactivecolor=${data.inactivecolor}>
-        </quark-tabbar>`);
+      `<quark-tabbar inactivecolor=${data.inactivecolor}>
+        </quark-tabbar>`
+    );
     expect(el.inactivecolor).to.equal(data.inactivecolor);
   });
 
-  it('activecolor attribute', async () => {
+  it("activecolor attribute", async () => {
     el = await fixture(
-        `<quark-tabbar activecolor=${data.activecolor}>
-        </quark-tabbar>`);
+      `<quark-tabbar activecolor=${data.activecolor}>
+        </quark-tabbar>`
+    );
     expect(el.activecolor).to.equal(data.activecolor);
   });
 
-  it('value attribute', async () => {
+  it("value attribute", async () => {
     el = await fixture(
-        `<quark-tabbar value=${data.value}>
-        </quark-tabbar>`);
+      `<quark-tabbar value=${data.value}>
+        </quark-tabbar>`
+    );
     expect(el.value).to.equal(data.value);
   });
 });
diff --git a/packages/quark/src/tabbaritem/index.test.js b/packages/quark/src/tabbaritem/index.test.js
index 9bd08172..983d3538 100644
--- a/packages/quark/src/tabbaritem/index.test.js
+++ b/packages/quark/src/tabbaritem/index.test.js
@@ -1,50 +1,54 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/tabbar-item';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/tabbar-item";
 
 const data = {
-  label: 'home',
-  icon: 'home',
-  iconsize: '20',
-  name: 'home',
-  badgecontent: '20',
-}
+  label: "home",
+  icon: "home",
+  iconsize: "20",
+  name: "home",
+  badgecontent: "20",
+};
 let el;
 
-describe('<quark-tabbar-item>', async () => {
-  it('element exist', async () => {
+describe("<quark-tabbar-item>", async () => {
+  it("element exist", async () => {
     el = await fixture(
-        `<quark-tabbar-item>
-        </quark-tabbar-item>`);
-    const item  = el.shadowRoot.querySelector('.tabbar-item');
+      `<quark-tabbar-item>
+        </quark-tabbar-item>`
+    );
+    const item = el.shadowRoot.querySelector(".tabbar-item");
     expect(item).to.exist;
   });
 
-
-  it('icon attribute', async () => {
+  it("icon attribute", async () => {
     el = await fixture(
-        `<quark-tabbar-item icon=${data.icon}>
-        </quark-tabbar-item>`);
+      `<quark-tabbar-item icon=${data.icon}>
+        </quark-tabbar-item>`
+    );
     expect(el.icon).to.equal(data.icon);
   });
 
-  it('iconsize attribute', async () => {
+  it("iconsize attribute", async () => {
     el = await fixture(
-        `<quark-tabbar-item iconsize=${data.iconsize}>
-        </quark-tabbar-item>`);
+      `<quark-tabbar-item iconsize=${data.iconsize}>
+        </quark-tabbar-item>`
+    );
     expect(el.iconsize).to.equal(data.iconsize);
   });
 
-  it('name attribute', async () => {
+  it("name attribute", async () => {
     el = await fixture(
-        `<quark-tabbar-item name=${data.name}>
-        </quark-tabbar-item>`);
+      `<quark-tabbar-item name=${data.name}>
+        </quark-tabbar-item>`
+    );
     expect(el.name).to.equal(data.name);
   });
 
-  it('badgecontent attribute', async () => {
+  it("badgecontent attribute", async () => {
     el = await fixture(
-        `<quark-tabbar-item badgecontent=${data.badgecontent}>
-        </quark-tabbar-item>`);
+      `<quark-tabbar-item badgecontent=${data.badgecontent}>
+        </quark-tabbar-item>`
+    );
     expect(el.badgecontent).to.equal(data.badgecontent);
   });
 
@@ -58,5 +62,4 @@ describe('<quark-tabbar-item>', async () => {
   //   const slotResult = node.assignedNodes()[0];
   //   expect(slotResult.outerHTML).to.equal(slot);
   // });
-
 });
diff --git a/packages/quark/src/tag/index.test.js b/packages/quark/src/tag/index.test.js
index 6eba6b41..8c86d462 100644
--- a/packages/quark/src/tag/index.test.js
+++ b/packages/quark/src/tag/index.test.js
@@ -1,18 +1,18 @@
-import { assert, expect, fixture, html } from '@open-wc/testing';
-import '../../../lib/tag';
+import { assert, expect, fixture, html } from "@open-wc/testing";
+import "../../../lib/tag";
 const data = {
-  slotText : '主要标签',
-  type : 'blue',
-  size : 'large',
-  color: '#666666',
-  textcolor: '#333333',
-  plain: true
-}
+  slotText: "主要标签",
+  type: "blue",
+  size: "large",
+  color: "#666666",
+  textcolor: "#333333",
+  plain: true,
+};
 let el;
-describe('<quark-tag>', async () => {
+describe("<quark-tag>", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-tag 
+      `<quark-tag 
       type=${data.type} 
       size=${data.size}
       plain=${data.plain}
@@ -21,34 +21,35 @@ describe('<quark-tag>', async () => {
       textcolor=${data.textcolor}
     >
       ${data.slotText}
-    </quark-tag>`);
+    </quark-tag>`
+    );
   });
 
-  it('tag exist', async () => {
-    const tag = el.shadowRoot.querySelector('.tag');
+  it("tag exist", async () => {
+    const tag = el.shadowRoot.querySelector(".tag");
     expect(tag).to.exist;
   });
 
-  it('type attribute', () => {
+  it("type attribute", () => {
     expect(el.type).to.equal(data.type);
   });
 
-  it('size attribute', () => {
+  it("size attribute", () => {
     expect(el.size).to.equal(data.size);
   });
 
-  it('plain attribute', () => {
+  it("plain attribute", () => {
     expect(el.plain).to.exist;
   });
 
-  it('light attribute', () => {
+  it("light attribute", () => {
     expect(el.light).to.exist;
   });
 
-  it('color attribute', () => {
+  it("color attribute", () => {
     expect(el.color).to.equal(data.color);
   });
-  it('textcolor attribute', () => {
+  it("textcolor attribute", () => {
     expect(el.textcolor).to.equal(data.textcolor);
   });
 });
diff --git a/packages/quark/src/toast/index.test.js b/packages/quark/src/toast/index.test.js
index 0342151f..7e3f7e66 100644
--- a/packages/quark/src/toast/index.test.js
+++ b/packages/quark/src/toast/index.test.js
@@ -1,32 +1,32 @@
-import { expect  } from '@open-wc/testing';
-import Toast from '../../../lib/toast/index';
+import { expect } from "@open-wc/testing";
+import Toast from "../../../lib/toast/index";
 const data = {
-  'text': '你好'
-}
-describe('<quark-toast>', async () => {
-  it('quark-toast type text', async () => {
+  text: "你好",
+};
+describe("<quark-toast>", async () => {
+  it("quark-toast type text", async () => {
     const toast = Toast.text(data.text);
-    expect(toast.content).equal(data.text)
+    expect(toast.content).equal(data.text);
   });
 
-  it('quark-toast type success', async () => {
+  it("quark-toast type success", async () => {
     const toast = Toast.success(data.text);
-    expect(toast.content).equal(data.text)
+    expect(toast.content).equal(data.text);
   });
 
-  it('quark-toast type error', async () => {
+  it("quark-toast type error", async () => {
     const toast = Toast.error(data.text);
-    expect(toast.content).equal(data.text)
+    expect(toast.content).equal(data.text);
   });
 
-  it('quark-toast type warning', async () => {
+  it("quark-toast type warning", async () => {
     const toast = Toast.warning(data.text);
-    expect(toast.content).equal(data.text)
+    expect(toast.content).equal(data.text);
   });
 
-  it('quark-toast type loading', async () => {
+  it("quark-toast type loading", async () => {
     const toast = Toast.loading(data.text);
-    const loading = toast.shadowRoot.querySelector('quark-loading');
+    const loading = toast.shadowRoot.querySelector("quark-loading");
     expect(loading).to.be.exist;
   });
 });
diff --git a/packages/quark/src/tooltip/index.test.js b/packages/quark/src/tooltip/index.test.js
index 75e5c143..545bf570 100644
--- a/packages/quark/src/tooltip/index.test.js
+++ b/packages/quark/src/tooltip/index.test.js
@@ -1,38 +1,40 @@
-import { expect, fixture } from '@open-wc/testing';
-import '../../../lib/tooltip';
+import { expect, fixture } from "@open-wc/testing";
+import "../../../lib/tooltip";
 
 const data = {
-  slotText : 'tips 宿主',
-  tips: '内容',
-  placement : 'top',
-  color : 'red',
-}
+  slotText: "tips 宿主",
+  tips: "内容",
+  placement: "top",
+  color: "red",
+};
 let el;
 
-describe('<quark-tooltip>', async () => {
+describe("<quark-tooltip>", async () => {
   before(async () => {
     el = await fixture(
-    `<quark-tooltip 
+      `<quark-tooltip 
       tips=${data.tips}
       placement=${data.placement}
       color=${data.color}
     >
       ${data.slotText}
-    </quark-tooltip>`);
+    </quark-tooltip>`
+    );
   });
 
-  it('tips attribute', async () => {
+  it("tips attribute", async () => {
     el = await fixture(
-        `<quark-tooltip tips=${data.tips}>
-        </quark-tooltip>`);
+      `<quark-tooltip tips=${data.tips}>
+        </quark-tooltip>`
+    );
     expect(el.tips).to.exist;
   });
 
-  it('placement attribute', async () => {
+  it("placement attribute", async () => {
     el = await fixture(
-        `<quark-tooltip placement=${data.placement}>
-        </quark-tooltip>`);
+      `<quark-tooltip placement=${data.placement}>
+        </quark-tooltip>`
+    );
     expect(el.placement).to.equal(data.placement);
   });
-
 });
diff --git a/packages/quark/src/uploader/index.test.js b/packages/quark/src/uploader/index.test.js
index 626ce57f..c93a6a41 100644
--- a/packages/quark/src/uploader/index.test.js
+++ b/packages/quark/src/uploader/index.test.js
@@ -1,21 +1,20 @@
-import { expect, fixture } from '@open-wc/testing';
-import sinon from 'sinon';
-import '../../../lib/uploader';
+import { expect, fixture } from "@open-wc/testing";
+import sinon from "sinon";
+import "../../../lib/uploader";
 
 const data = {
-  name:'uploader',
-  accept: '*',
+  name: "uploader",
+  accept: "*",
   multiple: true,
   disabled: true,
   preview: true,
   capture: true,
-  maxcount: '2',
-  maxsize: '1024'
-}
+  maxcount: "2",
+  maxsize: "1024",
+};
 let el;
 
-describe('<quark-uploader>', async () => {
-
+describe("<quark-uploader>", async () => {
   before(async () => {
     el = await fixture(
       `<quark-uploader
@@ -27,48 +26,50 @@ describe('<quark-uploader>', async () => {
         maxcount=${data.maxcount}
         maxsize=${data.maxsize}
       >
-      </quark-uploader>`);
+      </quark-uploader>`
+    );
   });
 
-  it('element exist', async () => {
-    const uploader  = el.shadowRoot.querySelector('.wrap');
+  it("element exist", async () => {
+    const uploader = el.shadowRoot.querySelector(".wrap");
     expect(uploader).to.exist;
   });
-  
-  it('name attribute', async () => {
+
+  it("name attribute", async () => {
     expect(el.name).to.equal(data.name);
   });
-  
-  it('accept attribute', async () => {
+
+  it("accept attribute", async () => {
     expect(el.accept).to.equal(data.accept);
   });
 
-  it('disabled attribute', async () => {
+  it("disabled attribute", async () => {
     expect(el.disabled).to.equal(data.disabled);
   });
 
-  it('multiple attribute', async () => {
+  it("multiple attribute", async () => {
     expect(el.multiple).to.equal(data.multiple);
   });
 
-  it('capture attribute', async () => {
+  it("capture attribute", async () => {
     expect(el.capture).to.equal(data.capture);
-  })
+  });
 
-  it('maxcount attribute', async () => {
+  it("maxcount attribute", async () => {
     expect(el.maxcount).to.equal(data.maxcount);
-  })
+  });
 
-  it('maxsize attribute', async () => {
+  it("maxsize attribute", async () => {
     expect(el.maxsize).to.equal(data.maxsize);
-  })
+  });
 
-  it('uploader slot ', async () => {
-    const titleSlot =  `<span slot="uploader">自定义上传</span>`
+  it("uploader slot ", async () => {
+    const titleSlot = `<span slot="uploader">自定义上传</span>`;
     el = await fixture(
-        `<quark-uploader>
+      `<quark-uploader>
          ${titleSlot}
-        </quark-uploader>`);
+        </quark-uploader>`
+    );
     const titleNode = el.shadowRoot.querySelector("slot[name='uploader']");
     const slotResult = titleNode.assignedNodes()[0];
     expect(slotResult.outerHTML).to.equal(titleSlot);
@@ -78,11 +79,11 @@ describe('<quark-uploader>', async () => {
   //   const node = await fixture(
   //     '<quark-uploader/>'
   //   );
-  //   const eventspy = sinon.spy()  
+  //   const eventspy = sinon.spy()
   //   node.addEventListener('afterread', eventspy);
   //   const leftBtn = node.shadowRoot;
   //   leftBtn.dispatchEvent(new Event('change'));
   //   console.log(eventspy)
-  //   expect(eventspy.called).to.equal(true); 
+  //   expect(eventspy.called).to.equal(true);
   // });
 });