From ab56e4e2755533697cab30f262f7b6428bc07cf9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E7=A3=8A?= <1633537611@qq.com>
Date: Thu, 21 Sep 2023 15:41:01 +0800
Subject: [PATCH] add input.test.js
---
pages/component/input/input.test.js | 117 ++++++
pages/component/input/input.uvue | 579 ++++++++++++++--------------
2 files changed, 413 insertions(+), 283 deletions(-)
create mode 100644 pages/component/input/input.test.js
diff --git a/pages/component/input/input.test.js b/pages/component/input/input.test.js
new file mode 100644
index 00000000..28090918
--- /dev/null
+++ b/pages/component/input/input.test.js
@@ -0,0 +1,117 @@
+// uni-app自动化测试教程: uni-app自动化测试教程: https://uniapp.dcloud.net.cn/worktile/auto/hbuilderx-extension/
+
+describe('component-native-input', () => {
+
+ let page;
+ beforeAll(async () => {
+ page = await program.reLaunch('/pages/component/input/input')
+ await page.waitFor(3000);
+ });
+
+ // 测试焦点及键盘弹起
+ it('focus', async () => {
+ const input = await page.$('.uni-input-focus');
+ expect(await input.property('focus')).toBe(true)
+ await page.setData({
+ focus: false,
+ })
+ expect(await input.property('focus')).toBe(false)
+ await page.waitFor(1000)
+ await page.setData({
+ focus: true,
+ })
+ expect(await input.property('focus')).toBe(true)
+ await page.waitFor(1000)
+ await page.setData({
+ focus: false,
+ })
+ expect(await input.property('focus')).toBe(false)
+ await page.waitFor(3000)
+ });
+
+ // 测试修改value属性
+ it("value", async () => {
+ const input = await page.$('.uni-input-default');
+ expect(await input.property('value')).toEqual("hello uni-app x")
+ })
+
+ //测试input的类型
+ it("type", async () => {
+ const text = await page.$('.uni-input-type-text');
+ const number = await page.$('.uni-input-type-number');
+ const digit = await page.$('.uni-input-type-digit');
+ const tel = await page.$('.uni-input-type-tel');
+ expect(await text.property('type')).toEqual("text")
+ expect(await number.property('type')).toEqual("number")
+ expect(await digit.property('type')).toEqual("digit")
+ expect(await tel.property('type')).toEqual("tel")
+ })
+
+ // 测试密码属性
+ it("password", async () => {
+ const input = await page.$('.uni-input-password');
+ expect(await input.property('password')).toBe(true)
+ await page.setData({
+ inputPassword: false,
+ })
+ expect(await input.property('password')).toBe(false)
+ })
+ // 测试placeholder
+ it("placeholder", async () => {
+ const placeholder1 = await page.$('.uni-input-placeholder1');
+ expect(await placeholder1.property("placeholder-style")).toMatchObject({
+ "color": "red"
+ })
+ expect(await placeholder1.property("placeholder")).toEqual("占位符文字颜色为红色")
+ await page.setData({
+ inputPlaceHolderStyle: "color:#CC00CC",
+ })
+ expect(await placeholder1.property("placeholder-style")).toMatchObject({
+ "color": "#CC00CC"
+ })
+
+ await page.setData({
+ inputPlaceHolderStyle: "color:#CC19CC;background-color:#00b1c0",
+ })
+ expect(await placeholder1.property("placeholder-style")).toMatchObject({
+ "color": "#CC19CC",
+ "backgroundColor": "#00b1c0"
+ })
+
+ await page.setData({
+ inputPlaceHolderStyle: "color:#CC19CC;background-color:#00b1c0;text-align:center;font-size:100px;font-weight:900",
+ })
+ expect(await placeholder1.property("placeholder-style")).toEqual({
+ "backgroundColor": "#00b1c0",
+ "color": "#CC19CC",
+ "fontSize": "100px",
+ "fontWeight": "900",
+ "textAlign": "center"
+ })
+
+ const placeholder2 = await page.$('.uni-input-placeholder2');
+ expect(await placeholder2.property("placeholder-class")).toMatchObject({
+ "backgroundColor": "#008000"
+ })
+ await page.setData({
+ inputPlaceHolderClass: "uni-input-placeholder-class-ts",
+ })
+ expect(await placeholder2.property("placeholder-class")).toMatchObject({
+ "backgroundColor": "#FFA500"
+ })
+ expect(await placeholder2.property("placeholder")).toEqual("占位符背景色为绿色")
+ })
+
+ it("disable", async () => {
+ const input = await page.$('.uni-input-disable');
+ expect(await input.property("disabled")).toBe(true)
+ })
+
+ it("confirm-type", async () => {
+ expect(await (await page.$('.uni-input-confirm-send')).property("confirmType")).toEqual("send")
+ expect(await (await page.$('.uni-input-confirm-search')).property("confirmType")).toEqual("search")
+ expect(await (await page.$('.uni-input-confirm-next')).property("confirmType")).toEqual("next")
+ expect(await (await page.$('.uni-input-confirm-go')).property("confirmType")).toEqual("go")
+ expect(await (await page.$('.uni-input-confirm-done')).property("confirmType")).toEqual("done")
+ })
+});
\ No newline at end of file
diff --git a/pages/component/input/input.uvue b/pages/component/input/input.uvue
index 0027021b..d1226f45 100644
--- a/pages/component/input/input.uvue
+++ b/pages/component/input/input.uvue
@@ -1,310 +1,323 @@
-
-
-
-
-
-
-
- 设置输入框的初始内容
-
-
-
-
-
+
+
+
+
+
+
+
+ 设置输入框的初始内容
+
+
+
+
+
-
-
- type取值（不同输入法表现可能不一致）
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ type取值（不同输入法表现可能不一致）
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
- 密码输入框
-
-
-
-
-
+
+
+ 密码输入框
+
+
+
+
+
-
-
- 占位符样式
-
-
-
-
-
-
-
-
+
+
+ 占位符样式
+
+
+
+
+
+
+
+
-
-
- 设置禁用输入框
-
-
-
-
-
+
+
+ 设置禁用输入框
+
+
+
+
+
-
-
- 设置最大输入长度
-
-
-
-
-
+
+
+ 设置最大输入长度
+
+
+
+
+
-
-
- 设置光标与键盘的距离
-
-
-
-
-
+
+
+ 设置光标与键盘的距离
+
+
+
+
+
-
-
- 自动获取焦点
-
-
-
-
-
+
+
+ 自动获取焦点
+
+
+
+
+
-
-
- confirm-type取值（不同输入法表现可能不一致）
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ confirm-type取值（不同输入法表现可能不一致）
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
- 点击键盘右下角按钮时保持键盘不收起
-
-
-
-
-
+
+
+ 点击键盘右下角按钮时保持键盘不收起
+
+
+
+
+
-
-
- 设置输入框聚焦时光标的位置（点击生效）
-
-
-
-
-
+
+
+ 设置输入框聚焦时光标的位置（点击生效）
+
+
+
+
+
-
-
- 设置输入框聚焦时光标的起始位置和结束位置（点击生效）
-
-
-
-
-
+
+
+ 设置输入框聚焦时光标的起始位置和结束位置（点击生效）
+
+
+
+
+
-
-
- 键盘弹起时，自动上推页面
-
-
-
-
-
+
+
+ 键盘弹起时，自动上推页面
+
+
+
+
+
-
-
- input事件
- {{inputEventDetail}}
-
-
-
-
-
+
+
+ input事件
+ {{inputEventDetail}}
+
+
+
+
+
-
-
- focus事件和blur事件
- {{focusAndBlurEventDetail}}
-
-
-
-
-
+
+
+ focus事件和blur事件
+ {{focusAndBlurEventDetail}}
+
+
+
+
+
-
-
- confirm事件
- {{confirmEventDetail}}
-
-
-
-
-
+
+
+ confirm事件
+ {{confirmEventDetail}}
+
+
+
+
+
-
-
- keyboardheightchange事件
- {{keyboardHeightChangeEventDetail}}
-
-
-
-
-
+
+
+ keyboardheightchange事件
+ {{keyboardHeightChangeEventDetail}}
+
+
+
+
+
-
-
- 带清除按钮的输入框
-
-
-
-
-
-
-
+
+
+ 带清除按钮的输入框
+
+
+
+
+
+
+
-
-
- 可查看密码的输入框
-
-
-
-
-
-
-
-
-
-
+
+
+ 可查看密码的输入框
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
+ .uni-input-placeholder-class {
+ background-color: green;
+ }
+ .uni-input-placeholder-class-ts {
+ background-color: orange;
+ }
+
--
GitLab