1/* 2 * Copyright (C) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16// @ts-ignore 17import {LitSlider} from "../../../dist/base-ui/slider/LitSlider.js"; 18 19describe('LitSlider Test', ()=>{ 20 let litSliderPanel = new LitSlider(); 21 22 litSliderPanel.disabledX = 'disabledX' 23 litSliderPanel.customSlider = 'customSlider' 24 litSliderPanel.customLine = 'customLine' 25 litSliderPanel.customButton = 'customButton' 26 litSliderPanel.percent = 'percent' 27 litSliderPanel.resultUnit = 'resultUnit' 28 29 it('LitSliderTest01', ()=>{ 30 expect(litSliderPanel.disabledX).toEqual(''); 31 }) 32 33 it('LitSliderTest02', ()=>{ 34 expect(litSliderPanel.customSlider).toEqual(''); 35 }) 36 37 it('LitSliderTest03', ()=>{ 38 expect(litSliderPanel.customLine).toEqual('customLine'); 39 }) 40 41 it('LitSliderTest04', ()=>{ 42 expect(litSliderPanel.customButton).toEqual('customButton'); 43 }) 44 45 it('LitSliderTest05', ()=>{ 46 expect(litSliderPanel.percent).toEqual('percent'); 47 }) 48 49 it('LitSliderTest06', ()=>{ 50 expect(litSliderPanel.resultUnit).toEqual('resultUnit'); 51 }) 52 53 it('LitSliderTest07', ()=>{ 54 expect(litSliderPanel.formatSeconds(10)).toBe('00:00:10'); 55 }) 56 57 it('LitSliderTest08', ()=>{ 58 litSliderPanel.litSliderStyle = jest.fn(()=>true) 59 litSliderPanel.litSliderStyle.minRange = jest.fn(()=>2) 60 litSliderPanel.litSliderStyle.maxRange = jest.fn(()=>1) 61 litSliderPanel.litSliderStyle.stepSize = jest.fn(()=>1) 62 expect(litSliderPanel.renderDefaultSlider()).toBeUndefined(); 63 }) 64 65 it('LitSliderTest9', ()=>{ 66 expect(litSliderPanel.adoptedCallback()).toBeUndefined(); 67 }) 68 69 it('LitSliderTest10', ()=>{ 70 expect(litSliderPanel.disconnectedCallback()).toBeUndefined(); 71 }) 72 73 it('LitSliderTest11', ()=>{ 74 expect(litSliderPanel.disconnectedCallback()).toBeUndefined(); 75 }) 76 77 it('LitSliderTest12', function () { 78 expect(litSliderPanel.attributeChangedCallback("percent","","0%" || null)).toBeUndefined(); 79 }); 80 81 it('LitSliderTest13', function () { 82 expect(litSliderPanel.initHtml()).toMatchInlineSnapshot(` 83" 84 <style> 85 /* 86 * Outer box style 87 */ 88 :host{ 89 box-sizing:border-box; 90 display:flex; 91 92 } 93 /* 94 * The mouse is missing 95 */ 96 :host([disabled]){ 97 opacity:0.8; 98 cursor:not-allowed; 99 } 100 /* 101 * Disable sliding 102 */ 103 :host([disabled]) input[type=\\"range\\"]{ 104 pointer-events:none; 105 } 106 /* 107 * Currently the entire sliding container is controlled 108 */ 109 #slider-con{ 110 cursor:pointer; 111 display:flex; 112 align-items:center; 113 width:95%; 114 grid-auto-flow: row dense; 115 position: relative; 116 } 117 /* 118 * Display prompt information 119 */ 120 :host([showtips]){ 121 pointer-events:all; 122 } 123 124 #slider{ 125 background-color: var(--dark-background7,#D8D8D8); 126 z-index: 5; 127 } 128 129 /* 130 * Slider basic style 131 */ 132 input[type=\\"range\\"]{ 133 pointer-events:all; 134 margin:0 -5px; 135 width: 100%; 136 -webkit-appearance: none; 137 outline : 0; 138 background: rgba(0,0,0,0.1); 139 height: 10px; 140 border-radius:2px; 141 background: -webkit-linear-gradient(right, #46B1E3, #46B1E3) no-repeat; 142 } 143 144 /* 145 * Slider-line slidedAble area component 146 */ 147 input[type=\\"range\\"]::-webkit-slider-runnable-track{ 148 display: flex; 149 align-items: center; 150 position: relative; 151 height: 10px; 152 border-radius:5px; 153 } 154 155 /* 156 * Slider slider component 157 */ 158 input[type=\\"range\\"]::-webkit-slider-thumb{ 159 -webkit-appearance: none; 160 position: relative; 161 width:20px; 162 height:20px; 163 margin-top: -4px; 164 border-radius: 5px; 165 background:#999999; 166 transition:0.2s cubic-bezier(.12, .4, .29, 1.46); 167 } 168 169 input[type=\\"range\\"]:focus{ 170 z-index:2; 171 } 172 173 :host(:focus-within) #slider-con,:host(:hover) #slider-con{ 174 z-index:10 175 } 176 177 </style> 178 <slot id=\\"slot\\"></slot> 179 <div id='slider-con' dir=\\"right\\"> 180 <input id=\\"slider\\" type=\\"range\\" max=\\"10000000\\"> 181 </div> 182 " 183`); 184 }); 185 186 it('LitSliderTest14', ()=>{ 187 litSliderPanel.disabledX = false; 188 expect(litSliderPanel.disabledX).toBeFalsy(); 189 }); 190 191 it('LitSliderTest15', ()=>{ 192 litSliderPanel.customSlider = false; 193 expect(litSliderPanel.customSlider).toBeFalsy(); 194 }); 195 196 it('LitSliderTest16', ()=>{ 197 expect(litSliderPanel.formatSeconds(36000)).toBe('10:00:00'); 198 }); 199 200 it('LitSliderTest17', ()=>{ 201 expect(litSliderPanel.formatSeconds(4000)).toBe('01:06:40'); 202 }) 203 204 205}) 206