test(web): rely on the plugin loading status

Remove per-card skeleton test ids and implementation-count assertions. Keep the existing six-card rendering and spacing unchanged while querying the named loading status as the public contract.

web/app/components/base/tab-slider-new/index.tsx

@@ -1,10 +1,10 @@
-import type { ReactNode } from 'react'
+import type { FC } from 'react'
 import { cn } from '@langgenius/dify-ui/cn'
 
 type Option = {
   value: string
   text: string
-  icon?: ReactNode
+  icon?: React.ReactNode
 }
 type TabSliderProps = {
   className?: string
@@ -12,7 +12,7 @@ type TabSliderProps = {
   onChange: (v: string) => void
   options: Option[]
 }
-function TabSliderNew({ className, value, onChange, options }: TabSliderProps) {
+const TabSliderNew: FC<TabSliderProps> = ({ className, value, onChange, options }) => {
   return (
     <div data-testid="tab-slider-new" className={cn(className, 'relative flex')}>
       {options.map((option) => (

web/app/components/plugins/plugin-page/__tests__/plugins-panel.spec.tsx

@@ -312,10 +312,9 @@ describe('PluginsPanel', () => {
 
     render(<PluginsPanel />)
 
-    const loadingState = screen.getByRole('status')
+    const loadingState = screen.getByRole('status', { name: 'common.loading' })
 
     expect(loadingState).toHaveClass('px-12')
-    expect(screen.getAllByTestId('plugin-card-skeleton')).toHaveLength(6)
   })
 
   it('uses compact skeleton spacing while an integrations plugin category is pending', () => {
@@ -329,10 +328,9 @@ describe('PluginsPanel', () => {
 
     render(<PluginsPanel contentInset="compact" fixedCategory={PluginCategoryEnum.tool} />)
 
-    const loadingState = screen.getByRole('status')
+    const loadingState = screen.getByRole('status', { name: 'common.loading' })
 
     expect(loadingState).toHaveClass('px-6', 'max-w-[1600px]')
-    expect(screen.getAllByTestId('plugin-card-skeleton')).toHaveLength(6)
   })
 
   it('uses default content inset for the standalone plugins page', () => {

web/app/components/plugins/plugin-page/plugin-list-skeleton.tsx

@@ -4,10 +4,7 @@ import { useTranslation } from 'react-i18next'
 import { SkeletonContainer, SkeletonPoint, SkeletonRectangle } from '@/app/components/base/skeleton'
 
 const PluginCardSkeleton = () => (
-  <div
-    data-testid="plugin-card-skeleton"
-    className="relative overflow-hidden rounded-xl border-[1.5px] border-background-section-burn bg-background-section-burn p-1"
-  >
+  <div className="relative overflow-hidden rounded-xl border-[1.5px] border-background-section-burn bg-background-section-burn p-1">
     <div className="relative rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-on-panel-item-bg p-4 pb-3 shadow-xs">
       <div className="flex">
         <SkeletonRectangle className="size-10 shrink-0 animate-pulse rounded-xl" />