提交 d2f0666a 编写于 作者: D dongwei

add test cases

Signed-off-by: Ndongwei <dongwei@kaihongdigi.com>
上级 29dfb003
......@@ -142,9 +142,6 @@
"pages/obj_ImageBitmap/index",
"pages/obj_OffscreenCanvas/index",
"pages/obj_OffscreenCanvasRenderingContext2D/index",
"pages/svg/index",
"pages/rect/index",
"pages/circle/index",
"pages/ellipse/index",
"pages/path/index",
"pages/line/index",
......@@ -164,7 +161,13 @@
"pages/span/prop/index",
"pages/menu/prop/index",
"pages/switch/prop/index",
"pages/slider/prop/index"
"pages/slider/prop/index",
"pages/svg/prop/index",
"pages/svg/router/index",
"pages/rect/prop/index",
"pages/rect/router/index",
"pages/circle/prop/index",
"pages/circle/router/index"
],
"name": "default",
"window": {
......
<div class="container">
<div class="style-container">
<text class="title">
通用样式
</text>
<text class="sub-title">
circle通用样式1
</text>
<circle class="style1" cx="40" cy="5" r="20" fill="white" stroke="red" stroke="blue" stroke-width="3" ></circle>
<text class="sub-title">
circle通用样式2
</text>
<circle class="style2" cx="40" cy="22" r="20" fill="white" stroke="red" stroke="blue" stroke-width="4" fill-opacity="0"></circle>
<text class="sub-title">
circle通用样式3
</text>
<svg class="style3" x="0" y="0" width="100" height="100" >
<circle cx="40" cy="50" r="30" fill="white" stroke="blue" stroke="blue" stroke-width="4" fill-opacity="0"></circle>
</svg>
<text class="sub-title">
circle通用样式4
</text>
<circle class="style4" cx="25" cy="25" r="20" fill="white" stroke="block" stroke="blue" stroke-width="4" fill-opacity="0"></circle>
<text class="sub-title">
circle通用样式5
</text>
<div class="contain1">
<circle class="style5" cx="40" cy="30" r="20" fill="white" stroke="blue" stroke="blue" stroke-width="4" fill-opacity="0"></circle>
<circle class="style6" cx="40" cy="30" r="20" fill="white" stroke="blue" stroke="blue" stroke-width="4" fill-opacity="0"></circle>
</div>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="sub-container">
<div class="prop-container">
<text class="title">
通用属性
</text>
<text class="sub-title">
circle通用属性1
</text>
<svg x="0" y="0" width="200" height="50" >
<circle class="prop1" id="prop1" data-name ="prop1" cx="50" cy="20" r="15" stroke-width="3" fill="red" stroke="blue" fill-opacity="0.5"></circle>
</svg>
<text class="sub-title">
circle通用属性2
</text>
<svg x="0" y="0" width="200" height="50" >
<circle class="prop2" ref="prop2" data-name ="prop2" cx="50" cy="20" r="15" stroke-width="3" fill="red" stroke="blue" opacity="0.4"></circle>
</svg>
<text class="sub-title">
circle通用属性3
</text>
<svg x="0" y="0" width="200" height="50" fill="white">
<circle class="prop3" id="prop3" cx="50" cy="20" r="15" stroke-width="4" fill="red" stroke="blue"></circle>
</svg>
<text class="sub-title">
circle通用属性4
</text>
<svg x="0" y="0" width="200" height="50" fill="white">
<circle class="prop4" id="prop4" cx="50" cy="20" r="15" stroke-width="5" stroke="red" stroke-dasharray="10 5" stroke-dashoffset="3"></circle>
</svg>
<text class="sub-title">
circle通用属性5
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle class="prop5" id="prop5" cx="50" cy="30" r="15" stroke="blue" stroke-width="4" transform="rotate(-10)"></circle>
</svg>
<text class="sub-title">
circle通用属性6
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle class="prop6" id="prop6" cx="20" cy="30" r="15" stroke="blue" stroke-width="4" transform="translate(20)"></circle>
</svg>
<text class="sub-title">
circle通用属性7
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle class="prop7" id="prop7" cx="80" cy="40" r="15" stroke="blue" stroke-width="4" transform="skewY(-10)"></circle>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="ani-container">
<text class="title">
动画样式
</text>
<text class="sub-title">
circle动画样式1
</text>
<svg fill="white" width="200" height="40">
<circle cx="100" cy="20" r="15" stroke-width="4" fill="white" stroke="blue">
<animate attributeName="stroke-width" from="4" to="10" calcMode="discrete" dur="2000" repeatCount="indefinite"></animate>
<animate attributeName="stroke" values="red;blue" dur="2000" repeatCount="indefinite"></animate>
</circle>
<circle cx="60" cy="20" r="15" fill="blue">
<animate attributeName="fill" values="red;blue" dur="2000" repeatCount="indefinite"></animate>
</circle>
<circle cx="20" cy="20" r="15" fill="blue">
<animate attributeName="fill-opacity" from="1.0" to="0.5" dur="2000" repeatCount="indefinite"></animate>
</circle>
</svg>
<text class="sub-title">
circle动画样式2
</text>
<svg fill="white" width="200" height="120">
<circle cx="0" cy="20" r="20" stroke-width="4" fill="white" stroke="blue">
<animate attributeName="r" from="0" to="30" dur="2000" repeatCount="indefinite"></animate>
<animate attributeName="cx" from="40" to="80" dur="2000" repeatCount="indefinite"></animate>
</circle>
<circle cx="30" cy="20" r="20" stroke-width="10" stroke="red" stroke-dasharray="60 10" stroke-dashoffset="3">
<animate attributeName="stroke-opacity" from="1.0" to="0.5" dur="2000" repeatCount="indefinite"></animate>
<animate attributeName="stroke-dashoffset" values="30;0;30" dur="500" repeatCount="indefinite"></animate>
<animate attributeName="cy" from="20" to="400" dur="3000" repeatCount="indefinite"></animate>
</circle>
<circle cx="30" cy="20" r="5" fill="blue">
<animate attributeName="cy" from="20" to="400" dur="3000" repeatCount="indefinite"></animate>
</circle>
</svg>
</div>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="sub-container">
<div class="gradient-container">
<text class="title">
渐变样式
</text>
<text class="sub-title">
circle渐变样式1
</text>
<circle class="gradient1" cx="60" cy="45" r="35" fill="white" fill-opacity="0" stroke="block" stroke-dasharray="5 3" stroke-dashoffset="3"></circle>
<text class="sub-title">
circle渐变样式2
</text>
<circle class="gradient2" cx="60" cy="45" r="35" fill="white" fill-opacity="0" stroke="blue" ></circle>
<text class="sub-title">
circle渐变样式3
</text>
<circle class="gradient3" cx="60" cy="45" r="35" fill="pink" stroke="yellow" stroke="blue" ></circle>
<text class="sub-title">
circle渐变样式4
</text>
<circle class="gradient4" cx="60" cy="45" r="35" fill="white" stroke="red" stroke="blue"></circle>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="access-container">
<text class="title">
无障碍
</text>
<text class="sub-title">
circle无障碍1
</text>
<circle class="access1" accessibilitygroup ="true"
accessibilitytext="这是circle"
accessibilitydescription="点击此按键会弹出一个对话框"
accessibilityimportance="no-hide-descendants"
cx="50" cy="35" r="30" fill="#978666" stroke="#00FF00"></circle>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="multimode-container">
<text class="title">
多模输入
</text>
<text class="sub-title">
circle多模输入1
</text>
<circle class="multimode1" width="200" height="80" voicelabel = "voice"
subscriptflag="on" subscriptlabel="circle" scenelabel="common"
cx="50" cy="35" r="30" stroke-width="4" fill="#978666" stroke="block"></circle>
</div>
</div>
</div>
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
<div class="container">
<div class="prop-container">
<text class="title">
circle通用属性
</text>
<text class="sub-title">
通用属性 -- fill
</text>
<svg width="100" height="25" >
<circle id ="fillProp" cx="50" cy="12" r="10" fill="red"></circle>
</svg>
<text class="sub-title">
通用属性 -- fill-opacity
</text>
<div style="height: 25px;width: 150px;">
<svg width="50px" height="25px">
<circle id ="fillOpacityPropOne" cx="30" cy="12" r="10" fill-opacity="0.5" fill="red"></circle>
</svg>
<svg width="50px" height="25px">
<circle id ="fillOpacityPropTwo" cx="30" cy="12" r="10" fill-opacity="1" fill="red"></circle>
</svg>
<svg width="50px" height="25px">
<circle id ="fillOpacityPropThree" cx="30" cy="12" r="10" fill-opacity="1.5" fill="red"></circle>
</svg>
</div>
<text class="sub-title">
通用属性 -- fill-rule
</text>
<div style="height: 25px;width: 150px;">
<svg width="50px" height="25px">
<circle id ="fillRulePropOne" cx="30" cy="12" r="10" fill-rule="evenodd" fill="red"></circle>
</svg>
<svg width="50px" height="25px">
<circle id ="fillRulePropTwo" cx="30" cy="12" r="10" fill-rule="nonzero" fill="red"></circle>
</svg>
</div>
<text class="sub-title">
通用属性 -- opacity
</text>
<div style="height: 25px;width: 150px;">
<svg width="50px" height="25px">
<circle id ="opacityPropOne" cx="30" cy="12" r="10" fill="red" opacity="0.5"></circle>
</svg>
<svg width="50px" height="25px">
<circle id ="opacityPropTwo" cx="30" cy="12" r="10" fill="red" opacity="1"></circle>
</svg>
<svg width="50px" height="25px">
<circle id ="opacityPropThree" cx="30" cy="12" r="10" fill="red" opacity="1.5"></circle>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke
</text>
<svg width="100px" height="25px" fill="white">
<circle id ="strokeProp" cx="30" cy="12" r="10" stroke = "red"></circle>
</svg>
<text class="sub-title">
通用属性 -- stroke-dasharray
</text>
<svg width="100px" height="25px" fill="white">
<circle id ="strokeDashArrayProp" cx="30" cy="12" r="10" stroke = "red" stroke-dasharray="2 3"></circle>
</svg>
<text class="sub-title">
通用属性 -- stroke-dashoffset
</text>
<svg width="100px" height="25px" fill="white">
<circle id ="strokeDashOffsetProp" cx="30" cy="12" r="10" stroke = "red" stroke-dashoffset="23"></circle>
</svg>
<text class="sub-title">
通用属性 -- stroke-linejoin
</text>
<div style="height: 25px;width: 150px;">
<svg width="50px" height="25px" fill="white">
<circle id ="strokeDashOffsetProp" cx="30" cy="12" r="10"
stroke = "red" stroke-linejoin="bevel"></circle>
</svg>
<svg width="50px" height="25px" fill="white">
<circle id ="strokeLineJoinPropTwo" cx="30" cy="12" r="10"
stroke = "red" stroke-linejoin="miter"></circle>
</svg>
<svg width="50px" height="25px" fill="white">
<circle id ="strokeLineJoinPropThree" cx="30" cy="12" r="10"
stroke = "red" stroke-linejoin="round"></circle>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-linecap
</text>
<div style="height: 25px;width: 150px;">
<svg width="50px" height="25px" fill="white">
<circle id ="strokeLineCapPropOne" cx="30" cy="12" r="10"
stroke = "red" stroke-linecap="butt"></circle>
</svg>
<svg width="50px" height="25px" fill="white">
<circle id ="strokeLineCapPropTwo" cx="30" cy="12" r="10"
stroke = "red" stroke-linecap="round"></circle>
</svg>
<svg width="50px" height="25px" fill="white">
<circle id ="strokeLineCapPropThree" cx="30" cy="12" r="10"
stroke = "red" stroke-linecap="square"></circle>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-miterlimit
</text>
<svg width="100px" height="25px" fill="white">
<circle id ="strokeMiterLimitProp" cx="30" cy="12" r="10"
stroke = "red" stroke-miterlimit="10"></circle>
</svg>
<text class="sub-title">
通用属性 -- stroke-opacity
</text>
<div style="height: 25px;width: 150px;">
<svg width="50px" height="25px" fill="white">
<circle id ="strokeOpacityPropOne" cx="30" cy="12" r="10"
stroke = "red" stroke-opacity="0.5"></circle>
</svg>
<svg width="50px" height="25px" fill="white">
<circle id ="strokeOpacityPropTwo" cx="30" cy="12" r="10"
stroke = "red" stroke-opacity="1"></circle>
</svg>
<svg width="50px" height="25px" fill="white">
<circle id ="strokeOpacityPropThree" cx="30" cy="12" r="10"
stroke = "red" stroke-opacity="1.5"></circle>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-width
</text>
<svg width="100px" height="30px" fill="white">
<circle id ="strokeWidthProp" cx="30" cy="14" r="10"
stroke = "red" stroke-width="6"></circle>
</svg>
<text class="sub-title">
通用属性 -- transform
</text>
<svg width="100px" height="100px" fill="red">
<circle id ="transformProp" cx="50" cy="50" r="20"
transform="translate(10,5) scale(0.5 1.3) rotate(20 40 90) skewX(10) skewY(-15)"></circle>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="prop-container">
<text class="title">
circle特有属性
</text>
<text class="sub-title">
特有属性-id
</text>
<svg width="100px" height="50px">
<circle id ="idProp" cx="50" cy="25" r="20" fill="red"></circle>
</svg>
<text class="sub-title">
特有属性-cx
</text>
<svg width="200px" height="50px">
<circle id ="cxPropOne" cx="50" cy="25" r="20" fill="red"></circle>
<circle id ="cxPropTwo" cx="50%" cy="25" r="20" fill="pink"></circle>
</svg>
<text class="sub-title">
特有属性-cy
</text>
<svg width="200px" height="50px">
<circle id ="cyPropOne" cx="50" cy="25" r="20" fill="red"></circle>
<circle id ="cyPropTwo" cx="100" cy="50%" r="20" fill="pink"></circle>
</svg>
<text class="sub-title">
特有属性-r
</text>
<svg width="200px" height="50px">
<circle id ="rPropOne" cx="50" cy="25" r="20" fill="red" ></circle>
<circle id ="rPropTwo" cx="100" cy="25" r="20%" fill="pink"></circle>
</svg>
<text class="sub-title">
特有属性-if
</text>
<svg width="100px" height="50px">
<circle id ="ifPropTrue" cx="50" cy="25" r="20" fill="red" if="true"></circle>
</svg>
<text class="sub-title">
特有属性-show
</text>
<svg width="200px" height="50px">
<circle id ="showPropTrue" cx="50" cy="25" r="20" fill="red" show="true"></circle>
<circle id ="showPropFalse" cx="50" cy="25" r="20" fill="red" show="false"></circle>
<circle id ="showPropNone" cx="50" cy="25" r="20" fill="red" show=""></circle>
</svg>
</div>
</div>
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
export default {
data: {
fillProp : null,
fillOpacityPropTwo : null,
fillOpacityPropOne : null,
fillOpacityPropThree : null,
fillRulePropTwo : null,
fillRulePropOne : null,
opacityPropOne : null,
opacityPropTwo : null,
opacityPropThree : null,
strokeProp : null,
strokeDashArrayProp : null,
strokeDashOffsetProp : null,
strokeLineJoinPropTwo : null,
strokeLineJoinPropOne : null,
strokeLineJoinPropThree : null,
strokeLineCapPropOne : null,
strokeLineCapPropTwo : null,
strokeLineCapPropThree : null,
strokeMiterLimitProp : null,
strokeOpacityPropOne : null,
strokeOpacityPropTwo : null,
strokeOpacityPropThree : null,
strokeWidthProp : null,
transformProp : null,
idProp : null,
cxPropOne : null,
cxPropTwo : null,
cyPropOne : null,
cyPropTwo : null,
rPropOne : null,
rPropTwo : null,
ifPropTrue : null,
showPropTrue : null,
showPropFalse : null,
showPropNone : null
},
onShow(){
this.getCommonPropValues();
globalThis.value = {
fillProp : this.fillProp,
fillOpacityPropTwo : this.fillOpacityPropTwo,
fillOpacityPropOne : this.fillOpacityPropOne,
fillOpacityPropThree : this.fillOpacityPropThree,
fillRulePropTwo : this.fillRulePropTwo,
fillRulePropOne : this.fillRulePropOne,
opacityPropOne : this.opacityPropOne,
opacityPropTwo : this.opacityPropTwo,
opacityPropThree : this.opacityPropThree,
strokeProp : this.strokeProp,
strokeDashArrayProp : this.strokeDashArrayProp,
strokeDashOffsetProp : this.strokeDashOffsetProp,
strokeLineJoinPropTwo : this.strokeLineJoinPropTwo,
strokeLineJoinPropOne : this.strokeLineJoinPropOne,
strokeLineJoinPropThree : this.strokeLineJoinPropThree,
strokeLineCapPropOne : this.strokeLineCapPropOne,
strokeLineCapPropTwo : this.strokeLineCapPropTwo,
strokeLineCapPropThree : this.strokeLineCapPropThree,
strokeMiterLimitProp : this.strokeMiterLimitProp,
strokeOpacityPropOne : this.strokeOpacityPropOne,
strokeOpacityPropTwo : this.strokeOpacityPropTwo,
strokeOpacityPropThree : this.strokeOpacityPropThree,
strokeWidthProp : this.strokeWidthProp,
transformProp : this.transformProp,
idProp : this.idProp,
cxPropOne : this.cxPropOne,
cxPropTwo : this.cxPropTwo,
cyPropOne : this.cyPropOne,
cyPropTwo : this.cyPropTwo,
rPropOne : this.rPropOne,
rPropTwo : this.rPropTwo,
ifPropTrue : this.ifPropTrue,
showPropTrue : this.showPropTrue,
showPropFalse : this.showPropFalse,
showPropNone : this.showPropNone
}
},
getCommonPropValues(){
this.fillProp = this.$element("fillProp").getInspector()
this.fillOpacityPropTwo = this.$element("fillOpacityPropTwo").getInspector()
this.fillOpacityPropOne = this.$element("fillOpacityPropOne").getInspector()
this.fillOpacityPropThree = this.$element("fillOpacityPropThree").getInspector()
this.fillRulePropTwo = this.$element("fillRulePropTwo").getInspector()
this.fillRulePropOne = this.$element("fillRulePropOne").getInspector()
this.opacityPropOne = this.$element("opacityPropOne").getInspector()
this.opacityPropTwo = this.$element("opacityPropTwo").getInspector()
this.opacityPropThree = this.$element("opacityPropThree").getInspector()
this.strokeProp = this.$element("strokeProp").getInspector()
this.strokeDashArrayProp = this.$element("strokeDashArrayProp").getInspector()
this.strokeDashOffsetProp = this.$element("strokeDashOffsetProp").getInspector()
this.strokeLineJoinPropTwo = this.$element("strokeLineJoinPropTwo").getInspector()
this.strokeLineJoinPropOne = this.$element("strokeLineJoinPropOne").getInspector()
this.strokeLineJoinPropThree = this.$element("strokeLineJoinPropThree").getInspector()
this.strokeLineCapPropOne = this.$element("strokeLineCapPropOne").getInspector()
this.strokeLineCapPropTwo = this.$element("strokeLineCapPropTwo").getInspector()
this.strokeLineCapPropThree = this.$element("strokeLineCapPropThree").getInspector()
this.strokeMiterLimitProp = this.$element("strokeMiterLimitProp").getInspector()
this.strokeOpacityPropOne = this.$element("strokeOpacityPropOne").getInspector()
this.strokeOpacityPropTwo = this.$element("strokeOpacityPropTwo").getInspector()
this.strokeOpacityPropThree = this.$element("strokeOpacityPropThree").getInspector()
this.strokeWidthProp = this.$element("strokeWidthProp").getInspector()
this.transformProp = this.$element("transformProp").getInspector()
this.idProp = this.$element("idProp").getInspector()
this.cxPropOne = this.$element("cxyPropOne").getInspector()
this.cxPropTwo = this.$element("cxyPropTwo").getInspector()
this.cyPropOne = this.$element("cxyPropOne").getInspector()
this.cyPropTwo = this.$element("cxyPropTwo").getInspector()
this.rPropOne = this.$element("rPropOne").getInspector()
this.rPropTwo = this.$element("rPropTwo").getInspector()
this.ifPropTrue = this.$element("ifPropTrue").getInspector()
this.showPropTrue = this.$element("showPropTrue").getInspector()
this.showPropFalse = this.$element("showPropFalse").getInspector()
this.showPropNone = this.$element("showPropNone").getInspector()
},
}
\ No newline at end of file
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/* xxx.css */
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.sub-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
text-align: center;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 2;
align-items: center;
}
#prop1 {
background-color: mediumslateblue;
width: 100%;
margin: 3px 5px;
}
#prop2 {
background-color: pink;
width: 100%;
margin: 3px 5px;
}
#prop3 {
background-color: darkseagreen;
width: 100%;
margin: 3px 5px;
}
#prop4 {
background-color: yellowgreen;
width: 100%;
margin: 3px 5px;
}
#prop5 {
background-color: cornflowerblue;
width: 100%;
margin: 3px 5px;
}
#prop6 {
background-color: burlywood;
width: 100%;
margin: 3px 5px;
}
#prop7 {
background-color: crimson;
width: 100%;
margin: 3px 5px;
}
#prop8{
background-color: khaki;
width: 100%;
margin: 3px 5px;
}
#prop9{
background-color: cornsilk;
width: 100%;
margin: 3px 5px;
}
#prop10{
background-color: yellowgreen;
width: 100%;
margin: 3px 5px;
}
<div class="container">
<div class="sub-container">
<div class="prop-container">
<text class="title">
通用属性
</text>
<text class="sub-title">
circle通用属性1
</text>
<svg x="0" y="0" width="200" height="50" >
<circle id="prop1" cx="100" cy="20" r="15" stroke-width="3" fill="red" stroke="blue" fill-opacity="0.5"></circle>
</svg>
<text class="sub-title">
circle通用属性2
</text>
<svg x="0" y="0" width="200" height="50" >
<circle id="prop2" cx="100" cy="20" r="15" stroke-width="3" fill="red" stroke="blue" opacity="0.4"></circle>
</svg>
<text class="sub-title">
circle通用属性3
</text>
<svg x="0" y="0" width="200" height="50" fill="white">
<circle id="prop3" cx="100" cy="20" r="15" stroke-width="4" fill="red" stroke="blue"></circle>
</svg>
<text class="sub-title">
circle通用属性4
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle id="prop4" cx="100" cy="20" r="15" stroke-width="5" stroke="red" stroke-dasharray="10 5" stroke-dashoffset="3"></circle>
</svg>
<text class="sub-title">
circle通用属性5
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle id="prop5" cx="100" cy="40" r="15" stroke="blue" stroke-width="4" transform="rotate(-10)"></circle>
</svg>
<text class="sub-title">
circle通用属性6
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle id="prop6" cx="100" cy="22" r="15" stroke="blue" stroke-width="4" transform="translate(20)"></circle>
</svg>
<text class="sub-title">
circle通用属性7
</text>
<svg x="0" y="0" width="200" height="50" fill="white" fill-opacity="0">
<circle id="prop7" cx="80" cy="35" r="15" stroke="blue" stroke-width="4" transform="skewY(-10)"></circle>
</svg>
</div>
<text class="sub-title">
circle通用属性8
</text>
<svg x="0" y="0" width="200" height="50" fill="white" >
<circle id="prop8" cx="100" cy="25" r="15" fill="red" fill-rule="evenodd"></circle>
</svg>
<text class="sub-title">
circle通用属性9
</text>
<svg x="0" y="0" width="200" height="50" fill="white" >
<circle id="prop9" cx="100" cy="25" r="15" fill="pink" stroke-linejoin="bevel"></circle>
</svg>
<text class="sub-title">
circle通用属性10
</text>
<svg x="0" y="0" width="200" height="50" fill="white" >
<circle id="prop10" cx="100" cy="25" r="15" fill="red" stroke-miterlimit="10"></circle>
</svg>
</div>
</div>
......@@ -12,15 +12,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import prompt from '@system.prompt';
export default {
data: {
title: ""
},
onShow(){
// 通用属性
var prop1 = this.$element("prop1");
var name1 = prop1.dataSet.a
var prop2 = this.$refs.prop2;
var name2 = prop2.dataSet.a
}
}
\ No newline at end of file
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.sub-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.style-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.style1{
width: 100%;
height: 100%;
min-width: 25px;
min-height: 10px;
max-width: 300px;
max-height: 50px;
padding-left: 10px;
padding-top: 20px;
padding-right: 15px;
padding-bottom: 5px;
margin-left: 10px;
margin-top: 20px;
margin-right: 15px;
margin-bottom: 5px;
border-left-style: solid;
border-right-style: dashed;
border-top-style: dashed;
border-bottom-style: dotted;
border-left-width: 1px;
border-right-width: 2px;
border-top-width: 2px;
border-bottom-width: 1px;
border-left-color: #ff0000;
border-right-color: #00ff00;
border-top-color: #0000ff;
border-bottom-color: #fff000;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 15px;
border-top-left-radius: 8px;
border-top-right-radius: 12px;
background: linear-gradient(pink,#fff000);
box-shadow: 2px 4px 6px 8px #888888;
opacity: 0.5;
display: flex;
visibility: visible;
align-self: center;
image-fill: #000fff;
clip-path: margin-box;
}
.style2{
width: 50px;
height: 20px;
padding-start: 10px;
padding-end: 15px;
margin-start: 5px;
margin-end: 10px;
border-style: dotted;
border-width: 2px;
border-color:#000000;
border-radius:5px;
background-color:#ffaa00;
mask-image: url('common/images/icon.png');
mask-size: cover;
mask-position: center;
}
.style3{
width: 100%;
padding: 10px;
margin: 5px;
border-left: 1px solid #000000;
border-right: 2px dashed #00ff00;
border-top: 1.5px dotted #0000ff;
border-bottom: 2.5px dotted #fff000;
background-image:url('common/images/bg-tv.jpg');
background-size:cover;
background-repeat: repeat-x;
background-position: center;
flex:1;
flex-grow: 2;
flex-basis: 10px;
flex-shrink: 1;
}
.style4{
width: 60%;
height: 5%;
padding: 10px;
margin: 5px;
border: 2px solid #000000;
}
.contain1{
width: 100%;
height: 70px;
flex-direction: column;
}
.style5{
width: 50%;
height: 30px;
background-color: yellow;
border-image-source: url('/common/images/image.png');
border-image-slice: 1px 2px 3px 4px;
border-image-width: 2px 3px 4px 5px;
border-image-outset: 3px 4px 5px 6px;
border-image-repeat: repeat;
}
.style6{
width: 70px;
height: 30px;
position: absolute;
left: 10px;
top: 35px;
bottom: 5px;
right: 10px;
background-color: pink;
border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 1.5;
}
/*#prop1 {*/
/* margin: 5px;*/
/*}*/
/*.prop2 {*/
/* color: #343524;*/
/* stroke-width: 15px;*/
/* margin: 5px;*/
/*}*/
/*.prop3{*/
/* color: #679855;*/
/* stroke-width: 15px;*/
/* margin: 5px;*/
/*}*/
/*.prop4 {*/
/* color: #456345;*/
/* stroke-width: 25px;*/
/* margin: 5px;*/
/*}*/
/*.prop5 {*/
/* color: #831834;*/
/* stroke-width: 40px;*/
/* margin: 5px;*/
/* height: 70px;*/
/*}*/
.ani-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.ani1{
background-color: #72ac33;
width: 55px;
height: 55px;
margin: 5px;
transform-origin: 0% 0%;
animation: ani1Go 3s infinite;
}
@keyframes ani1Go
{
from {
background-color: #f76160;
opacity:0.3;
width:50px;
height: 50px;
transform:translate(20px) rotate(10deg) scale(0.2);
background-position:10% 10%
}
30% {
background-color: #60f761;
opacity:0.5;
width:70px;
height: 70px;
background-position:12% 12%;
transform:translateX(10px) translateY(5px) rotateX(20deg) rotateY(25deg) scaleX(0.6) scaleY(0.5)
}
to {
background-color: #6160f7;
opacity:1;
width:90px;
height: 90px;
background-position:22% 22%;
transform:rotate(180deg) scale(2)
}
}
.ani2{
background-color: #ad4e2a;
width: 55px;
height: 55px;
margin: 5px;
}
.gradient-container{
flex-direction: column;
}
.gradient1{
stroke-width: 30px;
margin: 5px;
background: linear-gradient(red, #00ff00);
}
.gradient2{
stroke-width: 30px;
margin: 5px;
background: linear-gradient(45deg, rgb(255,0,0),rgb(0, 255, 0));
}
.gradient3{
stroke-width: 30px;
margin: 5px;
background: linear-gradient(to right, rgb(255,0,0) 90px, rgb(0, 255, 0) 60%);
}
.gradient4{
stroke-width: 30px;
margin: 5px;
background: repeating-linear-gradient(to right, rgba(255, 255, 0, 1) 30px,rgba(0, 0, 255, .5) 60px);
}
.access-container{
flex-direction: column;
}
.access1{
color: #321124;
stroke-width: 30px;
margin: 5px;
}
.atom-container{
flex-direction: column;
}
.multimode-container{
flex-direction: column;
}
.multimode1{
/* color: #978666;*/
/* stroke-width: 30px;*/
margin: 5px;
}
\ No newline at end of file
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
<div class="container">
<div class="prop-container">
<text class="title">
rect通用属性
</text>
<text class="sub-title">
通用属性 -- fill
</text>
<svg width="100" height="20" >
<rect id ="fillProp" width="80" height="15" fill="red"></rect>
</svg>
<text class="sub-title">
通用属性 -- fill-opacity
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px">
<rect id ="fillOpacityPropOne" width="90%" height="20px" fill-opacity="0.5" fill="red"></rect>
</svg>
<svg width="50px" height="20px">
<rect id ="fillOpacityPropTwo" width="90%" height="20px" fill-opacity="1" fill="red"></rect>
</svg>
<svg width="50px" height="20px">
<rect id ="fillOpacityPropThree" width="90%" height="20px" fill-opacity="1.5" fill="red"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- fill-rule
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px">
<rect id ="fillRulePropOne" width="90%" height="20px" fill-rule="evenodd" fill="red"></rect>
</svg>
<svg width="50px" height="20px">
<rect id ="fillRulePropTwo" width="90%" height="20px" fill-rule="nonzero" fill="red"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- opacity
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px">
<rect id ="opacityPropOne"width="90%" height="20px" fill="red" opacity="0.5"></rect>
</svg>
<svg width="50px" height="20px">
<rect id ="opacityPropTwo"width="90%" height="20px" fill="red" opacity="1"></rect>
</svg>
<svg width="50px" height="20px">
<rect id ="opacityPropThree"width="90%" height="20px" fill="red" opacity="1.5"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke
</text>
<svg width="100px" height="20px" fill="white">
<rect id ="strokeProp" width="90%" height="20px" stroke = "red"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-dasharray
</text>
<svg width="100px" height="20px" fill="white">
<rect id ="strokeDashArrayProp" width="90%" height="20px" stroke = "red" stroke-dasharray="2 3"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-dashoffset
</text>
<svg width="100px" height="20px" fill="white">
<rect id ="strokeDashOffsetProp" width="90%" height="20px" stroke = "red" stroke-dashoffset="23"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-linejoin
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px" fill="white">
<rect id ="strokeLineJoinPropOne" width="90%" height="20px"
stroke = "red" stroke-linejoin="bevel"></rect>
</svg>
<svg width="50px" height="20px" fill="white">
<rect id ="strokeLineJoinPropTwo" width="90%" height="20px"
stroke = "red" stroke-linejoin="miter"></rect>
</svg>
<svg width="50px" height="20px" fill="white">
<rect id ="strokeLineJoinPropThree" width="90%" height="20px"
stroke = "red" stroke-linejoin="round"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-linecap
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px" fill="white">
<rect id ="strokeLineCapPropOne" width="90%" height="20px"
stroke = "red" stroke-linecap="butt"></rect>
</svg>
<svg width="50px" height="20px" fill="white">
<rect id ="strokeLineCapPropTwo" width="90%" height="20px"
stroke = "red" stroke-linecap="round"></rect>
</svg>
<svg width="50px" height="20px" fill="white">
<rect id ="strokeLineCapPropThree" width="90%" height="20px"
stroke = "red" stroke-linecap="square"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-miterlimit
</text>
<svg width="100px" height="20px" fill="white">
<rect id ="strokeMiterLimitProp" width="90%" height="20px"
stroke = "red" stroke-miterlimit="10"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-opacity
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px" fill="white">
<rect id ="strokeOpacityPropOne"width="90%" height="20px"
stroke = "red" stroke-opacity="0.5"></rect>
</svg>
<svg width="50px" height="20px" fill="white">
<rect id ="strokeOpacityPropTwo"width="90%" height="20px"
stroke = "red" stroke-opacity="1"></rect>
</svg>
<svg width="50px" height="20px" fill="white">
<rect id ="strokeOpacityPropThree"width="90%" height="20px"
stroke = "red" stroke-opacity="1.5"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-width
</text>
<svg width="100px" height="20px" fill="white">
<rect id ="strokeWidthProp" width="90%" height="20px"
stroke = "red" stroke-width="6"></rect>
</svg>
<text class="sub-title">
通用属性 -- transform
</text>
<svg width="100px" height="100px" fill="red">
<rect id ="transformProp" width="90%" height="100px"
transform="translate(10,5) scale(0.5 1.3) rotate(20 40 90) skewX(10) skewY(-15)"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="prop-container">
<text class="title">
rect特有属性
</text>
<text class="sub-title">
特有属性-id
</text>
<svg width="100px" height="40px">
<rect id ="idProp" width="90px" height="20px" fill="red"></rect>
</svg>
<text class="sub-title">
特有属性- width
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px" fill="red">
<rect id ="widthPropOne" width="90px" height="20px"></rect>
</svg>
<svg width="50px" height="20px" fill="pink">
<rect id ="widthPropTwo" width="90%" height="20px"></rect>
</svg>
</div>
<text class="sub-title">
特有属性- height
</text>
<div style="height: 20px;width: 150px;">
<svg width="50px" height="20px" fill="red">
<rect id ="heightPropOne" width="90%" height="20px"></rect>
</svg>
<svg width="50px" height="20px" fill="pink">
<rect id ="heightPropTwo" width="90%" height="80%"></rect>
</svg>
</div>
<text class="sub-title">
特有属性-x
</text>
<svg width="100px" height="40px">
<svg width="100px" height="40px" fill="red" >
<rect id ="xProp" width="90%" height="20px" x="20"></rect>
</svg>
</svg>
<text class="sub-title">
特有属性-y
</text>
<svg width="100px" height="40px">
<svg width="100px" height="40px" fill="red" >
<rect id ="yProp" width="90%" height="20px" y="20"></rect>
</svg>
</svg>
<text class="sub-title">
特有属性-rx
</text>
<svg width="100px" height="40px" fill="red">
<rect id ="rxProp"width="90%" height="20px" rx="20"></rect>
</svg>
<text class="sub-title">
特有属性-ry
</text>
<svg width="100px" height="40px" fill="red">
<rect id ="rxProp"width="90%" height="20px" ry="20"></rect>
</svg>
<text class="sub-title">
特有属性-if
</text>
<svg width="100px" height="50px">
<rect id ="ifPropTrue" width="90px" height="20px" fill="red" if="true"></rect>
</svg>
<text class="sub-title">
特有属性-show
</text>
<svg width="200px" height="50px">
<rect id ="showPropTrue" width="90px" height="20px" fill="red" x="" y="20" show="true"></rect>
<rect id ="showPropFalse" width="90px" height="20px" fill="red" x="10" y="50" show="false"></rect>
<rect id ="showPropNone" width="90px" height="20px" fill="red" x="20" y="80" show=""></rect>
</svg>
</div>
</div>
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
export default {
data: {
fillProp : null,
fillOpacityPropTwo : null,
fillOpacityPropOne : null,
fillOpacityPropThree : null,
fillRulePropTwo : null,
fillRulePropOne : null,
opacityPropOne : null,
opacityPropTwo : null,
opacityPropThree : null,
strokeProp : null,
strokeDashArrayProp : null,
strokeDashOffsetProp : null,
strokeLineJoinPropTwo : null,
strokeLineJoinPropOne : null,
strokeLineJoinPropThree : null,
strokeLineCapPropOne : null,
strokeLineCapPropTwo : null,
strokeLineCapPropThree : null,
strokeMiterLimitProp : null,
strokeOpacityPropOne : null,
strokeOpacityPropTwo : null,
strokeOpacityPropThree : null,
strokeWidthProp : null,
transformProp : null,
idProp : null,
widthPropOne : null,
heightPropOne : null,
heightPropTwo : null,
widthPropTwo : null,
xProp : null,
yProp : null,
rxProp : null,
ryProp : null,
ifPropTrue : null,
showPropTrue : null,
showPropFalse : null,
showPropNone : null
},
onShow(){
this.getCommonPropValues();
globalThis.value = {
fillProp : this.fillProp,
fillOpacityPropTwo : this.fillOpacityPropTwo,
fillOpacityPropOne : this.fillOpacityPropOne,
fillOpacityPropThree : this.fillOpacityPropThree,
fillRulePropTwo : this.fillRulePropTwo,
fillRulePropOne : this.fillRulePropOne,
opacityPropOne : this.opacityPropOne,
opacityPropTwo : this.opacityPropTwo,
opacityPropThree : this.opacityPropThree,
strokeProp : this.strokeProp,
strokeDashArrayProp : this.strokeDashArrayProp,
strokeDashOffsetProp : this.strokeDashOffsetProp,
strokeLineJoinPropTwo : this.strokeLineJoinPropTwo,
strokeLineJoinPropOne : this.strokeLineJoinPropOne,
strokeLineJoinPropThree : this.strokeLineJoinPropThree,
strokeLineCapPropOne : this.strokeLineCapPropOne,
strokeLineCapPropTwo : this.strokeLineCapPropTwo,
strokeLineCapPropThree : this.strokeLineCapPropThree,
strokeMiterLimitProp : this.strokeMiterLimitProp,
strokeOpacityPropOne : this.strokeOpacityPropOne,
strokeOpacityPropTwo : this.strokeOpacityPropTwo,
strokeOpacityPropThree : this.strokeOpacityPropThree,
strokeWidthProp : this.strokeWidthProp,
transformProp : this.transformProp,
idProp : this.idProp,
widthPropOne : this.widthPropOne,
heightPropOne : this.heightPropOne,
heightPropTwo : this.heightPropTwo,
widthPropTwo : this.widthPropTwo,
xProp : this.xProp,
yProp : this.yProp,
rxProp : this.rxProp,
ryProp : this.ryProp,
ifPropTrue: this.ifPropTrue,
showPropTrue: this.showPropTrue,
showPropFalse: this.showPropFalse,
showPropNone: this.showPropNone
}
},
getCommonPropValues(){
this.fillProp = this.$element("fillProp").getInspector()
this.fillOpacityPropTwo = this.$element("fillOpacityPropTwo").getInspector()
this.fillOpacityPropOne = this.$element("fillOpacityPropOne").getInspector()
this.fillOpacityPropThree = this.$element("fillOpacityPropThree").getInspector()
this.fillRulePropTwo = this.$element("fillRulePropTwo").getInspector()
this.fillRulePropOne = this.$element("fillRulePropOne").getInspector()
this.opacityPropOne = this.$element("opacityPropOne").getInspector()
this.opacityPropTwo = this.$element("opacityPropTwo").getInspector()
this.opacityPropThree = this.$element("opacityPropThree").getInspector()
this.strokeProp = this.$element("strokeProp").getInspector()
this.strokeDashArrayProp = this.$element("strokeDashArrayProp").getInspector()
this.strokeDashOffsetProp = this.$element("strokeDashOffsetProp").getInspector()
this.strokeLineJoinPropTwo = this.$element("strokeLineJoinPropTwo").getInspector()
this.strokeLineJoinPropOne = this.$element("strokeLineJoinPropOne").getInspector()
this.strokeLineJoinPropThree = this.$element("strokeLineJoinPropThree").getInspector()
this.strokeLineCapPropOne = this.$element("strokeLineCapPropOne").getInspector()
this.strokeLineCapPropTwo = this.$element("strokeLineCapPropTwo").getInspector()
this.strokeLineCapPropThree = this.$element("strokeLineCapPropThree").getInspector()
this.strokeMiterLimitProp = this.$element("strokeMiterLimitProp").getInspector()
this.strokeOpacityPropOne = this.$element("strokeOpacityPropOne").getInspector()
this.strokeOpacityPropTwo = this.$element("strokeOpacityPropTwo").getInspector()
this.strokeOpacityPropThree = this.$element("strokeOpacityPropThree").getInspector()
this.strokeWidthProp = this.$element("strokeWidthProp").getInspector()
this.transformProp = this.$element("transformProp").getInspector()
this.idProp = this.$element("idProp").getInspector()
this.widthPropOne = this.$element("widthPropOne").getInspector()
this.heightPropOne = this.$element("heightPropOne").getInspector()
this.heightPropTwo = this.$element("heightPropTwo").getInspector()
this.widthPropTwo = this.$element("widthPropTwo").getInspector()
this.xProp = this.$element("xProp").getInspector()
this.yProp = this.$element("yProp").getInspector()
this.rxProp = this.$element("rxProp").getInspector()
this.ryProp = this.$element("ryProp").getInspector()
this.ifPropTrue = this.$element("ifPropTrue").getInspector()
this.showPropTrue = this.$element("showPropTrue").getInspector()
this.showPropFalse = this.$element("showPropFalse").getInspector()
this.showPropNone = this.$element("showPropNone").getInspector()
},
}
\ No newline at end of file
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/* xxx.css */
.container {
flex-direction:row;
width:100%;
......@@ -48,189 +32,24 @@
text-align: left;
margin: 2px;
padding: 2px;
text-align: center;
}
.style1{
width: 100%;
height: 100%;
min-width: 25px;
min-height: 10px;
max-width: 300px;
max-height: 50px;
padding-left: 10px;
padding-top: 20px;
padding-right: 15px;
padding-bottom: 5px;
margin-left: 10px;
margin-top: 20px;
margin-right: 15px;
margin-bottom: 5px;
border-left-style: solid;
border-right-style: dashed;
border-top-style: dashed;
border-bottom-style: dotted;
border-left-width: 1px;
border-right-width: 2px;
border-top-width: 2px;
border-bottom-width: 1px;
border-left-color: #ff0000;
border-right-color: #00ff00;
border-top-color: #0000ff;
border-bottom-color: #fff000;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 15px;
border-top-left-radius: 8px;
border-top-right-radius: 12px;
background: linear-gradient(pink,#fff000);
box-shadow: 2px 4px 6px 8px #888888;
opacity: 0.5;
display: flex;
visibility: visible;
align-self: center;
image-fill: #000fff;
clip-path: margin-box;
}
.style2{
width: 100px;
height:50px;
padding-start: 10px;
padding-end: 15px;
margin-start: 5px;
margin-end: 10px;
border-style: dotted;
border-width: 2px;
border-color:#000000;
border-radius:5px;
background-color:#ffaa00;
mask-image: url('common/images/icon.png');
mask-size: cover;
mask-position: center;
}
.style3{
/* width: 100%;*/
/* height:100px;*/
padding: 10px;
margin: 5px;
border-left: 1px solid #000000;
border-right: 2px dashed #00ff00;
border-top: 1.5px dotted #0000ff;
border-bottom: 2.5px dotted #fff000;
background-image:url('common/images/image.png');
background-size:cover;
background-repeat: repeat-x;
background-position: center;
flex:1;
flex-grow: 2;
flex-basis: 10px;
flex-shrink: 1;
}
.style4{
width: 60%;
height: 10%;
padding: 10px;
margin: 5px;
border: 2px solid #000000;
}
.contain1{
width: 100%;
height: 70px;
flex-direction: column;
}
.style5{
width: 60%;
height: 70px;
background-color: yellow;
border-image-source: url('/common/images/image.png');
border-image-slice: 1px 2px 3px 4px;
border-image-width: 2px 3px 4px 5px;
border-image-outset: 3px 4px 5px 6px;
border-image-repeat: repeat;
}
.style6{
width: 70px;
height: 70px;
position: absolute;
left: 10px;
top: 80px;
bottom: 5px;
right: 10px;
background-color: pink;
border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
}
.style7 {
margin-bottom: 50px;
margin-top: 10px;
color: green;
stroke-width: 30px;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 2;
}
#prop1 {
background-color: mediumslateblue;
width: 100%;
margin: 3px 5px;
}
.prop2 {
background-color: pink;
width: 100%;
margin: 3px 5px;
}
.prop3 {
background-color: darkseagreen;
width: 100%;
margin: 3px 5px;
}
.prop4 {
background-color: yellowgreen;
width: 100%;
margin: 3px 5px;
}
.prop5 {
background-color: cornflowerblue;
width: 100%;
margin: 3px 5px;
align-items: center;
}
.prop6 {
background-color: burlywood;
width: 100%;
margin: 3px 5px;
}
.prop7 {
background-color: crimson;
width: 100%;
margin: 3px 5px;
}
.ani-container{
flex-direction: column;
height: 100%;
flex-weight: 0.8;
}
.ani1{
color: #72ac33;
stroke-width: 55px;
margin: 5px;
transform-origin: 0% 0%;
animation: ani1Go 3s infinite;
flex-weight: 1;
align-items: center;
}
@keyframes ani1Go
......@@ -306,61 +125,3 @@
rotateX(180deg) rotateY(185deg) rotateZ(150deg) scaleX(2) scaleY(2.5) scaleZ(3.5);
}
}
.gradient-container{
flex-direction: column;
}
.gradient1{
height:100px;
stroke-width:4px;
margin: 5px;
background: linear-gradient(red, #00ff00);
}
.gradient2{
height:100px;
stroke-width: 4px;
margin: 5px;
background: linear-gradient(45deg, rgb(255,0,0),rgb(0, 255, 0));
}
.gradient3{
height:100px;
stroke-width: 4px;
margin: 5px;
background: linear-gradient(to right, rgb(255,0,0) 90px, rgb(0, 255, 0) 60%);
}
.gradient4{
height:100px;
stroke-width: 4px;
margin: 5px;
background: repeating-linear-gradient(to right, rgba(255, 255, 0, 1) 30px,rgba(0, 0, 255, .5) 60px);
}
.access-container{
flex-direction: column;
}
.access1{
height:100px;
color: #321124;
stroke-width: 4px;
margin: 5px;
}
.atom-container{
flex-direction: column;
}
.multimode-container{
flex-direction: column;
}
.multimode1{
height:100px;
color: #978666;
stroke-width: 4px;
margin: 5px;
}
\ No newline at end of file
<div class="container">
<div class="style-container">
<text class="title">
通用样式
</text>
<text class="sub-title">
rect通用样式1
</text>
<rect class="style1" id="style1" x="0" y="-5" width="30" height="30" ></rect>
<text class="sub-title">
rect通用样式2
</text>
<svg x="0" y="0" width="100" height="100">
<rect class="style2" id="style2" x="0" y="10" width="30" height="30" fill="blue"></rect>
</svg>
<text class="sub-title">
rect通用样式3
</text>
<svg x="0" y="0" width="100" height="100" >
<rect class="style3" id="style3" x="0" y="0" width="30" height="30" fill="blue" fill-opacity="0.5"></rect>
</svg>
<text class="sub-title">
rect通用样式4
</text>
<svg x="0" y="0" width="100" height="80" >
<rect class="style4" id="style4" x="10" y="5" width="50" height="50" fill="blue" fill-opacity="0" stroke="yellow" stroke-width="4" rx="10" ry="10" ></rect>
</svg>
<text class="sub-title">
rect通用样式5
</text>
<div class="contain1">
<svg width="100" height="30">
<rect class="style5" id="style5" x="10" y="0" width="70" height="30" fill="blue" ></rect>
</svg>
<svg width="100" height="30">
<rect class="style6" id="style6" x="10" y="0" width="70" height="30" fill="blue" ></rect>
</svg>
</div>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="sub-container">
<div class="prop-container">
<text class="title">
......@@ -47,23 +7,26 @@
<text class="sub-title">
rect通用属性1
</text>
<svg x="0" y="0" width="180" height="80" viewBox="0 0 180 60" id="prop1" class="prop1" data-name ="prop1">
<svg width="400" height="80" viewBox="0 0 230 60" >
<rect x="10" y="10" width="50" height="50" fill-opacity="0.5"></rect>
<rect x="80" y="10" width="50" height="50" opacity="0.8"></rect>
<rect x="70" y="10" width="50" height="50" opacity="0.8"></rect>
<rect x="130" y="10" width="50" height="50" fill="red" fill-rule="evenodd"></rect>
<rect x="200" y="10" width="50" height="50" fill="red" stroke-linejoin="bevel"></rect>
</svg>
<text class="sub-title">
rect通用属性2
</text>
<svg x="0" y="0" width="180" height="80" viewBox="0 0 180 60" ref ="prop2" class="prop2" data-name ="prop2" >
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white"></rect>
<rect x="70" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="yellow" stroke-dasharray="5 3" stroke-dashoffset="10"></rect>
<rect x="130" y="10" width="50" height="50" stroke="blue" stroke-width="4" stroke-dashoffset="10" fill="white" stroke-opacity="0.6"></rect>
<svg width="400" height="80" viewBox="0 0 230 60" >
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" stroke-miterlimit="10"></rect>
<rect x="70" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white"></rect>
<rect x="130" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="yellow" stroke-dasharray="5 3" stroke-dashoffset="10"></rect>
<rect x="200" y="10" width="50" height="50" stroke="blue" stroke-width="4" stroke-dashoffset="10" fill="white" stroke-opacity="0.6"></rect>
</svg>
<text class="sub-title">
rect通用属性3
</text>
<svg id="prop3" class="prop3" x="0" y="0" width="180" height="140" viewBox="0 0 180 140" >
<svg width="200" height="200" viewBox="0 0 180 140" >
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="rotate(-10)"></rect>
<rect x="60" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="translate(40)"></rect>
<rect x="10" y="70" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="skewX(10)"></rect>
......@@ -72,10 +35,11 @@
<text class="sub-title">
rect特有属性4
</text>
<svg id="prop4" class="prop4" x="0" y="0" width="200" height="80" viewBox="0 100 60" fill="white">
<rect x="0" y="10" width="50" height="50" stroke="red" stroke-width="3"></rect>
<rect x="60" y="10" width="50" height="50" stroke="yellow" stroke-width="3" rx="10" ry="10"></rect>
<rect x="120" y="10" width="50" height="50" stroke="blue" stroke-width="3" rx="10" ry="10" ></rect>
<svg fill="white" width="400" height="80" >
<rect width="50" height="50" x="50" y="10" stroke-width="4" stroke="blue" id="rectId"></rect>
<rect width="50" height="50" x="120" y="10" stroke-width="4" stroke="blue" rx="10" ry="10"></rect>
<rect width="50" height="50" x="190" y="10" stroke-width="10" fill="red" stroke="blue" rx="10" ry="10"></rect>
<rect width="50" height="50" x="260" y="10" stroke-width="10" stroke="red" rx="10" ry="10" stroke-dasharray="5 3" stroke-dashoffset="3"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
......@@ -88,7 +52,7 @@
rect动画样式1
</text>
<svg width="200" height="100">
<rect x="20" y="10" width="60" height="60" fill="red" rx="0" ry="20">
<rect x="80" y="10" width="60" height="60" fill="red" rx="0" ry="20">
<animate attributeName="rx" values="0;20" dur="1000" repeatCount="10" fill="freeze" calcMode="linear"></animate>
</rect>
</svg>
......@@ -96,78 +60,11 @@
rect动画样式2
</text>
<svg width="200" height="100">
<rect x="20" y="10" width="50" height="50" fill="red" rx="0" ry="20">
<rect x="80" y="10" width="50" height="50" fill="red" rx="0" ry="20">
<animate attributeName="fill" from="red" to="blue" dur="1000" repeatCount="indefinite"></animate>
<animate attributeName="height" from="50" to="100" begin="500" end="1000" repeatCount="indefinite"> </animate>
</rect>
</svg>
</div>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="sub-container">
<div class="gradient-container">
<text class="title">
渐变样式
</text>
<text class="sub-title">
rect渐变样式1
</text>
<svg class="gradient1" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" fill-opacity="0" stroke="block" stroke-width="4" rx="10" ry="10" stroke-dasharray="5 3" stroke-dashoffset="3"></rect>
</svg>
<text class="sub-title">
rect渐变样式2
</text>
<svg class="gradient2" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" fill-opacity="0" stroke="blue" stroke-width="4" rx="10" ry="10" ></rect>
</svg>
<text class="sub-title">
rect渐变样式3
</text>
<svg class="gradient3" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="pink" fill-opacity="0" stroke="yellow" stroke-width="4" rx="10" ry="10" ></rect>
</svg>
<text class="sub-title">
rect渐变样式4
</text>
<svg class="gradient4" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" fill-opacity="0" stroke="red" stroke-width="4"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="access-container">
<text class="title">
无障碍
</text>
<text class="sub-title">
rect无障碍1
</text>
<svg class="access1" accessibilitygroup ="true"
accessibilitytext="这是circle"
accessibilitydescription="rect"
accessibilityimportance="no-hide-descendants"
width="200" height="50" >
<rect x="10" y="5" width="200" height="50" fill="#00FF00"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="multimode-container">
<text class="title">
多模输入
</text>
<text class="sub-title">
rect多模输入1
</text>
<svg class="multimode1" width="200" height="50" voicelabel = "voice"
subscriptflag="on" subscriptlabel="divider" scenelabel="common">
<rect x="10" y="5" width="200" height="50" fill="#978666"></rect>
</svg>
</div>
</div>
</div>
......@@ -12,15 +12,11 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import prompt from '@system.prompt';
export default {
data: {
title: ""
},
onShow(){
// 通用属性
var prop1 = this.$element("prop1");
var name1 = prop1.dataSet.a
var prop2 = this.$refs.prop2;
var name2 = prop2.dataSet.a
}
}
\ No newline at end of file
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.sub-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.style-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.style1{
/* width: 100%;*/
/* height: 100%;*/
min-width: 25px;
min-height: 10px;
max-width: 300px;
max-height: 50px;
padding-left: 10px;
padding-top: 20px;
padding-right: 15px;
padding-bottom: 5px;
margin-left: 10px;
margin-top: 20px;
margin-right: 15px;
margin-bottom: 5px;
border-left-style: solid;
border-right-style: dashed;
border-top-style: dashed;
border-bottom-style: dotted;
border-left-width: 1px;
border-right-width: 2px;
border-top-width: 2px;
border-bottom-width: 1px;
border-left-color: #ff0000;
border-right-color: #00ff00;
border-top-color: #0000ff;
border-bottom-color: #fff000;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 15px;
border-top-left-radius: 8px;
border-top-right-radius: 12px;
background: linear-gradient(pink,#fff000);
box-shadow: 2px 4px 6px 8px #888888;
opacity: 0.5;
display: flex;
visibility: visible;
align-self: center;
image-fill: #000fff;
clip-path: margin-box;
}
.style2{
width: 50px;
height: 20px;
padding-start: 10px;
padding-end: 15px;
margin-start: 5px;
margin-end: 10px;
border-style: dotted;
border-width: 2px;
border-color:#000000;
border-radius:5px;
background-color:#ffaa00;
mask-image: url('common/images/icon.png');
mask-size: cover;
mask-position: center;
}
.style3{
/* width: 100%;*/
height:150px;
padding: 10px;
margin: 5px;
border-left: 1px solid #000000;
border-right: 2px dashed #00ff00;
border-top: 1.5px dotted #0000ff;
border-bottom: 2.5px dotted #fff000;
background-image:url('common/images/image.png');
background-size:cover;
background-repeat: repeat-x;
background-position: center;
flex:1;
flex-grow: 2;
flex-basis: 10px;
flex-shrink: 1;
}
.style4{
/* width: 60%;*/
/* height: 5%;*/
padding: 10px;
margin: 5px;
border: 2px solid #000000;
}
.contain1{
width: 100%;
height: 70px;
flex-direction: column;
}
.style5{
/* width: 50%;*/
/* height: 30px;*/
background-color: yellow;
border-image-source: url('/common/images/image.png');
border-image-slice: 1px 2px 3px 4px;
border-image-width: 2px 3px 4px 5px;
border-image-outset: 3px 4px 5px 6px;
border-image-repeat: repeat;
}
.style6{
/* width: 70px;*/
/* height: 30px;*/
position: absolute;
left: 10px;
top: 35px;
bottom: 5px;
right: 10px;
background-color: pink;
border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 1.5;
}
/*#prop1 {*/
/* margin: 5px;*/
/*}*/
/*.prop2 {*/
/* color: #343524;*/
/* stroke-width: 15px;*/
/* margin: 5px;*/
/*}*/
/*.prop3{*/
/* color: #679855;*/
/* stroke-width: 15px;*/
/* margin: 5px;*/
/*}*/
/*.prop4 {*/
/* color: #456345;*/
/* stroke-width: 25px;*/
/* margin: 5px;*/
/*}*/
/*.prop5 {*/
/* color: #831834;*/
/* stroke-width: 40px;*/
/* margin: 5px;*/
/* height: 70px;*/
/*}*/
.ani-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.ani1{
background-color: #72ac33;
width: 55px;
height: 55px;
margin: 5px;
transform-origin: 0% 0%;
animation: ani1Go 3s infinite;
}
@keyframes ani1Go
{
from {
background-color: #f76160;
opacity:0.3;
width:50px;
height: 50px;
transform:translate(20px) rotate(10deg) scale(0.2);
background-position:10% 10%
}
30% {
background-color: #60f761;
opacity:0.5;
width:70px;
height: 70px;
background-position:12% 12%;
transform:translateX(10px) translateY(5px) rotateX(20deg) rotateY(25deg) scaleX(0.6) scaleY(0.5)
}
to {
background-color: #6160f7;
opacity:1;
width:90px;
height: 90px;
background-position:22% 22%;
transform:rotate(180deg) scale(2)
}
}
.ani2{
background-color: #ad4e2a;
width: 55px;
height: 55px;
margin: 5px;
}
.gradient-container{
flex-direction: column;
}
.gradient1{
stroke-width: 30px;
margin: 5px;
background: linear-gradient(red, #00ff00);
}
.gradient2{
stroke-width: 30px;
margin: 5px;
background: linear-gradient(45deg, rgb(255,0,0),rgb(0, 255, 0));
}
.gradient3{
stroke-width: 30px;
margin: 5px;
background: linear-gradient(to right, rgb(255,0,0) 90px, rgb(0, 255, 0) 60%);
}
.gradient4{
stroke-width: 30px;
margin: 5px;
background: repeating-linear-gradient(to right, rgba(255, 255, 0, 1) 30px,rgba(0, 0, 255, .5) 60px);
}
.access-container{
flex-direction: column;
}
.access1{
color: #321124;
stroke-width: 30px;
margin: 5px;
}
.atom-container{
flex-direction: column;
}
.multimode-container{
flex-direction: column;
}
.multimode1{
/* color: #978666;*/
/* stroke-width: 30px;*/
margin: 5px;
}
\ No newline at end of file
<div class="container">
<div class="style-container">
<text class="title">
通用样式
</text>
<text class="sub-title">
svg通用样式1
</text>
<svg class="style1" id="style1" x="0" y="0" width="100" height="100" viewBox="0 0 100 60" >
<rect x="10" y="0" width="70" height="70" ></rect>
</svg>
<text class="sub-title">
svg通用样式2
</text>
<svg class="style2" id="style2" x="0" y="0" width="100" height="100" viewBox="0 0 100 60" >
<rect x="10" y="0" width="70" height="70" fill="blue"></rect>
</svg>
<text class="sub-title">
svg通用样式3
</text>
<svg class="style3" id="style3" x="0" y="0" width="100" height="100" viewBox="0 0 100 60" >
<rect x="10" y="0" width="70" height="70" fill="blue" fill-opacity="0.5"></rect>
</svg>
<text class="sub-title">
svg通用样式4
</text>
<svg class="style4" id="style4" x="0" y="0" width="100" height="80" viewBox="0 0 100 60" >
<rect x="10" y="0" width="70" height="70" fill="blue" fill-opacity="0.5"></rect>
</svg>
<text class="sub-title">
svg通用样式5
</text>
<div class="contain1">
<svg class="style5" id="style5" width="100" height="30">
<rect x="10" y="0" width="70" height="30" fill="blue" ></rect>
</svg>
<svg class="style6" id="style6" width="100" height="30">
<rect x="10" y="0" width="70" height="30" fill="blue" ></rect>
</svg>
</div>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="sub-container">
<div class="prop-container">
<text class="title">
通用属性
</text>
<text class="sub-title">
svg通用属性1
</text>
<svg x="0" y="0" width="180" height="80" viewBox="0 0 180 60" id="prop1" class="prop1" data-name ="prop1">
<rect x="10" y="10" width="50" height="50" fill-opacity="0.5"></rect>
<rect x="80" y="10" width="50" height="50" opacity="0.8"></rect>
</svg>
<text class="sub-title">
svg通用属性2
</text>
<svg x="0" y="0" width="180" height="80" viewBox="0 0 180 60" ref ="prop2" class="prop2" data-name ="prop2" >
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white"></rect>
<rect x="70" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="yellow" stroke-dasharray="5 3" stroke-dashoffset="10"></rect>
<rect x="130" y="10" width="50" height="50" stroke="blue" stroke-width="4" stroke-dashoffset="10" fill="white" stroke-opacity="0.6"></rect>
</svg>
<text class="sub-title">
svg通用属性3
</text>
<svg x="0" y="0" width="180" height="140" viewBox="0 0 180 140" class="prop3" id="prop3">
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="rotate(-10)"></rect>
<rect x="60" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="translate(40)"></rect>
<rect x="10" y="70" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="skewX(10)"></rect>
<rect x="120" y="70" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="skewY(5)"></rect>
</svg>
<text class="sub-title">
svg特有属性4
</text>
<svg x="0" y="0" width="50" height="80" viewBox="0 100 60" class="prop4" id="prop4">
<rect x="10" y="10" width="50" height="50" fill="red"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="ani-container">
<text class="title">
动画样式
</text>
<text class="sub-title">
svg动画样式1
</text>
<svg class="ani1" width="50" height="50" viewBox="0 0 60 60">
<rect x="10" y="10" width="50" height="50" fill="#00FF00"></rect>
</svg>
<text class="sub-title">
svg动画样式2
</text>
<svg class="ani2" width="50" height="50" viewBox="0 0 60 60">
<rect x="10" y="10" width="50" height="50" fill="#00FF00"></rect>
</svg>
</div>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="sub-container">
<div class="gradient-container">
<text class="title">
渐变样式
</text>
<text class="sub-title">
svg渐变样式1
</text>
<svg class="gradient1" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" stroke="red" stroke-width="4" fill-opacity="0"></rect>
</svg>
<text class="sub-title">
svg渐变样式2
</text>
<svg class="gradient2" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" stroke="blue" stroke-width="4" fill-opacity="0"></rect>
</svg>
<text class="sub-title">
svg渐变样式3
</text>
<svg class="gradient3" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" stroke="yellow" stroke-width="4" fill-opacity="0"></rect>
</svg>
<text class="sub-title">
svg渐变样式4
</text>
<svg class="gradient4" x="0" y="0" width="200" height="80" viewBox="0 0 60 60">
<rect x="10" y="5" width="50" height="50" fill="white" stroke="red" stroke-width="4" fill-opacity="0"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<div class="access-container">
<text class="title">
无障碍
</text>
<text class="sub-title">
svg无障碍1
</text>
<svg class="access1" accessibilitygroup ="true"
accessibilitytext="这是svg"
accessibilitydescription="rect"
accessibilityimportance="no-hide-descendants"
width="200" height="50" >
<rect x="10" y="5" width="200" height="50" fill="#00FF00"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="false">
</divider>
<!-- <div class="atom-container">-->
<!-- <text class="title">-->
<!-- 原子布局-->
<!-- </text>-->
<!-- <text class="sub-title">-->
<!-- svg原子布局1-->
<!-- </text>-->
<!-- <div style="flex-direction: row;height: 30px;width: 100%;">-->
<!-- <divider vertical="true" style="width:20px;background-color: blue;display-index: 1;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:30px;background-color: black;display-index: 5;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:40px;background-color: yellow;display-index: 4;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:10px;background-color: red;display-index: 3;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:25px;background-color:pink;display-index: 7;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:15px;background-color: palegoldenrod;display-index: 2;">-->
<!-- </divider>-->
<!-- </div>-->
<!-- <text class="sub-title">-->
<!-- svg原子布局2-->
<!-- </text>-->
<!-- <div style="flex-direction: row;height: 30px;width: 100%;">-->
<!-- <divider vertical="true" style="background-color: blue;flex-weight: 1;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="background-color: black;flex-weight: 5;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="background-color: yellow;flex-weight: 4;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="background-color: red;flex-weight: 3;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="background-color:pink;flex-weight: 7;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="background-color: palegoldenrod;flex-weight: 2;">-->
<!-- </divider>-->
<!-- </div>-->
<!-- <text class="sub-title">-->
<!-- svg原子布局3-->
<!-- </text>-->
<!-- <div style="flex-direction: row;height:60px;width: 100%;">-->
<!-- <divider vertical="true" style="width:30px;background-color: blue;aspect-ratio: 0.6;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:30px;background-color: black;aspect-ratio:0.5;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:30px;background-color: yellow;aspect-ratio: 1.5;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:30px;background-color: red;aspect-ratio: 1.3;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:30px;background-color:pink;aspect-ratio: 1;">-->
<!-- </divider>-->
<!-- <divider vertical="true" style="width:30px;background-color: palegoldenrod;aspect-ratio:2;">-->
<!-- </divider>-->
<!-- </div>-->
<!-- </div>-->
<!-- <divider style="color: #000000; stroke-width: 2px;" vertical="false">-->
<!-- </divider>-->
<div class="multimode-container">
<text class="title">
多模输入
</text>
<text class="sub-title">
svg多模输入1
</text>
<svg class="multimode1" width="200" height="50" voicelabel = "voice"
subscriptflag="on" subscriptlabel="divider" scenelabel="common">
<rect x="10" y="5" width="200" height="50" fill="#978666"></rect>
</svg>
</div>
</div>
</div>
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
<div class="container">
<div class="prop-container">
<text class="title">
svg通用属性
</text>
<text class="sub-title">
通用属性 -- fill
</text>
<svg id ="fillProp" width="100" height="20" fill="red">
<rect width="80" height="15"></rect>
</svg>
<text class="sub-title">
通用属性 -- fill-opacity
</text>
<div style="height: 20px;width: 150px;">
<svg id ="fillOpacityPropOne" width="50px" height="20px" fill-opacity="0.5" fill="red">
<rect width="90%" height="20px" ></rect>
</svg>
<svg id ="fillOpacityPropTwo" width="50px" height="20px" fill-opacity="1" fill="red">
<rect width="90%" height="20px" ></rect>
</svg>
<svg id ="fillOpacityPropThree" width="50px" height="20px" fill-opacity="1.5" fill="red">
<rect width="90%" height="20px" ></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- fill-rule
</text>
<div style="height: 20px;width: 150px;">
<svg id ="fillRulePropOne" width="50px" height="20px" fill-rule="evenodd" fill="red">
<rect width="90%" height="20px" ></rect>
</svg>
<svg id ="fillRulePropTwo" width="50px" height="20px" fill-rule="nonzero" fill="red">
<rect width="90%" height="20px" ></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- opacity
</text>
<div style="height: 20px;width: 150px;">
<svg id ="opacityPropOne" width="50px" height="20px" opacity="0.5">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<svg id ="opacityPropTwo" width="50px" height="20px" opacity="1">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<svg id ="opacityPropThree" width="50px" height="20px" opacity="1.5">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke
</text>
<svg id ="strokeProp" width="100px" height="20px" stroke = "red">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-dasharray
</text>
<svg id ="strokeDashArrayProp" width="100px" height="20px" stroke = "red" stroke-dasharray="2 3">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-dashoffset
</text>
<svg id ="strokeDashOffsetProp" width="100px" height="20px" stroke = "red" stroke-dashoffset="23">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-linejoin
</text>
<div style="height: 20px;width: 150px;">
<svg id ="strokeLineJoinPropOne" width="50px" height="20px" stroke = "red" stroke-linejoin="bevel">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<svg id ="strokeLineJoinPropTwo" width="50px" height="20px" stroke = "red" stroke-linejoin="miter">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<svg id ="strokeLineJoinPropThree" width="50px" height="20px" stroke = "red" stroke-linejoin="round">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-linecap
</text>
<div style="height: 20px;width: 150px;">
<svg id ="strokeLineCapPropOne" width="50px" height="20px" stroke = "red" stroke-linecap="butt">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<svg id ="strokeLineCapPropTwo" width="50px" height="20px" stroke = "red" stroke-linecap="round">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<svg id ="strokeLineCapPropThree" width="50px" height="20px" stroke = "red" stroke-linecap="square">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-miterlimit
</text>
<svg id ="strokeMiterLimitProp" width="100px" height="20px" stroke = "red" stroke-miterlimit="10">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<text class="sub-title">
通用属性 -- stroke-opacity
</text>
<div style="height: 20px;width: 150px;">
<svg id ="strokeOpacityPropOne" width="50px" height="20px" stroke = "red" stroke-opacity="0.5">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<svg id ="strokeOpacityPropTwo" width="50px" height="20px" stroke = "red" stroke-opacity="1">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<svg id ="strokeOpacityPropThree" width="50px" height="20px" stroke = "red" stroke-opacity="1.5">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
</div>
<text class="sub-title">
通用属性 -- stroke-width
</text>
<svg id ="strokeWidthProp" width="100px" height="20px" stroke = "red" stroke-width="6">
<rect width="90%" height="20px" fill="white"></rect>
</svg>
<text class="sub-title">
通用属性 -- transform
</text>
<svg id ="transformProp" width="100px" height="20px"
transform="translate(10,5) scale(0.5 1.3) rotate(20 40 90) skewX(10) skewY(-15)">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</div>
<divider style="color: #000000; stroke-width: 2px;" vertical="true">
</divider>
<div class="prop-container">
<text class="title">
svg特有属性
</text>
<text class="sub-title">
特有属性-id
</text>
<svg id ="idProp" width="100px" height="40px">
</svg>
<text class="sub-title">
特有属性- width
</text>
<div style="height: 20px;width: 150px;">
<svg id ="widthPropOne" width="50px" height="20px">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<svg id ="widthPropTwo" width="50%" height="20px">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</div>
<text class="sub-title">
特有属性- height
</text>
<div style="height: 20px;width: 150px;">
<svg id ="heightPropOne" width="50px" height="20px">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<svg id ="heightPropTwo" width="50px" height="20%">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</div>
<text class="sub-title">
特有属性-x
</text>
<svg width="100px" height="40px">
<svg id ="xProp" width="100px" height="40px" fill="red" x="20">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</svg>
<text class="sub-title">
特有属性-y
</text>
<svg width="100px" height="40px">
<svg id ="yProp" width="100px" height="40px" fill="red" y="20">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</svg>
<text class="sub-title">
特有属性-viewBox
</text>
<svg id ="viewBoxProp" width="100px" height="40px" viewBox = "0 0 20 20">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<text class="sub-title">
特有属性-if
</text>
<svg id ="ifPropTrue" width="100px" height="50px" if="true">
<rect width="90px" height="20px" fill="red" ></rect>
</svg>
<text class="sub-title">
特有属性-show
</text>
<svg width="200px" height="200px">
<svg id ="showPropTrue" width="100px" height="40px" x="" y="20" show="true">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<svg id ="showPropFalse" width="100px" height="40px" x="10" y="50" show="false">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
<svg id ="showPropNone" width="100px" height="40px" x="20" y="80" show="">
<rect width="90%" height="20px" fill="red"></rect>
</svg>
</svg>
</div>
</div>
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
export default {
data: {
fillProp : null,
fillOpacityPropTwo : null,
fillOpacityPropOne : null,
fillOpacityPropThree : null,
fillRulePropTwo : null,
fillRulePropOne : null,
opacityPropOne : null,
opacityPropTwo : null,
opacityPropThree : null,
strokeProp : null,
strokeDashArrayProp : null,
strokeDashOffsetProp : null,
strokeLineJoinPropTwo : null,
strokeLineJoinPropOne : null,
strokeLineJoinPropThree : null,
strokeLineCapPropOne : null,
strokeLineCapPropTwo : null,
strokeLineCapPropThree : null,
strokeMiterLimitProp : null,
strokeOpacityPropOne : null,
strokeOpacityPropTwo : null,
strokeOpacityPropThree : null,
strokeWidthProp : null,
transformProp : null,
idProp : null,
widthPropOne : null,
heightPropOne : null,
heightPropTwo : null,
widthPropTwo : null,
xProp : null,
yProp : null,
viewBoxProp : null,
ifPropTrue : null,
showPropTrue : null,
showPropFalse : null,
showPropNone : null
},
onShow(){
this.getCommonPropValues();
globalThis.value = {
fillProp : this.fillProp,
fillOpacityPropTwo : this.fillOpacityPropTwo,
fillOpacityPropOne : this.fillOpacityPropOne,
fillOpacityPropThree : this.fillOpacityPropThree,
fillRulePropTwo : this.fillRulePropTwo,
fillRulePropOne : this.fillRulePropOne,
opacityPropOne : this.opacityPropOne,
opacityPropTwo : this.opacityPropTwo,
opacityPropThree : this.opacityPropThree,
strokeProp : this.strokeProp,
strokeDashArrayProp : this.strokeDashArrayProp,
strokeDashOffsetProp : this.strokeDashOffsetProp,
strokeLineJoinPropTwo : this.strokeLineJoinPropTwo,
strokeLineJoinPropOne : this.strokeLineJoinPropOne,
strokeLineJoinPropThree : this.strokeLineJoinPropThree,
strokeLineCapPropOne : this.strokeLineCapPropOne,
strokeLineCapPropTwo : this.strokeLineCapPropTwo,
strokeLineCapPropThree : this.strokeLineCapPropThree,
strokeMiterLimitProp : this.strokeMiterLimitProp,
strokeOpacityPropOne : this.strokeOpacityPropOne,
strokeOpacityPropTwo : this.strokeOpacityPropTwo,
strokeOpacityPropThree : this.strokeOpacityPropThree,
strokeWidthProp : this.strokeWidthProp,
transformProp : this.transformProp,
idProp : this.idProp,
widthPropOne : this.widthPropOne,
heightPropOne : this.heightPropOne,
heightPropTwo : this.heightPropTwo,
widthPropTwo : this.widthPropTwo,
xProp : this.xProp,
yProp : this.yProp,
viewBoxProp : this.viewBoxProp,
ifPropTrue: this.ifPropTrue,
showPropTrue: this.showPropTrue,
showPropFalse: this.showPropFalse,
showPropNone: this.showPropNone
}
},
getCommonPropValues(){
this.fillProp = this.$element("fillProp").getInspector()
this.fillOpacityPropTwo = this.$element("fillOpacityPropTwo").getInspector()
this.fillOpacityPropOne = this.$element("fillOpacityPropOne").getInspector()
this.fillOpacityPropThree = this.$element("fillOpacityPropThree").getInspector()
this.fillRulePropTwo = this.$element("fillRulePropTwo").getInspector()
this.fillRulePropOne = this.$element("fillRulePropOne").getInspector()
this.opacityPropOne = this.$element("opacityPropOne").getInspector()
this.opacityPropTwo = this.$element("opacityPropTwo").getInspector()
this.opacityPropThree = this.$element("opacityPropThree").getInspector()
this.strokeProp = this.$element("strokeProp").getInspector()
this.strokeDashArrayProp = this.$element("strokeDashArrayProp").getInspector()
this.strokeDashOffsetProp = this.$element("strokeDashOffsetProp").getInspector()
this.strokeLineJoinPropTwo = this.$element("strokeLineJoinPropTwo").getInspector()
this.strokeLineJoinPropOne = this.$element("strokeLineJoinPropOne").getInspector()
this.strokeLineJoinPropThree = this.$element("strokeLineJoinPropThree").getInspector()
this.strokeLineCapPropOne = this.$element("strokeLineCapPropOne").getInspector()
this.strokeLineCapPropTwo = this.$element("strokeLineCapPropTwo").getInspector()
this.strokeLineCapPropThree = this.$element("strokeLineCapPropThree").getInspector()
this.strokeMiterLimitProp = this.$element("strokeMiterLimitProp").getInspector()
this.strokeOpacityPropOne = this.$element("strokeOpacityPropOne").getInspector()
this.strokeOpacityPropTwo = this.$element("strokeOpacityPropTwo").getInspector()
this.strokeOpacityPropThree = this.$element("strokeOpacityPropThree").getInspector()
this.strokeWidthProp = this.$element("strokeWidthProp").getInspector()
this.transformProp = this.$element("transformProp").getInspector()
this.idProp = this.$element("idProp").getInspector()
this.widthPropOne = this.$element("widthPropOne").getInspector()
this.heightPropOne = this.$element("heightPropOne").getInspector()
this.heightPropTwo = this.$element("heightPropTwo").getInspector()
this.widthPropTwo = this.$element("widthPropTwo").getInspector()
this.xProp = this.$element("xProp").getInspector()
this.yProp = this.$element("yProp").getInspector()
this.viewBoxProp = this.$element("viewBoxProp").getInspector()
this.ifPropTrue = this.$element("ifPropTrue").getInspector()
this.showPropTrue = this.$element("showPropTrue").getInspector()
this.showPropFalse = this.$element("showPropFalse").getInspector()
this.showPropNone = this.$element("showPropNone").getInspector()
},
}
\ No newline at end of file
.container {
flex-direction:row;
width:100%;
height:100%;
padding: 1px;
}
.sub-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.style-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
text-align: center;
}
.prop-container{
flex-direction: column;
height: 100%;
flex-weight: 1;
align-items: center;
}
@keyframes ani1Go
{
from {
background-color: #f76160;
opacity:0.3;
width:50px;
height: 50px;
transform:translate(20px) rotate(10deg) scale(0.2) skew(40deg);
background-position:10% 10%
}
30% {
background-color: #60f761;
opacity:0.5;
width:70px;
height: 70px;
background-position:12% 12%;
transform:translateX(10px) translateY(5px) rotateX(20deg) rotateY(25deg) scaleX(0.6) scaleY(0.5) skewX(25deg) skewY(15deg)
}
to {
background-color: #6160f7;
opacity:1;
width:90px;
height: 90px;
background-position:22% 22%;
transform:rotate(180deg) scale(2)
}
}
@keyframes ani2Go
{
from {
background-color: #f76160;
opacity:0.3;
width:50px;
height: 50px;
background-position:10% 10%
}
30% {
background-color: #60f761;
opacity:0.5;
width:70px;
height: 70px;
background-position:12% 12%;
transform:translateX(10px) translateY(5px) translateZ(15px)
rotateX(20deg) rotateY(25deg) rotateZ(15deg) scaleX(0.6) scaleY(0.5) scaleZ(1.5) perspective(10);
}
to {
background-color: #6160f7;
opacity:1;
width:90px;
height: 90px;
background-position:22% 22%;
transform:translateX(30px) translateY(45px) translateZ(55px)
rotateX(180deg) rotateY(185deg) rotateZ(150deg) scaleX(2) scaleY(2.5) scaleZ(3.5);
}
}
<div class="container">
<div class="sub-container">
<div class="prop-container">
<text class="title">
通用属性
</text>
<text class="sub-title">
svg通用属性1
</text>
<svg x="0" y="0" width="400" height="80" viewBox="0 0 230 60" >
<rect x="10" y="10" width="50" height="50" fill-opacity="0.5"></rect>
<rect x="70" y="10" width="50" height="50" opacity="0.8"></rect>
<rect x="130" y="10" width="50" height="50" fill="red" fill-rule="evenodd"></rect>
<rect x="190" y="10" width="50" height="50" fill="red" stroke-linejoin="bevel"></rect>
</svg>
<text class="sub-title">
svg通用属性2
</text>
<svg x="0" y="0" width="400" height="80" viewBox="0 0 230 60" >
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" stroke-miterlimit="10"></rect>
<rect x="70" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white"></rect>
<rect x="130" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="yellow" stroke-dasharray="5 3" stroke-dashoffset="10"></rect>
<rect x="190" y="10" width="50" height="50" stroke="blue" stroke-width="4" stroke-dashoffset="10" fill="white" stroke-opacity="0.6"></rect>
</svg>
<text class="sub-title">
svg通用属性3
</text>
<svg x="0" y="0" width="180" height="200" viewBox="0 0 180 140">
<rect x="10" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="rotate(-10)"></rect>
<rect x="60" y="10" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="translate(40)"></rect>
<rect x="10" y="70" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="skewX(10)"></rect>
<rect x="120" y="70" width="50" height="50" stroke="red" stroke-width="4" fill="white" transform="skewY(5)"></rect>
</svg>
<text class="sub-title">
svg特有属性4
</text>
<svg width="400" height="300">
<svg width="400" height="200" viewBox="0 0 100 100">
<rect x="10" y="10" width="80" height="80" fill="#00FF00"></rect>
</svg>
<svg x="0" y="0" width="400" height="200" viewBox="0 0 200 200">
<rect x="10" y="10" width="80" height="80" fill="red"></rect>
</svg>
<svg x="0" y="0" width="400" height="200" viewBox="0 0 400 400">
<rect x="10" y="10" width="80" height="80" fill="blue"></rect>
</svg>
</svg>
</div>
</div>
</div>
......@@ -12,15 +12,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import prompt from '@system.prompt';
export default {
data: {
title: ""
},
onShow(){
// 通用属性
var prop1 = this.$element("prop1");
var name1 = prop1.dataSet.a
var prop2 = this.$refs.prop2;
var name2 = prop2.dataSet.a
}
}
\ No newline at end of file
......@@ -57,3 +57,6 @@ require('./imageAnimatorProps.test.js')
require('./textareaProps.test.js')
require('./videoProps.test.js')
require('./gridContainerProps.test.js')
require('./svgProps.test.js')
require('./rectProps.test.js')
require('./circleProps.test.js')
\ No newline at end of file
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import router from '@system.router';
import {describe, beforeAll,afterAll, it, expect} from 'deccjsunit/index';
describe('circlePropsJsTest', function () {
async function sleep(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve()
}, time)
}).then(() => {
console.info(`sleep ${time} over...`)
})
}
async function backToIndex() {
let backToIndexPromise = new Promise((resolve, reject) => {
setTimeout(() => {
router.back({
uri: 'pages/index/index'
});
resolve();
}, 500);
});
let clearPromise = new Promise((resolve, reject) => {
setTimeout(() => {
router.clear();
resolve();
}, 500);
});
await backToIndexPromise.then(() => {
return clearPromise;
});
}
/**
* run before testcase
*/
beforeAll(async function (done) {
console.info('[circlePropsJsTest] before each called')
let result;
let options = {
uri: 'pages/circle/prop/index'
}
try {
result = router.push(options)
console.info("push circleProps page success " + JSON.stringify(result));
} catch (err) {
console.error("push circleProps page error " + JSON.stringify(result));
}
await sleep(4000)
done()
});
/**
* run after testcase
*/
afterAll(async function () {
console.info('[circlePropsJsTest] after each called')
await backToIndex()
await sleep(1000)
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircletFillProp
* @tc.desc ACE
*/
it('testCircleFillProp', 0, async function (done) {
console.info('testCircleFillProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('50')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleFillOpacityPropOne
* @tc.desc ACE
*/
it('testCircleFillOpacityPropOne', 0, async function (done) {
console.info('testCircleFillOpacityPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('0.5')
console.info("[circleProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleFillOpacityPropTwo
* @tc.desc ACE
*/
it('testCircleFillOpacityPropTwo', 0, async function (done) {
console.info('testCircleFillOpacityPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('1')
console.info("[circleProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleFillOpacityPropThree
* @tc.desc ACE
*/
it('testCircleFillOpacityPropThree', 0, async function (done) {
console.info('testCircleFillOpacityPropThree START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropThree);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropThree')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('1.5')
console.info("[circleProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleFillRulePropOne
* @tc.desc ACE
*/
it('testCircleFillRulePropOne', 0, async function (done) {
console.info('testCircleFillRulePropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillRulePropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillRulePropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillRule).assertEqual('evenodd')
console.info("[circleProps] get inspector fill-rule value is: " + JSON.stringify(obj.$attrs.fillRule));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleFillRulePropTwo
* @tc.desc ACE
*/
it('testCircleFillRulePropTwo', 0, async function (done) {
console.info('testCircleFillRulePropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillRulePropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillRulePropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillRule).assertEqual('nonzero')
console.info("[circleProps] get inspector fill-rule value is: " + JSON.stringify(obj.$attrs.fillRule));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleOpacityPropOne
* @tc.desc ACE
*/
it('testCircleOpacityPropOne', 0, async function (done) {
console.info('testCircleOpacityPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('0.5')
console.info("[lineProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));;
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleOpacityPropTwo
* @tc.desc ACE
*/
it('testCircleOpacityPropTwo', 0, async function (done) {
console.info('testCircleOpacityPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('1')
console.info("[circleProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleOpacityPropThree
* @tc.desc ACE
*/
it('testCircleOpacityPropThree', 0, async function (done) {
console.info('testCircleOpacityPropThree START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropThree);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropThree')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('1.5')
console.info("[circleProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeProp
* @tc.desc ACE
*/
it('testCircleStrokeProp', 0, async function (done) {
console.info('testCircleStrokeProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeDashArrayProp
* @tc.desc ACE
*/
it('testCircleStrokeDashArrayProp', 0, async function (done) {
console.info('testCircleStrokeDashArrayProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeDashArrayProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeDashArrayProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeDasharray).assertEqual('2 3')
console.info("[circleProps] get inspector stroke-dasharray value is: " + JSON.stringify(obj.$attrs.strokeDasharray));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeDashOffsetProp
* @tc.desc ACE
*/
it('testCircleStrokeDashOffsetProp', 0, async function (done) {
console.info('testCircleStrokeDashOffsetProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeDashOffsetProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeDashOffsetProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeDashoffset).assertEqual('23')
console.info("[circleProps] get inspector stroke-dashoffset value is: " + JSON.stringify(obj.$attrs.strokeDashoffset));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeLineJoinPropOne
* @tc.desc ACE
*/
it('testCircleStrokeLineJoinPropOne', 0, async function (done) {
console.info('testCircleStrokeLineJoinPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('bevel')
console.info("[circleProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeLineJoinPropTwo
* @tc.desc ACE
*/
it('testCircleStrokeLineJoinPropTwo', 0, async function (done) {
console.info('testCircleStrokeLineJoinPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('miter')
console.info("[circleProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeLineJoinPropThree
* @tc.desc ACE
*/
it('testCircleStrokeLineJoinPropThree', 0, async function (done) {
console.info('testCircleStrokeLineJoinPropThree START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropThree);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropThree')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('round')
console.info("[circleProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeLineJoinPropOne
* @tc.desc ACE
*/
it('testCircleStrokeLineCapPropOne', 0, async function (done) {
console.info('testCircleStrokeLineCapPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('butt')
console.info("[circleProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeLineCapPropTwo
* @tc.desc ACE
*/
it('testCircleStrokeLineCapPropTwo', 0, async function (done) {
console.info('testCircleStrokeLineCapPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('round')
console.info("[circleProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeLineCapPropThree
* @tc.desc ACE
*/
it('testCircleStrokeLineCapPropThree', 0, async function (done) {
console.info('testCircleStrokeLineCapPropThree START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropThree);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropThree')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('square')
console.info("[circleProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeMiterLimitProp
* @tc.desc ACE
*/
it('testCircleStrokeMiterLimitProp', 0, async function (done) {
console.info('testCircleStrokeMiterLimitProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeMiterLimitProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeMiterLimitProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeMiterlimit).assertEqual('10')
console.info("[circleProps] get inspector stroke-miterlimit value is: " + JSON.stringify(obj.$attrs.strokeMiterlimit));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeOpacityPropOne
* @tc.desc ACE
*/
it('testCircleStrokeOpacityPropOne', 0, async function (done) {
console.info('testCircleStrokeOpacityPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('0.5')
console.info("[circleProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeOpacityPropTwo
* @tc.desc ACE
*/
it('testCircleStrokeOpacityPropTwo', 0, async function (done) {
console.info('testCircleStrokeOpacityPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('1')
console.info("[circleProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeOpacityPropThree
* @tc.desc ACE
*/
it('testCircleStrokeOpacityPropThree', 0, async function (done) {
console.info('testCircleStrokeOpacityPropThree START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropThree);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropThree')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('1.5')
console.info("[circleProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleStrokeWidthProp
* @tc.desc ACE
*/
it('testCircleStrokeWidthProp', 0, async function (done) {
console.info('testCircleStrokeWidthProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeWidthProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeWidthProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[circleProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeWidth).assertEqual('6')
console.info("[circleProps] get inspector stroke-width value is: " + JSON.stringify(obj.$attrs.strokeWidth));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleTransformProp
* @tc.desc ACE
*/
it('testCircleTransformProp', 0, async function (done) {
console.info('testCircleTransformProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.transformProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('transformProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('30')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('12')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('10')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.transform).assertEqual('translate(10,5) scale(0.5 1.3) rotate(20 40 90) skewX(10) skewY(-15)')
console.info("[circleProps] get inspector transform value is: " + JSON.stringify(obj.$attrs.transform));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleIdProp
* @tc.desc ACE
*/
it('testCircleIdProp', 0, async function (done) {
console.info('testCircleIdProp START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.idProp);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('idProp')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('50')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleCxPropOne
* @tc.desc ACE
*/
it('testCircleCxPropOne', 0, async function (done) {
console.info('testCircleCxPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.cxPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('cxPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('50')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleCxPropTwo
* @tc.desc ACE
*/
it('testCircleCxPropTwo', 0, async function (done) {
console.info('testCircleCxPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.cxPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('cxPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('50%')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('pink')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleCyPropOne
* @tc.desc ACE
*/
it('testCircleCyPropOne', 0, async function (done) {
console.info('testCircleCyPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.cyPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('cyPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('50')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleCyPropTwo
* @tc.desc ACE
*/
it('testCircleCyPropTwo', 0, async function (done) {
console.info('testCircleCyPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.cxPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('cxPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('100')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25%')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('pink')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleRPropOne
* @tc.desc ACE
*/
it('testCircleRPropOne', 0, async function (done) {
console.info('testCircleRPropOne START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.rPropOne);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('rPropOne')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('50')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testCircleRPropTwo
* @tc.desc ACE
*/
it('testCircleRPropTwo', 0, async function (done) {
console.info('testCircleRPropTwo START');
console.info("[circleProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.rPropTwo);
console.info("[circleProps] get inspector value is: " + JSON.stringify(obj));
console.info("[circleProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('circle')
console.info("[circleProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('rPropTwo')
console.info("[circleProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.cx).assertEqual('100')
console.info("[circleProps] get inspector cx value is: " + JSON.stringify(obj.$attrs.cx));
expect(obj.$attrs.cy).assertEqual('25')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.cy));
expect(obj.$attrs.r).assertEqual('20%')
console.info("[circleProps] get inspector r value is: " + JSON.stringify(obj.$attrs.r));
expect(obj.$attrs.fill).assertEqual('pink')
console.info("[circleProps] get inspector cy value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
});
\ No newline at end of file
......@@ -1318,7 +1318,7 @@ describe('aceJsTest', function () {
it('testSvgComponent', 0, async function (done) {
let result;
let options = {
uri: 'pages/svg/index'
uri: 'pages/svg/router/index'
}
try {
result = router.push(options)
......@@ -1329,7 +1329,7 @@ describe('aceJsTest', function () {
await sleep(5000)
let pages = router.getState();
console.info("[router.svg] getState" + JSON.stringify(pages));
expect("pages/svg/").assertEqual(pages.path);
expect("pages/svg/router/").assertEqual(pages.path);
done();
});
......@@ -1341,7 +1341,7 @@ describe('aceJsTest', function () {
it('testRectComponent', 0, async function (done) {
let result;
let options = {
uri: 'pages/rect/index'
uri: 'pages/rect/router/index'
}
try {
result = router.push(options)
......@@ -1352,7 +1352,7 @@ describe('aceJsTest', function () {
await sleep(5000)
let pages = router.getState();
console.info("[router.rect] getState" + JSON.stringify(pages));
expect("pages/rect/").assertEqual(pages.path);
expect("pages/rect/router/").assertEqual(pages.path);
done();
});
......@@ -1364,7 +1364,7 @@ describe('aceJsTest', function () {
it('testCircleComponent', 0, async function (done) {
let result;
let options = {
uri: 'pages/circle/index'
uri: 'pages/circle/router/index'
}
try {
result = router.push(options)
......@@ -1375,7 +1375,7 @@ describe('aceJsTest', function () {
await sleep(5000)
let pages = router.getState();
console.info("[router.circle] getState" + JSON.stringify(pages));
expect("pages/circle/").assertEqual(pages.path);
expect("pages/circle/router/").assertEqual(pages.path);
done();
});
......
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import router from '@system.router';
import {describe, beforeAll,afterAll, it, expect} from 'deccjsunit/index';
describe('rectPropsJsTest', function () {
async function sleep(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve()
}, time)
}).then(() => {
console.info(`sleep ${time} over...`)
})
}
async function backToIndex() {
let backToIndexPromise = new Promise((resolve, reject) => {
setTimeout(() => {
router.back({
uri: 'pages/index/index'
});
resolve();
}, 500);
});
let clearPromise = new Promise((resolve, reject) => {
setTimeout(() => {
router.clear();
resolve();
}, 500);
});
await backToIndexPromise.then(() => {
return clearPromise;
});
}
/**
* run before testcase
*/
beforeAll(async function (done) {
console.info('[rectPropsJsTest] before each called')
let result;
let options = {
uri: 'pages/rect/prop/index'
}
try {
result = router.push(options)
console.info("push rectProps page success " + JSON.stringify(result));
} catch (err) {
console.error("push rectProps page error " + JSON.stringify(result));
}
await sleep(4000)
done()
})
/**
* run after testcase
*/
afterAll(async function () {
console.info('[rectPropsJsTest] after each called')
await backToIndex()
await sleep(1000)
})
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectFillProp
* @tc.desc ACE
*/
it('testRectFillProp', 0, async function (done) {
console.info('testRectFillProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectFillOpacityPropOne
* @tc.desc ACE
*/
it('testRectFillOpacityPropOne', 0, async function (done) {
console.info('testRectFillOpacityPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('0.5')
console.info("[rectProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectFillOpacityPropTwo
* @tc.desc ACE
*/
it('testRectFillOpacityPropTwo', 0, async function (done) {
console.info('testRectFillOpacityPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('1')
console.info("[rectProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectFillOpacityPropThree
* @tc.desc ACE
*/
it('testRectFillOpacityPropThree', 0, async function (done) {
console.info('testRectFillOpacityPropThree START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropThree);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropThree')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('1.5')
console.info("[rectProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectFillRulePropOne
* @tc.desc ACE
*/
it('testRectFillRulePropOne', 0, async function (done) {
console.info('testRectFillRulePropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillRulePropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillRulePropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillRule).assertEqual('evenodd')
console.info("[rectProps] get inspector fill-rule value is: " + JSON.stringify(obj.$attrs.fillRule));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectFillRulePropTwo
* @tc.desc ACE
*/
it('testRectFillRulePropTwo', 0, async function (done) {
console.info('testRectFillRulePropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillRulePropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillRulePropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillRule).assertEqual('nonzero')
console.info("[rectProps] get inspector fill-rule value is: " + JSON.stringify(obj.$attrs.fillRule));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectOpacityPropOne
* @tc.desc ACE
*/
it('testRectOpacityPropOne', 0, async function (done) {
console.info('testRectOpacityPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('0.5')
console.info("[rectProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectOpacityPropTwo
* @tc.desc ACE
*/
it('testRectOpacityPropTwo', 0, async function (done) {
console.info('testRectOpacityPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('1')
console.info("[rectProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectOpacityPropThree
* @tc.desc ACE
*/
it('testRectOpacityPropThree', 0, async function (done) {
console.info('testRectOpacityPropThree START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropThree);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropThree')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('1.5')
console.info("[rectProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeProp
* @tc.desc ACE
*/
it('testRectStrokeProp', 0, async function (done) {
console.info('testRectStrokeProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeDashArrayProp
* @tc.desc ACE
*/
it('testRectStrokeDashArrayProp', 0, async function (done) {
console.info('testRectStrokeDashArrayProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeDashArrayProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeDashArrayProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeDasharray).assertEqual('2 3')
console.info("[rectProps] get inspector stroke-dasharray value is: " + JSON.stringify(obj.$attrs.strokeDasharray));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeDashOffsetProp
* @tc.desc ACE
*/
it('testRectStrokeDashOffsetProp', 0, async function (done) {
console.info('testRectStrokeDashOffsetProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeDashOffsetProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeDashOffsetProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeDashoffset).assertEqual('23')
console.info("[rectProps] get inspector stroke-dashoffset value is: " + JSON.stringify(obj.$attrs.strokeDashoffset));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeLineJoinPropOne
* @tc.desc ACE
*/
it('testRectStrokeLineJoinPropOne', 0, async function (done) {
console.info('testRectStrokeLineJoinPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('bevel')
console.info("[rectProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeLineJoinPropTwo
* @tc.desc ACE
*/
it('testRectStrokeLineJoinPropTwo', 0, async function (done) {
console.info('testRectStrokeLineJoinPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('miter')
console.info("[rectProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeLineJoinPropThree
* @tc.desc ACE
*/
it('testRectStrokeLineJoinPropThree', 0, async function (done) {
console.info('testRectStrokeLineJoinPropThree START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropThree);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropThree')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('round')
console.info("[rectProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeLineJoinPropOne
* @tc.desc ACE
*/
it('testRectStrokeLineJoinPropOne', 0, async function (done) {
console.info('testRectStrokeLineJoinPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('butt')
console.info("[rectProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeLineCapPropTwo
* @tc.desc ACE
*/
it('testRectStrokeLineCapPropTwo', 0, async function (done) {
console.info('testRectStrokeLineCapPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('round')
console.info("[rectProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeLineCapPropThree
* @tc.desc ACE
*/
it('testRectStrokeLineCapPropThree', 0, async function (done) {
console.info('testRectStrokeLineCapPropThree START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropThree);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropThree')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('square')
console.info("[rectProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeMiterLimitProp
* @tc.desc ACE
*/
it('testRectStrokeMiterLimitProp', 0, async function (done) {
console.info('testRectStrokeMiterLimitProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeMiterLimitProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeMiterLimitProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeMiterlimit).assertEqual('10')
console.info("[rectProps] get inspector stroke-miterlimit value is: " + JSON.stringify(obj.$attrs.strokeMiterlimit));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeOpacityPropOne
* @tc.desc ACE
*/
it('testRectStrokeOpacityPropOne', 0, async function (done) {
console.info('testRectStrokeOpacityPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('0.5')
console.info("[rectProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeOpacityPropTwo
* @tc.desc ACE
*/
it('testRectStrokeOpacityPropTwo', 0, async function (done) {
console.info('testRectStrokeOpacityPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('1')
console.info("[rectProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeOpacityPropThree
* @tc.desc ACE
*/
it('testRectStrokeOpacityPropThree', 0, async function (done) {
console.info('testRectStrokeOpacityPropThree START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropThree);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropThree')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('1.5')
console.info("[rectProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectStrokeWidthProp
* @tc.desc ACE
*/
it('testRectStrokeWidthProp', 0, async function (done) {
console.info('testRectStrokeWidthProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeWidthProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeWidthProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[rectProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeWidth).assertEqual('6')
console.info("[rectProps] get inspector stroke-width value is: " + JSON.stringify(obj.$attrs.strokeWidth));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectTransformProp
* @tc.desc ACE
*/
it('testRectTransformProp', 0, async function (done) {
console.info('testRectTransformProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.transformProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('transformProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('100px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.transform).assertEqual('translate(10,5) scale(0.5 1.3) rotate(20 40 90) skewX(10) skewY(-15)')
console.info("[rectProps] get inspector transform value is: " + JSON.stringify(obj.$attrs.transform));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectIdProp
* @tc.desc ACE
*/
it('testRectIdProp', 0, async function (done) {
console.info('testRectIdProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.idProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('idProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectWidthPropOne
* @tc.desc ACE
*/
it('testRectWidthPropOne', 0, async function (done) {
console.info('testRectWidthPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.widthPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('widthPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90px')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectWidthPropTwo
* @tc.desc ACE
*/
it('testRectWidthPropTwo', 0, async function (done) {
console.info('testRectWidthPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.widthPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('widthPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectHeightPropOne
* @tc.desc ACE
*/
it('testRectHeightPropOne', 0, async function (done) {
console.info('testRectHeightPropOne START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.heightPropOne);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('heightPropOne')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectHeightPropTwo
* @tc.desc ACE
*/
it('testRectHeightPropTwo', 0, async function (done) {
console.info('testRectHeightPropTwo START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.heightPropTwo);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('heightPropTwo')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('80%')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectXProp
* @tc.desc ACE
*/
it('testRectXProp', 0, async function (done) {
console.info('testRectXProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.xProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('xProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.x).assertEqual('20')
console.info("[rectProps] get inspector x value is: " + JSON.stringify(obj.$attrs.x));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectYProp
* @tc.desc ACE
*/
it('testRectYProp', 0, async function (done) {
console.info('testRectYProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.yProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('yProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.y).assertEqual('20')
console.info("[rectProps] get inspector y value is: " + JSON.stringify(obj.$attrs.y));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectRxProp
* @tc.desc ACE
*/
it('testRectRxProp', 0, async function (done) {
console.info('testRectRxProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.rxProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('rxProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.rx).assertEqual('20')
console.info("[rectProps] get inspector rx value is: " + JSON.stringify(obj.$attrs.rx));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testRectRyProp
* @tc.desc ACE
*/
it('testRectRyProp', 0, async function (done) {
console.info('testRectRyProp START');
console.info("[rectProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.ryProp);
console.info("[rectProps] get inspector value is: " + JSON.stringify(obj));
console.info("[rectProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('rect')
console.info("[rectProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('ryProp')
console.info("[rectProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('90%')
console.info("[rectProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[rectProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.ry).assertEqual('20')
console.info("[rectProps] get inspector ry value is: " + JSON.stringify(obj.$attrs.ry));
done();
});
});
\ No newline at end of file
/**
* Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import router from '@system.router';
import { describe, beforeAll, afterAll, it, expect } from 'deccjsunit/index';
describe('svgPropsJsTest', function () {
async function sleep(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve()
}, time)
}).then(() => {
console.info(`sleep ${time} over...`)
})
}
async function backToIndex() {
let backToIndexPromise = new Promise((resolve, reject) => {
setTimeout(() => {
router.back({
uri: 'pages/index/index'
});
resolve();
}, 500);
});
let clearPromise = new Promise((resolve, reject) => {
setTimeout(() => {
router.clear();
resolve();
}, 500);
});
await backToIndexPromise.then(() => {
return clearPromise;
});
}
/**
* run before testcase
*/
beforeAll(async function (done) {
console.info('[svgPropsJsTest] before each called')
let result;
let options = {
uri: 'pages/svg/prop/index'
}
try {
result = router.push(options)
console.info("push svgProps page success " + JSON.stringify(result));
} catch (err) {
console.error("push svgProps page error " + JSON.stringify(result));
}
await sleep(4000)
done()
});
/**
* run after testcase
*/
afterAll(async function () {
console.info('[svgPropsJsTest] after each called')
await backToIndex()
await sleep(1000)
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgFillProp
* @tc.desc ACE
*/
it('testSvgFillProp', 0, async function (done) {
console.info('testSvgFillProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgFillOpacityPropOne
* @tc.desc ACE
*/
it('testSvgFillOpacityPropOne', 0, async function (done) {
console.info('testSvgFillOpacityPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('0.5')
console.info("[svgProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgFillOpacityPropTwo
* @tc.desc ACE
*/
it('testSvgFillOpacityPropTwo', 0, async function (done) {
console.info('testSvgFillOpacityPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('1')
console.info("[svgProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgFillOpacityPropThree
* @tc.desc ACE
*/
it('testSvgFillOpacityPropThree', 0, async function (done) {
console.info('testSvgFillOpacityPropThree START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillOpacityPropThree);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillOpacityPropThree')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillOpacity).assertEqual('1.5')
console.info("[svgProps] get inspector fill-opacity value is: " + JSON.stringify(obj.$attrs.fillOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgFillRulePropOne
* @tc.desc ACE
*/
it('testSvgFillRulePropOne', 0, async function (done) {
console.info('testSvgFillRulePropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillRulePropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillRulePropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillRule).assertEqual('evenodd')
console.info("[svgProps] get inspector fill-rule value is: " + JSON.stringify(obj.$attrs.fillRule));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgFillRulePropTwo
* @tc.desc ACE
*/
it('testSvgFillRulePropTwo', 0, async function (done) {
console.info('testSvgFillRulePropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.fillRulePropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('fillRulePropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.fillRule).assertEqual('nonzero')
console.info("[svgProps] get inspector fill-rule value is: " + JSON.stringify(obj.$attrs.fillRule));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgOpacityPropOne
* @tc.desc ACE
*/
it('testSvgOpacityPropOne', 0, async function (done) {
console.info('testSvgOpacityPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('0.5')
console.info("[lineProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgOpacityPropTwo
* @tc.desc ACE
*/
it('testSvgOpacityPropTwo', 0, async function (done) {
console.info('testSvgOpacityPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('1')
console.info("[svgProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgOpacityPropThree
* @tc.desc ACE
*/
it('testSvgOpacityPropThree', 0, async function (done) {
console.info('testSvgOpacityPropThree START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.opacityPropThree);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('opacityPropThree')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
expect(obj.$attrs.opacity).assertEqual('1.5')
console.info("[svgProps] get inspector opacity value is: " + JSON.stringify(obj.$attrs.opacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeProp
* @tc.desc ACE
*/
it('testSvgStrokeProp', 0, async function (done) {
console.info('testSvgStrokeProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeDashArrayProp
* @tc.desc ACE
*/
it('testSvgStrokeDashArrayProp', 0, async function (done) {
console.info('testSvgStrokeDashArrayProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeDashArrayProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeDashArrayProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeDasharray).assertEqual('2 3')
console.info("[svgProps] get inspector stroke-dasharray value is: " + JSON.stringify(obj.$attrs.strokeDasharray));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeDashOffsetProp
* @tc.desc ACE
*/
it('testSvgStrokeDashOffsetProp', 0, async function (done) {
console.info('testSvgStrokeDashOffsetProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeDashOffsetProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeDashOffsetProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeDashoffset).assertEqual('23')
console.info("[svgProps] get inspector stroke-dashoffset value is: " + JSON.stringify(obj.$attrs.strokeDashoffset));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeLineJoinPropOne
* @tc.desc ACE
*/
it('testSvgStrokeLineJoinPropOne', 0, async function (done) {
console.info('testSvgStrokeLineJoinPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('bevel')
console.info("[svgProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeLineJoinPropTwo
* @tc.desc ACE
*/
it('testSvgStrokeLineJoinPropTwo', 0, async function (done) {
console.info('testSvgStrokeLineJoinPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('miter')
console.info("[svgProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeLineJoinPropThree
* @tc.desc ACE
*/
it('testSvgStrokeLineJoinPropThree', 0, async function (done) {
console.info('testSvgStrokeLineJoinPropThree START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineJoinPropThree);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineJoinPropThree')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLinejoin).assertEqual('round')
console.info("[svgProps] get inspector stroke-linejoin value is: " + JSON.stringify(obj.$attrs.strokeLinejoin));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeLineJoinPropOne
* @tc.desc ACE
*/
it('testSvgStrokeLineCapPropOne', 0, async function (done) {
console.info('testSvgStrokeLineCapPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('butt')
console.info("[svgProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeLineCapPropTwo
* @tc.desc ACE
*/
it('testSvgStrokeLineCapPropTwo', 0, async function (done) {
console.info('testSvgStrokeLineCapPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('round')
console.info("[svgProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeLineCapPropThree
* @tc.desc ACE
*/
it('testSvgStrokeLineCapPropThree', 0, async function (done) {
console.info('testSvgStrokeLineCapPropThree START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeLineCapPropThree);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeLineCapPropThree')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeLineCap).assertEqual('square')
console.info("[svgProps] get inspector stroke-lineCap value is: " + JSON.stringify(obj.$attrs.strokeLineCap));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeMiterLimitProp
* @tc.desc ACE
*/
it('testSvgStrokeMiterLimitProp', 0, async function (done) {
console.info('testSvgStrokeMiterLimitProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeMiterLimitProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeMiterLimitProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeMiterlimit).assertEqual('10')
console.info("[svgProps] get inspector stroke-miterlimit value is: " + JSON.stringify(obj.$attrs.strokeMiterlimit));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeOpacityPropOne
* @tc.desc ACE
*/
it('testSvgStrokeOpacityPropOne', 0, async function (done) {
console.info('testSvgStrokeOpacityPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('0.5')
console.info("[svgProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeOpacityPropTwo
* @tc.desc ACE
*/
it('testSvgStrokeOpacityPropTwo', 0, async function (done) {
console.info('testSvgStrokeOpacityPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('1')
console.info("[svgProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeOpacityPropThree
* @tc.desc ACE
*/
it('testSvgStrokeOpacityPropThree', 0, async function (done) {
console.info('testSvgStrokeOpacityPropThree START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeOpacityPropThree);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeOpacityPropThree')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeOpacity).assertEqual('1.5')
console.info("[svgProps] get inspector stroke-opacity value is: " + JSON.stringify(obj.$attrs.strokeOpacity));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgStrokeWidthProp
* @tc.desc ACE
*/
it('testSvgStrokeWidthProp', 0, async function (done) {
console.info('testSvgStrokeWidthProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.strokeWidthProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('strokeWidthProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.stroke).assertEqual('red')
console.info("[svgProps] get inspector stroke value is: " + JSON.stringify(obj.$attrs.stroke));
expect(obj.$attrs.strokeWidth).assertEqual('6')
console.info("[svgProps] get inspector stroke-width value is: " + JSON.stringify(obj.$attrs.strokeWidth));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgTransformProp
* @tc.desc ACE
*/
it('testSvgTransformProp', 0, async function (done) {
console.info('testSvgTransformProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.transformProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('transformProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.transform).assertEqual('translate(10,5) scale(0.5 1.3) rotate(20 40 90) skewX(10) skewY(-15)')
console.info("[svgProps] get inspector transform value is: " + JSON.stringify(obj.$attrs.transform));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgIdProp
* @tc.desc ACE
*/
it('testSvgIdProp', 0, async function (done) {
console.info('testSvgIdProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.idProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('idProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('40px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgWidthPropOne
* @tc.desc ACE
*/
it('testSvgWidthPropOne', 0, async function (done) {
console.info('testSvgWidthPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.widthPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('widthPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgWidthPropTwo
* @tc.desc ACE
*/
it('testSvgWidthPropTwo', 0, async function (done) {
console.info('testSvgWidthPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.widthPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('widthPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50%')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgHeightPropOne
* @tc.desc ACE
*/
it('testSvgHeightPropOne', 0, async function (done) {
console.info('testSvgHeightPropOne START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.heightPropOne);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('heightPropOne')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgHeightPropTwo
* @tc.desc ACE
*/
it('testSvgHeightPropTwo', 0, async function (done) {
console.info('testSvgHeightPropTwo START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.heightPropTwo);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('heightPropTwo')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('50px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('20%')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.fill).assertEqual('red')
console.info("[svgProps] get inspector fill value is: " + JSON.stringify(obj.$attrs.fill));
done();
});
/**
* @tc.number SUB_ACE_BASIC_COMPONENT_JS_API_0100
* @tc.name testSvgViewBoxProp
* @tc.desc ACE
*/
it('testSvgViewBoxProp', 0, async function (done) {
console.info('testSvgViewBoxProp START');
console.info("[svgProps] get globalThis.value is: " + JSON.stringify(globalThis.value));
let obj = JSON.parse(globalThis.value.viewBoxProp);
console.info("[svgProps] get inspector value is: " + JSON.stringify(obj));
console.info("[svgProps] get inspector attrs value is: " + JSON.stringify(obj.$attrs));
expect(obj.$type).assertEqual('svg')
console.info("[svgProps] get inspector $type value is: " + JSON.stringify(obj.$attrs.$type));
expect(obj.$attrs.id).assertEqual('viewBoxProp')
console.info("[svgProps] get inspector id value is: " + JSON.stringify(obj.$attrs.id));
expect(obj.$attrs.width).assertEqual('100px')
console.info("[svgProps] get inspector width value is: " + JSON.stringify(obj.$attrs.width));
expect(obj.$attrs.height).assertEqual('40px')
console.info("[svgProps] get inspector height value is: " + JSON.stringify(obj.$attrs.height));
expect(obj.$attrs.viewBox).assertEqual('0 0 20 20')
console.info("[svgProps] get inspector viewBox value is: " + JSON.stringify(obj.$attrs.viewBox));
done();
});
});
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册