@opentiny/vue-docs 2.2.5 → 2.2.7

package/demos/pc/app/infinite-scroll/basic-usage.spec.ts

@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('基础用法', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('infinite-scroll#basic-usage')
+  const infiniteList = page.locator('#basic-usage .tiny-infinite-list')
+  const infiniteListChild = infiniteList.locator('.tiny-infinite-list-item')
+  await expect(infiniteList).toBeVisible()
+  await expect(infiniteListChild.nth(0)).toBeVisible()
+  await expect(infiniteListChild.nth(0)).toHaveText('1')
+})

package/demos/pc/app/infinite-scroll/disabled.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('禁用加载', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('infinite-scroll#disabled')
+  const infiniteList = page.locator('#disabled .tiny-infinite-list-wrapper')
+  await expect(infiniteList.locator('.list')).not.toBeVisible()
+  await page.waitForTimeout(400)
+  await expect(infiniteList.locator('.list')).toBeVisible()
+})

package/demos/pc/app/infinite-scroll/webdoc/infinite-scroll.cn.md

@@ -4,4 +4,4 @@ title: Infinite Scroll 无限滚动
 
 # Infinite Scroll 无限滚动
 
-<div>滚动至容器底部时，加载更多数据</div>
+<div>滚动至容器底部时，加载更多数据。</div>

package/demos/pc/app/infinite-scroll/webdoc/infinite-scroll.js

