fix(link): remove link's emits declare and add e2e test for click event (#1944)

Author: shenjunjian

examples/sites/demos/pc/app/link/basic-usage-composition-api.vue

@@ -1,12 +1,16 @@
 <template>
   <div>
-    <tiny-link>默认链接</tiny-link>
+    <tiny-link @click="handleClick">默认链接</tiny-link>
     <tiny-link value="默认链接2"></tiny-link>
   </div>
 </template>
 
 <script setup>
 import { Link as TinyLink } from '@opentiny/vue'
+
+function handleClick() {
+  console.log('clicked')
+}
 </script>
 
 <style scoped>

examples/sites/demos/pc/app/link/basic-usage.spec.ts

@@ -10,4 +10,15 @@ test('基础用法', async ({ page }) => {
   await expect(link.nth(1)).toHaveText('默认链接2')
   await link.first().hover()
   await expect(link.first()).toHaveCSS('color', 'rgb(82, 110, 204)')
+
+  // 测试点击
+  const values = [] as string[]
+  page.on('console', async (msg) => {
+    for (const arg of msg.args()) {
+      values.push(await arg.jsonValue())
+    }
+  })
+  await link.first().click()
+
+  expect(values[0]).toBe('clicked')
 })

examples/sites/demos/pc/app/link/basic-usage.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-link>默认链接</tiny-link>
+    <tiny-link @click="handleClick">默认链接</tiny-link>
     <tiny-link value="默认链接2"></tiny-link>
   </div>
 </template>
@@ -11,6 +11,11 @@ import { Link } from '@opentiny/vue'
 export default {
   components: {
     TinyLink: Link
+  },
+  methods: {
+    handleClick() {
+      console.log('clicked')
+    }
   }
 }
 </script>

examples/sites/demos/pc/app/link/webdoc/link.js

@@ -9,8 +9,14 @@ export default {
         'en-US': 'Basic Usage'
       },
       desc: {
-        'zh-CN': '<p>通过 <code>value</code> 或者默认插槽设置链接显示内容。</p>',
-        'en-US': '<p>Set the link to display content via <code>value</code> or the default slot. </p></p>'
+        'zh-CN': `
+          通过 <code>value</code> 或者默认插槽设置链接显示内容。<br>
+          绑定 <code>click</code> 事件监听点击。 当禁用或配置 <code>href</code> 属性时， 不会触发<code>click</code>事件！
+        `,
+        'en-US': `
+          Set the link to display content via <code>value</code> or the default slot. 
+          Bind the click event to listen for clicks.The click event is not triggered when the href attribute is disabled or configured!
+          `
       },
       codeFiles: ['basic-usage.vue']
     },

packages/vue/src/link/package.json

@@ -1,15 +1,12 @@
 {
   "name": "@opentiny/vue-link",
-  "version": "3.18.0",
+  "type": "module",
+  "version": "3.18.1",
   "description": "",
+  "license": "MIT",
+  "sideEffects": false,
   "main": "lib/index.js",
   "module": "index.ts",
-  "sideEffects": false,
-  "type": "module",
-  "devDependencies": {
-    "@opentiny-internal/vue-test-utils": "workspace:*",
-    "vitest": "^0.31.0"
-  },
   "scripts": {
     "build": "pnpm -w build:ui $npm_package_name",
     "//postversion": "pnpm build"
@@ -19,5 +16,8 @@
     "@opentiny/vue-renderless": "workspace:~",
     "@opentiny/vue-theme": "workspace:~"
   },
-  "license": "MIT"
-}
+  "devDependencies": {
+    "@opentiny-internal/vue-test-utils": "workspace:*",
+    "vitest": "^0.31.0"
+  }
+}

packages/vue/src/link/src/index.ts

@@ -37,17 +37,6 @@ export const linkProps = {
 export default defineComponent({
   name: $prefix + 'Link',
   props: linkProps,
-  emits: {
-    click(_ev: MouseEvent) {
-      return true
-    }
-  },
-  slots: Object as SlotsType<{
-    /** 默认插槽 */
-    default: {}
-    /** 图标插槽 */
-    icon: {}
-  }>,
   setup(props, context) {
     return $setup({ props, context, template })
   }