From 0d4304616e9c5a11257a755b365829f7cacfefb8 Mon Sep 17 00:00:00 2001
From: anne-xml <liuxiaomei@dcloud.io>
Date: Tue, 10 Dec 2024 17:56:17 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0element-get-attribute?=
 =?UTF-8?q?=E5=85=BC=E5=AE=B9app=E5=92=8Cweb?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../element-get-attribute.test.js             | 35 +++++++++++--------
 .../element-get-attribute.uvue                | 30 ++++++++++++----
 2 files changed, 44 insertions(+), 21 deletions(-)

diff --git a/pages/API/element-get-attribute/element-get-attribute.test.js b/pages/API/element-get-attribute/element-get-attribute.test.js
index ef8504f3..a98e0552 100644
--- a/pages/API/element-get-attribute/element-get-attribute.test.js
+++ b/pages/API/element-get-attribute/element-get-attribute.test.js
@@ -1,12 +1,7 @@
 jest.setTimeout(30000);
-describe('/pages/API/element-get-attribute/element-get-attribute', () => {
-  let page;
-  if (!process.env.uniTestPlatformInfo.startsWith('mp')) {
-    it('skip', () => {
-      expect(1).toBe(1)
-    })
-    return
-  }
+describe('test element-get-attribute', () => {
+  let page,platform,attrStyle,propertyValue;
+  platform = process.env.UNI_PLATFORM
   beforeAll(async () => {
     page = await program.reLaunch('/pages/API/element-get-attribute/element-get-attribute')
     await page.waitFor(3000);
@@ -17,13 +12,23 @@ describe('/pages/API/element-get-attribute/element-get-attribute', () => {
   });
   it('check setStyle getAttributeStyle', async () => {
     await page.callMethod('setStyle')
-    await page.callMethod('getAttributeStyle')
-    expect(await page.data('attrStyle')).toEqual('background-color:#FFF000');
+    if(platform != 'app-plus'){
+      await page.callMethod('getAttributeStyle')
+      attrStyle = platform == 'mp-weixin'?'background-color:#FFF000;':'padding: 0.625rem; background-color: rgb(255, 240, 0);'
+      expect(await page.data('attrStyle')).toEqual(attrStyle);
+    }
   });
-  it('check scrollTo', async () => {
-    await page.callMethod('scrollTo')
-    await page.waitFor(100);
-    const scrollView =  await page.$('.scroll-view_H')
-    expect(await scrollView.property('scrollLeft')).toBe(200);
+  it('check getPropertyValue', async () => {
+    await page.callMethod('getPropertyValue')
+    propertyValue = platform == 'h5'?'rgb(255, 240, 0)':'#FFF000'
+    expect(await page.data('propertyValue')).toEqual(propertyValue);
   });
+  if(platform != 'h5'){
+    it('check scrollTo', async () => {
+      await page.callMethod('scrollTo')
+      await page.waitFor(100);
+      const scrollView =  await page.$('.scroll-view_H')
+      expect(await scrollView.property('scrollLeft')).toBe(200);
+    });
+  }
 });
diff --git a/pages/API/element-get-attribute/element-get-attribute.uvue b/pages/API/element-get-attribute/element-get-attribute.uvue
index f623659e..fb732e0a 100644
--- a/pages/API/element-get-attribute/element-get-attribute.uvue
+++ b/pages/API/element-get-attribute/element-get-attribute.uvue
@@ -2,28 +2,38 @@
   <view>
     <view id="box" ref="box" style="padding: 20rpx;">
       <text class="uni-title-text">元素的id：{{ attrId }}</text>
+      <!-- #ifndef APP -->
       <text class="uni-title-text">元素的style：{{ attrStyle }}</text>
+      <!-- #endif -->
+      <text class="uni-title-text">元素的背景色样式值：{{ propertyValue }}</text>
       <text class="uni-subtitle-text">小程序端：getAttribute 获取元素的属性值，目前仅支持id、style</text>
+      <text class="uni-subtitle-text">App端：getAttribute 不支持获取 class、style 属性</text>
     </view>
     <button @click="getAttributeId">getAttribute获取元素的id</button>
     <button @click="setStyle">setProperty设置背景色</button>
+    <!-- #ifndef APP -->
     <button @click="getAttributeStyle">getAttribute获取元素的style</button>
+    <!-- #endif -->
+    <button @click="getPropertyValue">getPropertyValue获取背景色值</button>
     <scroll-view ref="scrollView" class="scroll-view_H" direction="horizontal">
       <view class="scroll-view-item_H uni-bg-red"><text class="text">A</text></view>
       <view class="scroll-view-item_H uni-bg-green"><text class="text">B</text></view>
       <view class="scroll-view-item_H uni-bg-blue"><text class="text">C</text></view>
     </scroll-view>
+    <!-- #ifndef WEB -->
     <button @click="scrollTo">scrollTo设置left滚动200px</button>
+    <!-- #endif -->
   </view>
 </template>
-<script>
+<script lang="uts">
   export default {
     data() {
       return {
         boxTarget: null as null | UniElement,
         scrollViewTarget: null as null | UniElement,
-        attrId: '',
-        attrStyle:''
+        attrId: "",
+        attrStyle:"",
+        propertyValue:""
       }
     },
     onReady() {
@@ -32,18 +42,26 @@
     },
     methods: {
       scrollTo() {
+        // #ifdef MP-WEIXIN
         this.scrollViewTarget!.scrollTo({
           left: 200
         })
+        // #endif
+        // #ifndef MP-WEIXIN
+        this.scrollViewTarget!.scrollTo(200,0)
+        // #endif
       },
       getAttributeId() {
-        this.attrId = this.boxTarget.getAttribute('id')
+        this.attrId = this.boxTarget!.getAttribute('id') ?? ""
       },
       setStyle() {
-        this.boxTarget.style.setProperty("background-color", "#FFF000")
+        this.boxTarget!.style.setProperty("background-color", "#FFF000")
+      },
+      getPropertyValue() {
+        this.propertyValue = this.boxTarget!.style.getPropertyValue("background-color") as string
       },
       getAttributeStyle() {
-        this.attrStyle = this.boxTarget.getAttribute('style')
+        this.attrStyle = this.boxTarget!.getAttribute('style')?? ""
       }
     }
   }
-- 
GitLab