@@ -6,7 +6,8 @@ export default {
       'demoId': 'basic-usage',
       'name': { 'zh-CN': '基本用法', 'en-US': 'Basic Usage' },
       'desc': {
-        'zh-CN': '<p>要实现滚动加载，需要在列表上添加指令 <code>v-infinite-scroll</code> 并指定加载方法，参考示例</p>\n',
+        'zh-CN':
+          '<p>要实现滚动加载，需要在列表上添加指令 <code>v-infinite-scroll</code> 并指定加载方法，参考示例。</p>\n',
         'en-US':
           '<p>To implement rolling loading, you need to add the directive <code>v-infinite-scroll</code> to the list and specify the loading method. For details, see the example. </p>\n'
       },
@@ -16,7 +17,7 @@ export default {
       'demoId': 'disabled',
       'name': { 'zh-CN': '禁用加载', 'en-US': 'Disabling loading' },
       'desc': {
-        'zh-CN': '<p>在滚动加载列表上添加属性 <code>infinite-scroll-disabled</code> 控制是否禁用加载，参考示例</p>\n',
+        'zh-CN': '<p>在滚动加载列表上添加属性 <code>infinite-scroll-disabled</code> 控制是否禁用加载，参考示例。</p>\n',
         'en-US':
           '<p>Adds the property <code>infinite-scroll-disabled</code> to the scrolling load list to control whether loading is disabled. For details, see the example. </p>\n'
       },
@@ -27,22 +28,21 @@ export default {
     {
       'name': 'infinite-scroll',
       'type': 'directive',
-      'properties': [
+      'props': [
         {
           'name': 'v-infinite-scroll',
           'type': 'Function',
           'defaultValue': '',
           'desc': {
-            'zh-CN': "无限滚动加载指令，指定加载方法",
-            'en-US':
-              "Infinite roll load instruction, specifying the load method."
+            'zh-CN': '无限滚动加载指令，指定加载方法',
+            'en-US': 'Infinite roll load instruction, specifying the load method.'
           },
           'demoId': 'basic-usage'
         },
         {
           'name': 'infinite-scroll-disabled',
           'type': 'boolean',
-          'defaultValue': '该属性的默认值为 false',
+          'defaultValue': 'false',
           'desc': {
             'zh-CN': '是否禁用滚动',
             'en-US': 'Whether to disable scrolling. '
@@ -52,19 +52,20 @@ export default {
         {
           'name': 'infinite-scroll-immediate',
           'type': 'boolean',
-          'defaultValue': '该属性的默认值为 true',
+          'defaultValue': 'true',
           'desc': {
-            'zh-CN': '是否立即加载，以防初始状态下内容无法撑满容器。',
-            'en-US': 'Indicates whether to load the container immediately to prevent the container from being full in the initial state.'
+            'zh-CN': '是否立即加载，以防初始状态下内容无法撑满容器',
+            'en-US':
+              'Indicates whether to load the container immediately to prevent the container from being full in the initial state.'
           },
           'demoId': ''
         },
         {
           'name': 'infinite-scroll-delay',
           'type': 'number',
-          'defaultValue': '该属性的默认值为 200',
+          'defaultValue': '200',
           'desc': {
-            'zh-CN': '加载延时，单位为 ms。',
+            'zh-CN': '加载延时，单位为 ms',
             'en-US': 'Loading delay, the unit is millisecond.'
           },
           'demoId': ''
@@ -72,15 +73,14 @@ export default {
         {
           'name': 'infinite-scroll-distance',
           'type': 'number',
-          'defaultValue': '该属性的默认值为 0',
+          'defaultValue': '0',
           'desc': {
-            'zh-CN': '加载触发距离阈值，单位为 px。',
-            'en-US':
-              'Threshold of the load triggering distance,the unit is px. '
+            'zh-CN': '加载触发距离阈值，单位为 px',
+            'en-US': 'Threshold of the load triggering distance,the unit is px. '
           },
           'demoId': ''
-        },
-      ],
+        }
+      ]
     }
   ]
 }

package/demos/pc/app/input/webdoc/input.js

@@ -193,7 +193,7 @@ export default {
         {
           'name': 'autocomplete',
           'type': 'string',
-          'defaultValue': 'off',
+          'defaultValue': `'off'`,
           'desc': {
             'zh-CN': '原生 autocomplete 属性',
             'en-US': 'Native autocomplete attribute'
@@ -317,7 +317,7 @@ export default {
         },
         {
           'name': 'modelValue / v-model',
-          'type': 'string , number',
+          'type': 'string | number',
           'defaultValue': '',
           'desc': {
             'zh-CN': '设置文本的绑定值',
@@ -347,7 +347,7 @@ export default {
         },
         {
           'name': 'prefix-icon',
-          'type': 'Component',
+          'type': 'VueComponent',
           'defaultValue': '',
           'desc': {
             'zh-CN': '输入框头部图标',
@@ -367,7 +367,7 @@ export default {
         },
         {
           'name': 'resize',
-          'type': '"both" | "horizontal" | "vertical" | "none"',
+          'type': `'both' | 'horizontal' | 'vertical' | 'none'`,
           'defaultValue': '',
           'desc': {
             'zh-CN': '控制是否能被用户缩放',
@@ -408,7 +408,7 @@ export default {
         },
         {
           'name': 'size',
-          'type': '"medium" | "small" | "mini"',
+          'type': `'medium' | 'small' | 'mini'`,
           'defaultValue': '',
           'desc': {
             'zh-CN': '输入框尺寸，只在 type!="textarea" 时有效',
@@ -428,7 +428,7 @@ export default {
         },
         {
           'name': 'suffix-icon',
-          'type': 'Component',
+          'type': 'VueComponent',
           'defaultValue': '',
           'desc': {
             'zh-CN': '输入框尾部图标',
@@ -441,19 +441,19 @@ export default {
           'type': 'string',
           'defaultValue': '',
           'desc': {
-            'zh-CN': '原生属性，输入框的tabindex',
+            'zh-CN': '原生属性，输入框的 tabindex',
             'en-US': 'Native attribute, tabindex in the text box'
           },
           'demoId': ''
         },
         {
           'name': 'type',
-          'type': '"text" | "textarea" | "password" | InputHTMLAttributes.type',
-          'defaultValue': 'text',
+          'type': `'text' | 'textarea' | 'password' | InputHTMLAttributes.type`,
+          'defaultValue': `'text'`,
           'desc': {
-            'zh-CN': '设置input框的type属性，默认为 text,可选值 text，textarea 和其他 原生 input 的 type 值',
+            'zh-CN': '设置 input 框的 type 属性，默认为 "text",可选值 "text"，"textarea" 和其他 原生 input 的 type 值',
             'en-US':
-              'Set the type attribute of the input box. The default value is text. The options are text, textarea, and type values of other native inputs.'
+              'Set the type attribute of the input box. The default value is "text". The options are "text", "textarea", and type values of other native inputs.'
           },
           'demoId': 'type'
         },

package/demos/pc/app/layout/webdoc/layout.js

@@ -250,7 +250,7 @@ export default {
             'en-US':
               'The right offset of the child item is offset via the left property; it is recommended to use offset instead'
           },
-          'demoId': 'offset'
+          'demoId': ''
         },
         {
           'name': 'xs',

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

@@ -1,5 +1,5 @@
 <template>
-  <tiny-link :underline="false">默认链接</tiny-link>
+  <tiny-link>默认链接</tiny-link>
 </template>
 
 <script setup lang="jsx">

package/demos/pc/app/link/basic-usage.spec.ts

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
 test('基础用法', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link#basic-usage')
-  const preview = page.locator('#preview')
+  const preview = page.locator('#basic-usage')
   const anchor = preview.locator('a')
   await anchor.hover()
   await expect(anchor).toHaveCSS('color', 'rgb(82, 110, 204)')

package/demos/pc/app/link/basic-usage.vue

@@ -1,5 +1,5 @@
 <template>
-  <tiny-link :underline="false">默认链接</tiny-link>
+  <tiny-link>默认链接</tiny-link>
 </template>
 
 <script lang="jsx">

package/demos/pc/app/link/config-href.spec.ts

@@ -3,8 +3,8 @@ import { test, expect } from '@playwright/test'
 test('链接地址', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link#config-href')
-  const preview = page.locator('#preview')
-  const anchor = preview.getByRole('link', { name: '默认链接' })
+  const demo = page.locator('#config-href')
+  const anchor = demo.getByRole('link', { name: '默认链接' })
   await expect(anchor).toHaveAttribute('target', '_blank')
   await expect(anchor).toHaveAttribute('href', /\S+/)
 })

package/demos/pc/app/link/custom-icon.spec.ts

@@ -3,13 +3,13 @@ import { test, expect } from '@playwright/test'
 test('自定义图标', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link#custom-icon')
-  const preview = page.locator('#preview')
-  const edit = preview.locator('a').filter({ hasText: '编辑' })
+  const demo = page.locator('#custom-icon')
+  const edit = demo.locator('a').filter({ hasText: '编辑' })
   await expect(edit.locator('svg')).toHaveCount(1)
-  const disabled = preview.locator('a').filter({ hasText: '禁用' })
+  const disabled = demo.locator('a').filter({ hasText: '禁用' })
   await expect(disabled.locator('svg')).toHaveCount(1)
-  const view = preview.locator('a').filter({ hasText: '查看' })
+  const view = demo.locator('a').filter({ hasText: '查看' })
   await expect(view.locator('svg')).toHaveCount(1)
-  const del = preview.locator('a').filter({ hasText: '删除' })
+  const del = demo.locator('a').filter({ hasText: '删除' })
   await expect(del.locator('svg')).toHaveCount(1)
 })

package/demos/pc/app/link/dynamic-disable.spec.ts

@@ -3,28 +3,28 @@ import { test, expect } from '@playwright/test'
 test('禁用', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link#dynamic-disable')
-  const preview = page.locator('#preview')
-  let anchor = preview.locator('a').filter({ hasText: '默认链接' })
+  const demo = page.locator('#dynamic-disable')
+  let anchor = demo.locator('a').filter({ hasText: '默认链接' })
   await expect(anchor).toHaveCSS('cursor', 'not-allowed')
   await anchor.hover()
   await expect(anchor).toHaveCSS('color', 'rgb(191, 191, 191)')
-  anchor = preview.locator('a').filter({ hasText: '主要链接' })
+  anchor = demo.locator('a').filter({ hasText: '主要链接' })
   await expect(anchor).toHaveCSS('cursor', 'not-allowed')
   await anchor.hover()
-  await expect(anchor).toHaveCSS('color', 'rgb(191, 191, 191)')
-  anchor = preview.locator('a').filter({ hasText: '成功链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(160, 207, 255)')
+  anchor = demo.locator('a').filter({ hasText: '成功链接' })
   await expect(anchor).toHaveCSS('cursor', 'not-allowed')
   await anchor.hover()
-  await expect(anchor).toHaveCSS('color', 'rgb(191, 191, 191)')
-  anchor = preview.locator('a').filter({ hasText: '警告链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(166, 195, 185)')
+  anchor = demo.locator('a').filter({ hasText: '警告链接' })
   await expect(anchor).toHaveCSS('cursor', 'not-allowed')
   await anchor.hover()
-  await expect(anchor).toHaveCSS('color', 'rgb(191, 191, 191)')
-  anchor = preview.locator('a').filter({ hasText: '危险链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(211, 198, 162)')
+  anchor = demo.locator('a').filter({ hasText: '危险链接' })
   await expect(anchor).toHaveCSS('cursor', 'not-allowed')
   await anchor.hover()
-  await expect(anchor).toHaveCSS('color', 'rgb(191, 191, 191)')
-  anchor = preview.locator('a').filter({ hasText: '信息链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(216, 186, 181)')
+  anchor = demo.locator('a').filter({ hasText: '信息链接' })
   await expect(anchor).toHaveCSS('cursor', 'not-allowed')
   await anchor.hover()
   await expect(anchor).toHaveCSS('color', 'rgb(191, 191, 191)')

package/demos/pc/app/link/focus-no-underline.spec.ts

@@ -3,11 +3,11 @@ import { test, expect } from '@playwright/test'
 test('聚焦时有无下划线', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link#focus-no-underline')
-  const preview = page.locator('#preview')
-  let anchor = preview.locator('a').filter({ hasText: '无下划线' })
+  const demo = page.locator('#focus-no-underline')
+  let anchor = demo.locator('a').filter({ hasText: '无下划线' })
   await anchor.hover()
   await expect(anchor).toHaveCSS('text-decoration', /none/)
   // 无法获取到伪元素::after，暂时跳过测试
-  anchor = preview.locator('a').filter({ hasText: '有下划线' })
+  anchor = demo.locator('a').filter({ hasText: '有下划线' })
   await anchor.hover()
 })

package/demos/pc/app/link/link-style-composition-api.vue

@@ -1,11 +1,11 @@
 <template>
   <div>
-    <tiny-link :underline="false"> 默认链接 </tiny-link>
-    <tiny-link :underline="false" type="primary"> 主要链接 </tiny-link>
-    <tiny-link :underline="false" type="success"> 成功链接 </tiny-link>
-    <tiny-link :underline="false" type="warning"> 警告链接 </tiny-link>
-    <tiny-link :underline="false" type="danger"> 危险链接 </tiny-link>
-    <tiny-link :underline="false" type="info"> 信息链接 </tiny-link>
+    <tiny-link> 默认链接 </tiny-link>
+    <tiny-link type="primary"> 主要链接 </tiny-link>
+    <tiny-link type="success"> 成功链接 </tiny-link>
+    <tiny-link type="warning"> 警告链接 </tiny-link>
+    <tiny-link type="danger"> 危险链接 </tiny-link>
+    <tiny-link type="info"> 信息链接 </tiny-link>
   </div>
 </template>
 

package/demos/pc/app/link/link-style.spec.ts

@@ -3,23 +3,52 @@ import { test, expect } from '@playwright/test'
 test('主题样式', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link#link-style')
-  const preview = page.locator('#preview')
-  let anchor = preview.locator('a').filter({ hasText: '默认链接' })
+
+  const demo = page.locator('#link-style')
+  let getAfter = async (index: number) =>
+    await page.evaluate((index: number) => {
+      const link = document.querySelector(`#link-style .tiny-link:nth-child(${index})`)
+      if (link) {
+        const { borderBottomColor } = window.getComputedStyle(link, '::after')
+        return borderBottomColor
+      } else {
+        return ''
+      }
+    }, index)
+
+  let anchor = demo.locator('a').filter({ hasText: '默认链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(37, 43, 58)')
   await anchor.hover()
+  await expect(await getAfter(1)).toBe('rgb(94, 124, 224)')
   await expect(anchor).toHaveCSS('color', 'rgb(82, 110, 204)')
-  anchor = preview.locator('a').filter({ hasText: '主要链接' })
+
+  anchor = demo.locator('a').filter({ hasText: '主要链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(94, 124, 224)')
   await anchor.hover()
+  await expect(await getAfter(2)).toBe('rgb(94, 124, 224)')
   await expect(anchor).toHaveCSS('color', 'rgb(118, 147, 245)')
-  anchor = preview.locator('a').filter({ hasText: '成功链接' })
+
+  anchor = demo.locator('a').filter({ hasText: '成功链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(80, 212, 171)')
   await anchor.hover()
+  await expect(await getAfter(3)).toBe('rgb(80, 212, 171)')
   await expect(anchor).toHaveCSS('color', 'rgb(172, 242, 220)')
-  anchor = preview.locator('a').filter({ hasText: '警告链接' })
+
+  anchor = demo.locator('a').filter({ hasText: '警告链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(250, 152, 65)')
   await anchor.hover()
+  await expect(await getAfter(4)).toBe('rgb(250, 152, 65)')
   await expect(anchor).toHaveCSS('color', 'rgb(250, 194, 10)')
-  anchor = preview.locator('a').filter({ hasText: '危险链接' })
+
+  anchor = demo.locator('a').filter({ hasText: '危险链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(199, 0, 11)')
   await anchor.hover()
+  await expect(await getAfter(5)).toBe('rgb(199, 0, 11)')
   await expect(anchor).toHaveCSS('color', 'rgb(214, 74, 82)')
-  anchor = preview.locator('a').filter({ hasText: '信息链接' })
+
+  anchor = demo.locator('a').filter({ hasText: '信息链接' })
+  await expect(anchor).toHaveCSS('color', 'rgb(37, 43, 58)')
   await anchor.hover()
+  await expect(await getAfter(6)).toBe('rgb(37, 43, 58)')
   await expect(anchor).toHaveCSS('color', 'rgb(92, 97, 115)')
 })

package/demos/pc/app/link/link-style.vue

@@ -1,11 +1,11 @@
 <template>
   <div>
-    <tiny-link :underline="false"> 默认链接 </tiny-link>
-    <tiny-link :underline="false" type="primary"> 主要链接 </tiny-link>
-    <tiny-link :underline="false" type="success"> 成功链接 </tiny-link>
-    <tiny-link :underline="false" type="warning"> 警告链接 </tiny-link>
-    <tiny-link :underline="false" type="danger"> 危险链接 </tiny-link>
-    <tiny-link :underline="false" type="info"> 信息链接 </tiny-link>
+    <tiny-link> 默认链接 </tiny-link>
+    <tiny-link type="primary"> 主要链接 </tiny-link>
+    <tiny-link type="success"> 成功链接 </tiny-link>
+    <tiny-link type="warning"> 警告链接 </tiny-link>
+    <tiny-link type="danger"> 危险链接 </tiny-link>
+    <tiny-link type="info"> 信息链接 </tiny-link>
   </div>
 </template>
 

package/demos/pc/app/link/webdoc/link.js

@@ -12,8 +12,8 @@ export default {
       'demoId': 'link-style',
       'name': { 'zh-CN': '主题样式', 'en-US': 'Theme Style' },
       'desc': {
-        'zh-CN': '<p>通过 <code>type</code> 属性设置链接的主题类型。</p>\n',
-        'en-US': '<p>Set the topic type of the link through the <code>type</code> attribute. </p>\n'
+        'zh-CN': '<p>通过 <code>type</code> 设置链接的主题类型。</p>',
+        'en-US': '<p>Set the topic type of the link through the <code>type</code> attribute. </p>'
       },
       'codeFiles': ['link-style.vue']
     },
@@ -21,8 +21,8 @@ export default {
       'demoId': 'dynamic-disable',
       'name': { 'zh-CN': '禁用链接', 'en-US': 'Disable links' },
       'desc': {
-        'zh-CN': '<p>通过 <code>disabled</code> 属性可以指定是否禁用链接。</p>\n',
-        'en-US': '<p>You can use the <code>disabled</code> attribute to specify whether to disable links. </p>\n'
+        'zh-CN': '<p>通过 <code>disabled</code> 设置是否禁用链接。</p>',
+        'en-US': '<p>You can use the <code>disabled</code> attribute to specify whether to disable links. </p>'
       },
       'codeFiles': ['dynamic-disable.vue']
     },
@@ -30,10 +30,9 @@ export default {
       'demoId': 'focus-no-underline',
       'name': { 'zh-CN': '聚焦时不显示下划线', 'en-US': 'Do not display underscores when focusing.' },
       'desc': {
-        'zh-CN':
-          '<p>鼠标悬停在链接上时，默认会显示下划线，设置 <code>underline</code> 为 false 后聚焦时不显示下划线。</p>\n',
+        'zh-CN': '<p>通过 <code>underline</code> 设置鼠标悬浮是否显示下划线。</p>',
         'en-US':
-          '<p>When you hover the cursor over a link, the underline is displayed by default. If <code>underline</code> is set to false, the underline is not displayed when you focus. </p>\n'
+          '<p>When you hover the cursor over a link, the underline is displayed by default. If <code>underline</code> is set to false, the underline is not displayed when you focus. </p>'
       },
       'codeFiles': ['focus-no-underline.vue']
     },
@@ -41,9 +40,9 @@ export default {
       'demoId': 'custom-icon',
       'name': { 'zh-CN': '自定义图标', 'en-US': 'Custom Icon' },
       'desc': {
-        'zh-CN': '<p>通过属性 <code>icon</code>、默认插槽、<code>icon</code> 插槽都可以自定义图标。</p>\n',
+        'zh-CN': '<p>通过属性 <code>icon</code>、默认插槽、<code>icon</code> 插槽都可以自定义图标。</p>',
         'en-US':
-          '<p>Icon can be customized by attribute <code>icon</code>, default slot, and <code>icon</code> slot. </p>\n'
+          '<p>Icon can be customized by attribute <code>icon</code>, default slot, and <code>icon</code> slot. </p>'
       },
       'codeFiles': ['custom-icon.vue']
     },
@@ -51,10 +50,9 @@ export default {
       'demoId': 'config-href',
       'name': { 'zh-CN': '链接地址', 'en-US': 'Link' },
       'desc': {
-        'zh-CN':
-          '<p>通过属性 <code>href</code> 指定链接需要跳转的地址，可配合原生属性 <code>target</code> 一起使用。</p>\n',
+        'zh-CN': '<p>通过 <code>href</code> 设置跳转连接，可配合原生属性 <code>target</code> 一起使用。</p>',
         'en-US':
-          '<p>Use the <code>href</code> attribute to specify the URL to be redirected to. This attribute can be used together with the native attribute <code>target</code>. </p>\n'
+          '<p>Use the <code>href</code> attribute to specify the URL to be redirected to. This attribute can be used together with the native attribute <code>target</code>. </p>'
       },
       'codeFiles': ['config-href.vue']
     }
@@ -63,29 +61,29 @@ export default {
     {
       'name': 'link',
       'type': 'component',
-      'properties': [
+      'props': [
         {
           'name': 'type',
-          'type': 'string',
-          'defaultValue': '该属性的默认值为 default',
+          'type': "'primary' | 'success' | 'warning' | 'danger' | 'info'",
+          'defaultValue': '',
           'desc': {
-            'zh-CN': '该属性的可选值为 primary / success / warning / danger / info',
-            'en-US': 'This attribute can be set to primary / success / warning / danger / info'
+            'zh-CN': '文本链接类型',
+            'en-US': 'Text link type'
           },
           'demoId': 'link-style'
         },
         {
           'name': 'underline',
           'type': 'boolean',
-          'defaultValue': '该属性的默认值为 true',
-          'desc': { 'zh-CN': '是否下划线', 'en-US': 'Underline' },
+          'defaultValue': 'true',
+          'desc': { 'zh-CN': '是否下划线', 'en-US': 'Whether has Underline' },
           'demoId': 'focus-no-underline'
         },
         {
           'name': 'disabled',
           'type': 'boolean',
-          'defaultValue': '该属性的默认值为 false',
-          'desc': { 'zh-CN': '是否禁用状态', 'en-US': 'Disabled' },
+          'defaultValue': 'false',
+          'desc': { 'zh-CN': '是否禁用状态', 'en-US': 'Is disabled' },
           'demoId': 'dynamic-disable'
         },
         {
@@ -97,9 +95,9 @@ export default {
         },
         {
           'name': 'icon',
-          'type': 'object , string',
+          'type': 'VueComponent',
           'defaultValue': '',
-          'desc': { 'zh-CN': '图标类名', 'en-US': 'Icon class name' },
+          'desc': { 'zh-CN': '图标组件', 'en-US': 'Icon component' },
           'demoId': 'custom-icon'
         }
       ],

package/demos/pc/app/link-menu/custom-foot.spec.ts

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
 test('自定义菜单弹窗底部', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link-menu#custom-foot')
-  const preview = page.locator('#preview')
+  const preview = page.locator('#custom-foot')
   const dialogBox = preview.locator('.tiny-dialog-box')
   const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
   // 点击图标，弹出弹框

package/demos/pc/app/link-menu/custom-icon.spec.ts

@@ -4,27 +4,12 @@ test.describe('以下2个测试将覆盖2个demo: 自定义折叠展开图标、
   test('自定义折叠展开图标', async ({ page }) => {
     page.on('pageerror', (exception) => expect(exception).toBeNull())
     await page.goto('link-menu#custom-icon')
-    const preview = page.locator('#preview')
     // 点击图标弹出对话框
-    await preview.getByRole('button').click()
-    const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
-    const filterIcon = preview.locator('.tiny-link-menu__filert .tiny-input__icon')
+    const linkMenuList = page.locator('.tiny-tree.tiny-link-menu__overflow > div')
+    const filterIcon = page.locator('.tiny-link-menu__filert .tiny-input__icon')
     // 默认搜索图标的path数量为1
     await expect(filterIcon.locator('path')).toHaveCount(3)
     // 默认展开图标的path数量为1
     await expect(linkMenuList.nth(1).locator('.tree-node-icon .tiny-tree-node__expand-icon path')).toHaveCount(2)
   })
-
-  test('菜单内容超长时省略显示', async ({ page }) => {
-    page.on('pageerror', (exception) => expect(exception).toBeNull())
-    await page.goto('link-menu#custom-icon1')
-    const preview = page.locator('#preview')
-    // 点击图标弹出对话框
-    await preview.getByRole('button').click()
-    const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
-    const firstOption = linkMenuList.first()
-    await expect(firstOption.locator('.tree-node-name')).toHaveCSS('overflow', 'hidden')
-    await expect(firstOption.locator('.tree-node-name')).toHaveCSS('text-overflow', 'ellipsis')
-    await expect(firstOption.locator('.tree-node-name')).toHaveCSS('white-space', 'nowrap')
-  })
 })