test: dialog add

jest.config.js

@@ -7,7 +7,7 @@ module.exports = {
     '^.+\\.ts$': 'ts-jest' // ts 文件用 ts-jest 转换
   },
   // 匹配 __tests__ 目录下的 .js/.ts 文件 或其他目录下的 xx.test.js/ts xx.spec.js/ts
-  testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.(ts|tsx)$',
+  testRegex: '(/__tests__/*|(\\.|/)(test|spec))\\.(ts|tsx)$',
   //testRegex: '__tests__.action.spec.ts',
   // 支持源代码中相同的 `@` -> `src` 别名
   moduleNameMapper: {

src/packages/__VUE/dialog/__tests__/dialog.ts

@@ -0,0 +1,84 @@
+import Dialog from '../index.vue';
+import { render, createVNode, h } from 'vue';
+export class DialogOptions {
+  title?: string = '';
+  content?: string = '';
+  cancelText?: string = '取消';
+  okText?: string = '确定';
+  textAlign?: string = 'center';
+  teleport?: String | HTMLElement = 'body';
+
+  // function
+  onUpdate?: Function = (value: boolean) => {};
+  onOk?: Function = () => {};
+  onCancel?: Function = () => {};
+  onClose?: Function = () => {};
+  onClosed?: Function = () => {};
+
+  visible?: boolean = true;
+  noFooter?: boolean = false;
+  noOkBtn?: boolean = false;
+  noCancelBtn?: boolean = false;
+  okBtnDisabled?: boolean = false;
+  closeOnPopstate?: boolean = false;
+  lockScroll?: boolean = false;
+}
+
+class DialogFunction {
+  options: DialogOptions = new DialogOptions();
+
+  constructor(_options: DialogOptions) {
+    let options = Object.assign(this.options, _options);
+    let elWarp: HTMLElement = document.body;
+    let teleport = options.teleport as string;
+    if (teleport != 'body') {
+      if (typeof teleport == 'string') {
+        elWarp = document.querySelector(teleport) as HTMLElement;
+      } else {
+        elWarp = options.teleport as HTMLElement;
+      }
+    }
+    const root = document.createElement('view');
+    root.id = 'dialog-' + new Date().getTime();
+    const Wrapper = {
+      setup() {
+        options.onUpdate = (val: boolean) => {
+          if (val == false) {
+            elWarp.removeChild(root);
+          }
+        };
+        options.teleport = `#${root.id}`;
+        return () => {
+          return h(Dialog, options);
+        };
+      }
+    };
+    const instance: any = createVNode(Wrapper);
+    elWarp.appendChild(root);
+    render(instance, root);
+  }
+
+  close = () => {
+    // if (instance) {
+    //   instance.component.ctx.close();
+    // }
+  };
+
+  setDefaultOptions = (options: DialogOptions) => {
+    // Object.assign(this.currentOptions, options);
+  };
+
+  resetDefaultOptions = () => {
+    // Dialog.currentOptions = { ...Dialog.defaultOptions };
+  };
+}
+
+const _Dialog = function (options: DialogOptions) {
+  return new DialogFunction(options);
+};
+_Dialog.install = (app: any) => {
+  app.use(Dialog);
+  app.config.globalProperties.$dialog = _Dialog;
+};
+export { Dialog };
+export default _Dialog;

src/packages/__VUE/dialog/__tests__/function.spec.ts

@@ -0,0 +1,23 @@
+import DialogFunction from './dialog';
+
+function sleep(delay = 0): Promise<void> {
+  return new Promise((resolve) => {
+    setTimeout(resolve, delay);
+  });
+}
+
+describe('function Dialog', () => {
+  test('show dialog info ', async () => {
+    console.log(DialogFunction);
+    DialogFunction({
+      title: 'title',
+      content: 'content'
+    });
+    await sleep(1000);
+    expect(document.querySelector('.nut-dialog')).toBeTruthy();
+    let textTitle = document.querySelector('.nut-dialog .nut-dialog__header') as HTMLDivElement;
+    expect(textTitle.innerHTML).toEqual('title');
+    let content = document.querySelector('.nut-dialog .nut-dialog__content view') as HTMLDivElement;
+    expect(content.innerHTML).toEqual('content');
+  });
+});

src/packages/__VUE/dialog/__tests__/index.spec.ts

@@ -1,11 +1,9 @@
 import { config, mount } from '@vue/test-utils';
 import DialogTemplate from '../index.vue';
-import { Dialog } from '../index';
 import Icon from '../../icon/index.vue';
 import Popup from '../../popup/index.vue';
 import Button from '../../button/index.vue';
 import OverLay from '../../overLay/index.vue';
-import { nextTick } from 'vue';
 
 beforeAll(() => {
   config.global.components = {
@@ -40,13 +38,13 @@ test('should render dialog template', async () => {
   expect(await overLay.find('.nut-dialog__content'));
 });
 
-test('should render dialog methods', async () => {
-  // Dialog({
-  //   title: '基础弹框',
-  //   content: '支持函数调用和组件调用两种方式。',
-  //   onCancel,
-  //   onOk
-  // });
-  // const overLay = wrapper.getComponent(OverLay);
-  // expect(await overLay.find('.nut-dialog__content'))
-});
+// test('should render dialog methods', async () => {
+// Dialog({
+//   title: '基础弹框',
+//   content: '支持函数调用和组件调用两种方式。',
+//   onCancel,
+//   onOk
+// });
+// const overLay = wrapper.getComponent(OverLay);
+// expect(await overLay.find('.nut-dialog__content'))
+// });