How to use isMobile method in Webdriverio

Best JavaScript code snippet using webdriverio-monorepo

DeviceDescriptors.js

Source:DeviceDescriptors.js Github

copy

Full Screen

1/**2 * Copyright 2017 Google Inc. All rights reserved.3 *4 * Licensed under the Apache License, Version 2.0 (the "License");5 * you may not use this file except in compliance with the License.6 * You may obtain a copy of the License at7 *8 * http://www.apache.org/licenses/LICENSE-2.09 *10 * Unless required by applicable law or agreed to in writing, software11 * distributed under the License is distributed on an "AS IS" BASIS,12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.13 * See the License for the specific language governing permissions and14 * limitations under the License.15 */16const models = [{17 'name': 'Blackberry PlayBook',18 'userAgent': 'Mozilla/5.0 (PlayBook; U; RIM Tablet OS 2.1.0; en-US) AppleWebKit/536.2+ (KHTML like Gecko) Version/7.2.1.0 Safari/536.2+',19 'viewport': {20 'width': 600,21 'height': 1024,22 'deviceScaleFactor': 1,23 'isMobile': true,24 'hasTouch': true,25 'isLandscape': false26 }27 },28 {29 'name': 'Blackberry PlayBook landscape',30 'userAgent': 'Mozilla/5.0 (PlayBook; U; RIM Tablet OS 2.1.0; en-US) AppleWebKit/536.2+ (KHTML like Gecko) Version/7.2.1.0 Safari/536.2+',31 'viewport': {32 'width': 1024,33 'height': 600,34 'deviceScaleFactor': 1,35 'isMobile': true,36 'hasTouch': true,37 'isLandscape': true38 }39 },40 {41 'name': 'BlackBerry Z30',42 'userAgent': 'Mozilla/5.0 (BB10; Touch) AppleWebKit/537.10+ (KHTML, like Gecko) Version/10.0.9.2372 Mobile Safari/537.10+',43 'viewport': {44 'width': 360,45 'height': 640,46 'deviceScaleFactor': 2,47 'isMobile': true,48 'hasTouch': true,49 'isLandscape': false50 }51 },52 {53 'name': 'BlackBerry Z30 landscape',54 'userAgent': 'Mozilla/5.0 (BB10; Touch) AppleWebKit/537.10+ (KHTML, like Gecko) Version/10.0.9.2372 Mobile Safari/537.10+',55 'viewport': {56 'width': 640,57 'height': 360,58 'deviceScaleFactor': 2,59 'isMobile': true,60 'hasTouch': true,61 'isLandscape': true62 }63 },64 {65 'name': 'Galaxy Note 3',66 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.3; en-us; SM-N900T Build/JSS15J) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30',67 'viewport': {68 'width': 360,69 'height': 640,70 'deviceScaleFactor': 3,71 'isMobile': true,72 'hasTouch': true,73 'isLandscape': false74 }75 },76 {77 'name': 'Galaxy Note 3 landscape',78 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.3; en-us; SM-N900T Build/JSS15J) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30',79 'viewport': {80 'width': 640,81 'height': 360,82 'deviceScaleFactor': 3,83 'isMobile': true,84 'hasTouch': true,85 'isLandscape': true86 }87 },88 {89 'name': 'Galaxy Note II',90 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.1; en-us; GT-N7100 Build/JRO03C) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30',91 'viewport': {92 'width': 360,93 'height': 640,94 'deviceScaleFactor': 2,95 'isMobile': true,96 'hasTouch': true,97 'isLandscape': false98 }99 },100 {101 'name': 'Galaxy Note II landscape',102 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.1; en-us; GT-N7100 Build/JRO03C) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30',103 'viewport': {104 'width': 640,105 'height': 360,106 'deviceScaleFactor': 2,107 'isMobile': true,108 'hasTouch': true,109 'isLandscape': true110 }111 },112 {113 'name': 'Galaxy S III',114 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.0; en-us; GT-I9300 Build/IMM76D) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30',115 'viewport': {116 'width': 360,117 'height': 640,118 'deviceScaleFactor': 2,119 'isMobile': true,120 'hasTouch': true,121 'isLandscape': false122 }123 },124 {125 'name': 'Galaxy S III landscape',126 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.0; en-us; GT-I9300 Build/IMM76D) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30',127 'viewport': {128 'width': 640,129 'height': 360,130 'deviceScaleFactor': 2,131 'isMobile': true,132 'hasTouch': true,133 'isLandscape': true134 }135 },136 {137 'name': 'Galaxy S5',138 'userAgent': 'Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',139 'viewport': {140 'width': 360,141 'height': 640,142 'deviceScaleFactor': 3,143 'isMobile': true,144 'hasTouch': true,145 'isLandscape': false146 }147 },148 {149 'name': 'Galaxy S5 landscape',150 'userAgent': 'Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',151 'viewport': {152 'width': 640,153 'height': 360,154 'deviceScaleFactor': 3,155 'isMobile': true,156 'hasTouch': true,157 'isLandscape': true158 }159 },160 {161 'name': 'iPad',162 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',163 'viewport': {164 'width': 768,165 'height': 1024,166 'deviceScaleFactor': 2,167 'isMobile': true,168 'hasTouch': true,169 'isLandscape': false170 }171 },172 {173 'name': 'iPad landscape',174 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',175 'viewport': {176 'width': 1024,177 'height': 768,178 'deviceScaleFactor': 2,179 'isMobile': true,180 'hasTouch': true,181 'isLandscape': true182 }183 },184 {185 'name': 'iPad Mini',186 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',187 'viewport': {188 'width': 768,189 'height': 1024,190 'deviceScaleFactor': 2,191 'isMobile': true,192 'hasTouch': true,193 'isLandscape': false194 }195 },196 {197 'name': 'iPad Mini landscape',198 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',199 'viewport': {200 'width': 1024,201 'height': 768,202 'deviceScaleFactor': 2,203 'isMobile': true,204 'hasTouch': true,205 'isLandscape': true206 }207 },208 {209 'name': 'iPad Pro',210 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',211 'viewport': {212 'width': 1024,213 'height': 1366,214 'deviceScaleFactor': 2,215 'isMobile': true,216 'hasTouch': true,217 'isLandscape': false218 }219 },220 {221 'name': 'iPad Pro landscape',222 'userAgent': 'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',223 'viewport': {224 'width': 1366,225 'height': 1024,226 'deviceScaleFactor': 2,227 'isMobile': true,228 'hasTouch': true,229 'isLandscape': true230 }231 },232 {233 'name': 'iPhone 4',234 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 7_1_2 like Mac OS X) AppleWebKit/537.51.2 (KHTML, like Gecko) Version/7.0 Mobile/11D257 Safari/9537.53',235 'viewport': {236 'width': 320,237 'height': 480,238 'deviceScaleFactor': 2,239 'isMobile': true,240 'hasTouch': true,241 'isLandscape': false242 }243 },244 {245 'name': 'iPhone 4 landscape',246 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 7_1_2 like Mac OS X) AppleWebKit/537.51.2 (KHTML, like Gecko) Version/7.0 Mobile/11D257 Safari/9537.53',247 'viewport': {248 'width': 480,249 'height': 320,250 'deviceScaleFactor': 2,251 'isMobile': true,252 'hasTouch': true,253 'isLandscape': true254 }255 },256 {257 'name': 'iPhone 5',258 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1',259 'viewport': {260 'width': 320,261 'height': 568,262 'deviceScaleFactor': 2,263 'isMobile': true,264 'hasTouch': true,265 'isLandscape': false266 }267 },268 {269 'name': 'iPhone 5 landscape',270 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1',271 'viewport': {272 'width': 568,273 'height': 320,274 'deviceScaleFactor': 2,275 'isMobile': true,276 'hasTouch': true,277 'isLandscape': true278 }279 },280 {281 'name': 'iPhone 6',282 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',283 'viewport': {284 'width': 375,285 'height': 667,286 'deviceScaleFactor': 2,287 'isMobile': true,288 'hasTouch': true,289 'isLandscape': false290 }291 },292 {293 'name': 'iPhone 6 landscape',294 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',295 'viewport': {296 'width': 667,297 'height': 375,298 'deviceScaleFactor': 2,299 'isMobile': true,300 'hasTouch': true,301 'isLandscape': true302 }303 },304 {305 'name': 'iPhone 6 Plus',306 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',307 'viewport': {308 'width': 414,309 'height': 736,310 'deviceScaleFactor': 3,311 'isMobile': true,312 'hasTouch': true,313 'isLandscape': false314 }315 },316 {317 'name': 'iPhone 6 Plus landscape',318 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',319 'viewport': {320 'width': 736,321 'height': 414,322 'deviceScaleFactor': 3,323 'isMobile': true,324 'hasTouch': true,325 'isLandscape': true326 }327 },328 {329 'name': 'iPhone 7',330 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',331 'viewport': {332 'width': 375,333 'height': 667,334 'deviceScaleFactor': 2,335 'isMobile': true,336 'hasTouch': true,337 'isLandscape': false338 }339 },340 {341 'name': 'iPhone 7 landscape',342 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',343 'viewport': {344 'width': 667,345 'height': 375,346 'deviceScaleFactor': 2,347 'isMobile': true,348 'hasTouch': true,349 'isLandscape': true350 }351 },352 {353 'name': 'iPhone 7 Plus',354 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',355 'viewport': {356 'width': 414,357 'height': 736,358 'deviceScaleFactor': 3,359 'isMobile': true,360 'hasTouch': true,361 'isLandscape': false362 }363 },364 {365 'name': 'iPhone 7 Plus landscape',366 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',367 'viewport': {368 'width': 736,369 'height': 414,370 'deviceScaleFactor': 3,371 'isMobile': true,372 'hasTouch': true,373 'isLandscape': true374 }375 },376 {377 'name': 'iPhone 8',378 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',379 'viewport': {380 'width': 375,381 'height': 667,382 'deviceScaleFactor': 2,383 'isMobile': true,384 'hasTouch': true,385 'isLandscape': false386 }387 },388 {389 'name': 'iPhone 8 landscape',390 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',391 'viewport': {392 'width': 667,393 'height': 375,394 'deviceScaleFactor': 2,395 'isMobile': true,396 'hasTouch': true,397 'isLandscape': true398 }399 },400 {401 'name': 'iPhone 8 Plus',402 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',403 'viewport': {404 'width': 414,405 'height': 736,406 'deviceScaleFactor': 3,407 'isMobile': true,408 'hasTouch': true,409 'isLandscape': false410 }411 },412 {413 'name': 'iPhone 8 Plus landscape',414 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',415 'viewport': {416 'width': 736,417 'height': 414,418 'deviceScaleFactor': 3,419 'isMobile': true,420 'hasTouch': true,421 'isLandscape': true422 }423 },424 {425 'name': 'iPhone SE',426 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1',427 'viewport': {428 'width': 320,429 'height': 568,430 'deviceScaleFactor': 2,431 'isMobile': true,432 'hasTouch': true,433 'isLandscape': false434 }435 },436 {437 'name': 'iPhone SE landscape',438 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1',439 'viewport': {440 'width': 568,441 'height': 320,442 'deviceScaleFactor': 2,443 'isMobile': true,444 'hasTouch': true,445 'isLandscape': true446 }447 },448 {449 'name': 'iPhone X',450 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',451 'viewport': {452 'width': 375,453 'height': 812,454 'deviceScaleFactor': 3,455 'isMobile': true,456 'hasTouch': true,457 'isLandscape': false458 }459 },460 {461 'name': 'iPhone X landscape',462 'userAgent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1',463 'viewport': {464 'width': 812,465 'height': 375,466 'deviceScaleFactor': 3,467 'isMobile': true,468 'hasTouch': true,469 'isLandscape': true470 }471 },472 {473 'name': 'JioPhone 2',474 'userAgent': 'Mozilla/5.0 (Mobile; LYF/F300B/LYF-F300B-001-01-15-130718-i;Android; rv:48.0) Gecko/48.0 Firefox/48.0 KAIOS/2.5',475 'viewport': {476 'width': 240,477 'height': 320,478 'deviceScaleFactor': 1,479 'isMobile': true,480 'hasTouch': true,481 'isLandscape': false482 }483 },484 {485 'name': 'JioPhone 2 landscape',486 'userAgent': 'Mozilla/5.0 (Mobile; LYF/F300B/LYF-F300B-001-01-15-130718-i;Android; rv:48.0) Gecko/48.0 Firefox/48.0 KAIOS/2.5',487 'viewport': {488 'width': 320,489 'height': 240,490 'deviceScaleFactor': 1,491 'isMobile': true,492 'hasTouch': true,493 'isLandscape': true494 }495 },496 {497 'name': 'Kindle Fire HDX',498 'userAgent': 'Mozilla/5.0 (Linux; U; en-us; KFAPWI Build/JDQ39) AppleWebKit/535.19 (KHTML, like Gecko) Silk/3.13 Safari/535.19 Silk-Accelerated=true',499 'viewport': {500 'width': 800,501 'height': 1280,502 'deviceScaleFactor': 2,503 'isMobile': true,504 'hasTouch': true,505 'isLandscape': false506 }507 },508 {509 'name': 'Kindle Fire HDX landscape',510 'userAgent': 'Mozilla/5.0 (Linux; U; en-us; KFAPWI Build/JDQ39) AppleWebKit/535.19 (KHTML, like Gecko) Silk/3.13 Safari/535.19 Silk-Accelerated=true',511 'viewport': {512 'width': 1280,513 'height': 800,514 'deviceScaleFactor': 2,515 'isMobile': true,516 'hasTouch': true,517 'isLandscape': true518 }519 },520 {521 'name': 'LG Optimus L70',522 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.4.2; en-us; LGMS323 Build/KOT49I.MS32310c) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/75.0.3765.0 Mobile Safari/537.36',523 'viewport': {524 'width': 384,525 'height': 640,526 'deviceScaleFactor': 1.25,527 'isMobile': true,528 'hasTouch': true,529 'isLandscape': false530 }531 },532 {533 'name': 'LG Optimus L70 landscape',534 'userAgent': 'Mozilla/5.0 (Linux; U; Android 4.4.2; en-us; LGMS323 Build/KOT49I.MS32310c) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/75.0.3765.0 Mobile Safari/537.36',535 'viewport': {536 'width': 640,537 'height': 384,538 'deviceScaleFactor': 1.25,539 'isMobile': true,540 'hasTouch': true,541 'isLandscape': true542 }543 },544 {545 'name': 'Microsoft Lumia 550',546 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 550) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263',547 'viewport': {548 'width': 640,549 'height': 360,550 'deviceScaleFactor': 2,551 'isMobile': true,552 'hasTouch': true,553 'isLandscape': false554 }555 },556 {557 'name': 'Microsoft Lumia 950',558 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 950) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263',559 'viewport': {560 'width': 360,561 'height': 640,562 'deviceScaleFactor': 4,563 'isMobile': true,564 'hasTouch': true,565 'isLandscape': false566 }567 },568 {569 'name': 'Microsoft Lumia 950 landscape',570 'userAgent': 'Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; Microsoft; Lumia 950) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Mobile Safari/537.36 Edge/14.14263',571 'viewport': {572 'width': 640,573 'height': 360,574 'deviceScaleFactor': 4,575 'isMobile': true,576 'hasTouch': true,577 'isLandscape': true578 }579 },580 {581 'name': 'Nexus 10',582 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 10 Build/MOB31T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36',583 'viewport': {584 'width': 800,585 'height': 1280,586 'deviceScaleFactor': 2,587 'isMobile': true,588 'hasTouch': true,589 'isLandscape': false590 }591 },592 {593 'name': 'Nexus 10 landscape',594 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 10 Build/MOB31T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36',595 'viewport': {596 'width': 1280,597 'height': 800,598 'deviceScaleFactor': 2,599 'isMobile': true,600 'hasTouch': true,601 'isLandscape': true602 }603 },604 {605 'name': 'Nexus 4',606 'userAgent': 'Mozilla/5.0 (Linux; Android 4.4.2; Nexus 4 Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',607 'viewport': {608 'width': 384,609 'height': 640,610 'deviceScaleFactor': 2,611 'isMobile': true,612 'hasTouch': true,613 'isLandscape': false614 }615 },616 {617 'name': 'Nexus 4 landscape',618 'userAgent': 'Mozilla/5.0 (Linux; Android 4.4.2; Nexus 4 Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',619 'viewport': {620 'width': 640,621 'height': 384,622 'deviceScaleFactor': 2,623 'isMobile': true,624 'hasTouch': true,625 'isLandscape': true626 }627 },628 {629 'name': 'Nexus 5',630 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',631 'viewport': {632 'width': 360,633 'height': 640,634 'deviceScaleFactor': 3,635 'isMobile': true,636 'hasTouch': true,637 'isLandscape': false638 }639 },640 {641 'name': 'Nexus 5 landscape',642 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',643 'viewport': {644 'width': 640,645 'height': 360,646 'deviceScaleFactor': 3,647 'isMobile': true,648 'hasTouch': true,649 'isLandscape': true650 }651 },652 {653 'name': 'Nexus 5X',654 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 5X Build/OPR4.170623.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',655 'viewport': {656 'width': 412,657 'height': 732,658 'deviceScaleFactor': 2.625,659 'isMobile': true,660 'hasTouch': true,661 'isLandscape': false662 }663 },664 {665 'name': 'Nexus 5X landscape',666 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 5X Build/OPR4.170623.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',667 'viewport': {668 'width': 732,669 'height': 412,670 'deviceScaleFactor': 2.625,671 'isMobile': true,672 'hasTouch': true,673 'isLandscape': true674 }675 },676 {677 'name': 'Nexus 6',678 'userAgent': 'Mozilla/5.0 (Linux; Android 7.1.1; Nexus 6 Build/N6F26U) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',679 'viewport': {680 'width': 412,681 'height': 732,682 'deviceScaleFactor': 3.5,683 'isMobile': true,684 'hasTouch': true,685 'isLandscape': false686 }687 },688 {689 'name': 'Nexus 6 landscape',690 'userAgent': 'Mozilla/5.0 (Linux; Android 7.1.1; Nexus 6 Build/N6F26U) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',691 'viewport': {692 'width': 732,693 'height': 412,694 'deviceScaleFactor': 3.5,695 'isMobile': true,696 'hasTouch': true,697 'isLandscape': true698 }699 },700 {701 'name': 'Nexus 6P',702 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 6P Build/OPP3.170518.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',703 'viewport': {704 'width': 412,705 'height': 732,706 'deviceScaleFactor': 3.5,707 'isMobile': true,708 'hasTouch': true,709 'isLandscape': false710 }711 },712 {713 'name': 'Nexus 6P landscape',714 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Nexus 6P Build/OPP3.170518.006) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',715 'viewport': {716 'width': 732,717 'height': 412,718 'deviceScaleFactor': 3.5,719 'isMobile': true,720 'hasTouch': true,721 'isLandscape': true722 }723 },724 {725 'name': 'Nexus 7',726 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 7 Build/MOB30X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36',727 'viewport': {728 'width': 600,729 'height': 960,730 'deviceScaleFactor': 2,731 'isMobile': true,732 'hasTouch': true,733 'isLandscape': false734 }735 },736 {737 'name': 'Nexus 7 landscape',738 'userAgent': 'Mozilla/5.0 (Linux; Android 6.0.1; Nexus 7 Build/MOB30X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Safari/537.36',739 'viewport': {740 'width': 960,741 'height': 600,742 'deviceScaleFactor': 2,743 'isMobile': true,744 'hasTouch': true,745 'isLandscape': true746 }747 },748 {749 'name': 'Nokia Lumia 520',750 'userAgent': 'Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 520)',751 'viewport': {752 'width': 320,753 'height': 533,754 'deviceScaleFactor': 1.5,755 'isMobile': true,756 'hasTouch': true,757 'isLandscape': false758 }759 },760 {761 'name': 'Nokia Lumia 520 landscape',762 'userAgent': 'Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 520)',763 'viewport': {764 'width': 533,765 'height': 320,766 'deviceScaleFactor': 1.5,767 'isMobile': true,768 'hasTouch': true,769 'isLandscape': true770 }771 },772 {773 'name': 'Nokia N9',774 'userAgent': 'Mozilla/5.0 (MeeGo; NokiaN9) AppleWebKit/534.13 (KHTML, like Gecko) NokiaBrowser/8.5.0 Mobile Safari/534.13',775 'viewport': {776 'width': 480,777 'height': 854,778 'deviceScaleFactor': 1,779 'isMobile': true,780 'hasTouch': true,781 'isLandscape': false782 }783 },784 {785 'name': 'Nokia N9 landscape',786 'userAgent': 'Mozilla/5.0 (MeeGo; NokiaN9) AppleWebKit/534.13 (KHTML, like Gecko) NokiaBrowser/8.5.0 Mobile Safari/534.13',787 'viewport': {788 'width': 854,789 'height': 480,790 'deviceScaleFactor': 1,791 'isMobile': true,792 'hasTouch': true,793 'isLandscape': true794 }795 },796 {797 'name': 'Pixel 2',798 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0; Pixel 2 Build/OPD3.170816.012) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',799 'viewport': {800 'width': 411,801 'height': 731,802 'deviceScaleFactor': 2.625,803 'isMobile': true,804 'hasTouch': true,805 'isLandscape': false806 }807 },808 {809 'name': 'Pixel 2 landscape',810 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0; Pixel 2 Build/OPD3.170816.012) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',811 'viewport': {812 'width': 731,813 'height': 411,814 'deviceScaleFactor': 2.625,815 'isMobile': true,816 'hasTouch': true,817 'isLandscape': true818 }819 },820 {821 'name': 'Pixel 2 XL',822 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Pixel 2 XL Build/OPD1.170816.004) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',823 'viewport': {824 'width': 411,825 'height': 823,826 'deviceScaleFactor': 3.5,827 'isMobile': true,828 'hasTouch': true,829 'isLandscape': false830 }831 },832 {833 'name': 'Pixel 2 XL landscape',834 'userAgent': 'Mozilla/5.0 (Linux; Android 8.0.0; Pixel 2 XL Build/OPD1.170816.004) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3765.0 Mobile Safari/537.36',835 'viewport': {836 'width': 823,837 'height': 411,838 'deviceScaleFactor': 3.5,839 'isMobile': true,840 'hasTouch': true,841 'isLandscape': true842 }843 }844];845export default models846// const modelsObjs = {}847// for (const device of models)848// modelsObjs[device.name] = device;...

Full Screen

Full Screen

navtie.js

Source:navtie.js Github

copy

Full Screen

1var isMobile = {2 android: function(){3 return navigator.userAgent.match(/Android/i) ? true : false;4 },5 ios: function(){6 return navigator.userAgent.match(/iPhone|iPad|iPod/i) ? true : false;7 },8 blackberry: function(){9 return navigator.userAgent.match(/BlackBerry/i) ? true : false;10 },11 wp: function(){12 return navigator.userAgent.match(/IEMobile/i) ? true : false;13 },14 any: function(){15 return (isMobile.android() || isMobile.blackberry() || isMobile.ios() || isMobile.wp());16 },17 verify: function(_mobile){18 var myreg = /^(((13[0-9]{1})|14[0-9]{1}|15[0-9]{1}|17[0-9]{1}|18[0-9]{1})+\d{8})$/;19 return myreg.test($("#mobile").val());20 }21};22function app_alert(_msg, _callback){23 if(isMobile.android()){24 window.ajlc.alert(_msg, _callback);25 }else if(isMobile.ios()){26 document.location = 'ajlc:alert:' + _msg + ':' + _callback;27 }else{28 //alert('您的设备暂不支持');29 }30}31function app_confirm(_msg, _callback){32 if(isMobile.android()){33 window.ajlc.confirm(_msg, _callback);34 }else if(isMobile.ios()){35 document.location = 'ajlc:confirm:' + _msg + ':' + _callback;36 }else{37 //alert('您的设备暂不支持');38 }39}40function app_toast(_msg){41 if(isMobile.android()){42 window.ajlc.toast(_msg);43 }else if(isMobile.ios()){44 document.location = 'ajlc:toast:' + _msg;45 }else{46 //alert('您的设备暂不支持');47 }48}49function app_show_loading(_msg){50 if(isMobile.android()){51 window.ajlc.loading(_msg);52 }else if(isMobile.ios()){53 document.location = 'ajlc:loading:' + _msg;54 }else{55 //alert('您的设备暂不支持');56 }57}58function app_cancel_loading(_callback){59 if(isMobile.android()){60 window.ajlc.cancel_loading(_callback);61 }else if(isMobile.ios()){62 document.location = 'ajlc:cancel_loading:' + _callback;63 }else{64 //alert('您的设备暂不支持');65 }66}67function app_share(_json){68 if(isMobile.android()){69 window.ajlc.share(_json);70 }else if(isMobile.ios()){71 document.location = 'ajlc:share:' + _json;72 }else{73 //alert('您的设备暂不支持');74 }75}76function app_share_one(_json, _callback){77 if(isMobile.android()){78 window.ajlc.share_one(_json, _callback);79 }else if(isMobile.ios()){80 document.location = 'ajlc:share_one:' + _json + ':' + _callback;81 }else{82 //alert('您的设备暂不支持');83 }84}85function app_wv_close(){86 if(isMobile.android()){87 window.ajlc.wv_close();88 }else if(isMobile.ios()){89 document.location = 'ajlc:wv_close';90 }else{91 //alert('您的设备暂不支持');92 }93}94function app_contact(_callback){95 if(isMobile.android()){96 window.ajlc.contact(_callback);97 }else if(isMobile.ios()){98 document.location = 'ajlc:contact:' + _callback;99 }else{100 //alert('您的设备暂不支持');101 }102}103function app_scroll_top(){104 if(isMobile.android()){105 window.ajlc.scroll_top();106 }else if(isMobile.ios()){107 document.location = 'ajlc:scroll_top';108 }109}110function app_login(){111 if(isMobile.android()){112 window.ajlc.login();113 }else if(isMobile.ios()){114 document.location = 'ajlc:login';115 }else{116 //alert('您的设备暂不支持');117 }118}119function app_location(_callback){120 if(isMobile.android()){121 window.ajlc.location(_callback);122 }else if(isMobile.ios()){123 document.location = 'ajlc:location:' + _callback;124 }else{125 //alert('您的设备暂不支持');126 }127}128function app_network_state(_callback){129 if(isMobile.android()){130 window.ajlc.network_state(_callback);131 }else if(isMobile.ios()){132 document.location = 'ajlc:network_state:' + _callback;133 }else{134 //alert('您的设备暂不支持');135 }136}137function app_realname() {138 if (isMobile.android()) {139 window.ajlc.realname();140 } else if (isMobile.ios()) {141 document.location = 'ajlc:realname';142 } else {143 //alert('您的设备暂时不支持');144 }145}146function app_imgupload(_callback) {147 if (isMobile.android()) {148 window.ajlc.imgupload(_callback);149 } else if (isMobile.ios()) {150 document.location = 'ajlc:imgupload:' + _callback;151 } else {152 //alert('您的设备暂时不支持');153 }154}155function app_contact_new(_callback) {156 if (isMobile.android()) {157 window.ajlc.contact_new(_callback);158 } else if (isMobile.ios()) {159 document.location = 'ajlc:contact_new:' + _callback;160 } else {161 //alert('您的设备暂不支持');162 }163}164function app_action(_params){165 if(isMobile.android()){166 window.ajlc.action(_params);167 }else if(isMobile.ios()){168 document.location = 'ajlc:action:' + _params;169 }else{170 //alert('您的设备暂不支持');171 }172}173function app_buy_product(_parmas){174 if(isMobile.android()){175 window.ajlc.buy_product(_params);176 }else if(isMobile.ios()){177 document.location = 'ajlc:buy_product:' + _params;178 }else{179 //alert('您的设备暂不支持');180 }181}182function app_integral_product(_id, _count, _direct, _price){183 if(isMobile.android()){184 window.ajlc.integral_product(parseInt(_id), parseInt(_count), parseInt(_direct), parseInt(_price));185 }else if(isMobile.ios()){186 document.location = 'ajlc:integral_product:' + _id + ':' + _count + ':' + _direct + ':' + _price;187 }else{188 //alert('您的设备暂不支持');189 }190}191function app_corner(_icon, _callback) {192 if (_icon == '') _icon = 'http://cdn2.aijialicai.com.cn/CDN/share/share.png';193 if (isMobile.android()) {194 window.ajlc.corner(_icon, _callback);195 } else if (isMobile.ios()) {196 document.location = 'ajlc:corner:' + encodeURIComponent(_icon) + ':' + _callback;197 }...

Full Screen

Full Screen

Page1.js

Source:Page1.js Github

copy

Full Screen

1import { Button, Paper, Typography } from "@mui/material";2import { display } from "@mui/system";3import React from "react";4import "../CSS/Home.css";5import useViewport from "../viewport";6import Subject from "./Subject";7const Page1 = () => {8 const { width, height, isMobile, isTablet } = useViewport();9 return (10 <Paper11 elevation={4}12 style={{13 fontFamily: "Poppins",14 position: "absolute",15 width: isMobile ? "387px" : isTablet ? "482px" : "625px",16 height: isMobile ? "362px" : "285px",17 marginLeft: isMobile ? "14px" : isTablet ? "96px" : "105px",18 marginTop: isMobile ? "20px" : "52px",19 }}20 >21 <div style={{ display: " flex" }}>22 <div23 className="img1"24 style={{25 height: isMobile ? "235px" : isTablet ? "230px" : "275px",26 width: isMobile ? "149px" : isTablet ? "128px" : "145px",27 marginTop: "16px",28 marginLeft: isMobile ? "25px" : isTablet ? "7px" : "25px",29 zIndex: "1",30 }}31 />32 <div33 className="img2"34 style={{35 height: isMobile ? "235px" : isTablet ? "229px" : "275px",36 width: isMobile ? "131px" : isTablet ? "119px" : "138px",37 marginTop: isMobile ? "22px" : "20px",38 marginLeft: isMobile ? "-104px" : isTablet ? "-122px" : "-139px",39 zIndex: "2",40 }}41 />42 <div43 className="edit"44 style={{45 fontFamily: "Poppins",46 display: isMobile ? "inline" : "flex",47 }}48 >49 <Typography50 variant={isMobile || isTablet ? "h5" : "h4"}51 fontWeight="600"52 style={{53 height: isMobile || isTablet ? "35px" : "45px",54 marginTop: isMobile ? "50px" : "9px",55 marginLeft: isMobile ? " 88px" : isTablet ? "30px" : "45px",56 fontSize: isMobile ? "25px" : isTablet ? "18px" : "30px",57 }}58 >59 Remus Lupin60 </Typography>61 <Button62 color="inherit"63 style={{64 border: "0.5px solid #000000",65 borderRadius: "4px",66 width: "103px",67 height: "23.55px",68 marginTop: isMobile ? "-130px" : "18px",69 marginLeft: isMobile ? "156px" : isTablet ? "70px" : "88px",70 }}71 >72 EditProfile73 </Button>74 </div>75 </div>76 <Typography77 variant="h5"78 fontSize={"13px"}79 style={{80 height: isMobile ? "35px" : "35px",81 marginTop: isMobile ? "-170px" : isTablet ? "-208px" : "-245px",82 marginLeft: isMobile ? "296px" : isTablet ? "162px" : "212px",83 }}84 >85 JEE Aspirant86 </Typography>87 <div style={{ display: "flex" }}>88 <div89 className="twitter"90 style={{91 height: "18px",92 width: "18px",93 marginTop: isMobile ? "2px" : "108px",94 marginLeft: isMobile ? "270px" : isTablet ? "21px" : "55px",95 zIndex: "1",96 }}97 />98 <div99 className="fb"100 style={{101 height: "18px",102 width: "18px",103 marginTop: isMobile ? "2px" : "108px",104 marginLeft: "25px",105 zIndex: "1",106 }}107 />108 <div109 className="insta"110 style={{111 height: "18px",112 width: "18px",113 marginTop: isMobile ? "2px" : "108px",114 marginLeft: "25px",115 zIndex: "1",116 }}117 />118 </div>119 <div120 style={{121 height: isMobile ? "35px" : "35px",122 width: isMobile ? null : isTablet ? "88px" : null,123 marginTop: isMobile ? "6px" : "-142px",124 marginLeft: isMobile ? "8px" : isTablet ? "162px" : "212px",125 }}126 >127 <Subject />128 </div>129 <div130 className="box"131 style={{132 width: isMobile ? "369px" : isTablet ? "303px" : "405px",133 marginTop: isMobile || isTablet ? "70px" : "76px",134 marginLeft: isMobile ? "8px" : isTablet ? "162px" : "212px",135 }}136 ></div>137 <Typography138 style={{139 width: isMobile ? "369px" : isTablet ? "303px" : "405px",140 marginTop: isTablet ? "5px" : "9px",141 marginLeft: isMobile ? "10px" : isTablet ? "162px" : "212px",142 fontSize: isMobile ? "13px" : "14px",143 }}144 >145 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ac, turpis cras146 in pellentesque at blandit velit. Magna at lobortis lacus, ultricies in147 vel morbi adipiscing. Nibh purus a sollicitudin scelerisque. Integer148 eget dui orci, dis tellus.149 </Typography>150 </Paper>151 );152};...

Full Screen

Full Screen

index.jsx

Source:index.jsx Github

copy

Full Screen

1/* eslint no-undef: 0 */2/* eslint arrow-parens: 0 */3import React from 'react';4import { enquireScreen } from 'enquire-js';5import Nav0 from './Nav0';6import Banner1 from './Banner1';7import Feature0 from './Feature0';8import Pricing0 from './Pricing0';9import Content5 from './Content5';10import Pricing1 from './Pricing1';11import Pricing2 from './Pricing2';12import Teams0 from './Teams0';13import Feature5 from './Feature5';14import Feature1 from './Feature1';15import Feature2 from './Feature2';16import Content12 from './Content12';17import Footer1 from './Footer1';18import {19 Nav00DataSource,20 Banner10DataSource,21 Feature00DataSource,22 Pricing00DataSource,23 Content50DataSource,24 Pricing10DataSource,25 Pricing20DataSource,26 Teams00DataSource,27 Feature01DataSource,28 Feature50DataSource,29 Feature10DataSource,30 Feature20DataSource,31 Content120DataSource,32 Footer10DataSource,33} from './data.source';34import './less/antMotionStyle.less';35let isMobile;36enquireScreen((b) => {37 isMobile = b;38});39const { location = {} } = typeof window !== 'undefined' ? window : {};40export default class Home extends React.Component {41 constructor(props) {42 super(props);43 this.state = {44 isMobile,45 show: !location.port, // 如果不是 dva 2.0 请删除46 };47 }48 componentDidMount() {49 // 适配手机屏幕;50 enquireScreen((b) => {51 this.setState({ isMobile: !!b });52 });53 // dva 2.0 样式在组件渲染之后动态加载，导致滚动组件不生效；线上不影响；54 /* 如果不是 dva 2.0 请删除 start */55 if (location.port) {56 // 样式 build 时间在 200-300ms 之间;57 setTimeout(() => {58 this.setState({59 show: true,60 });61 }, 500);62 }63 /* 如果不是 dva 2.0 请删除 end */64 }65 render() {66 const children = [67 //导航条68 <Nav069 id="Nav0_0"70 key="Nav0_0"71 dataSource={Nav00DataSource}72 isMobile={this.state.isMobile}73 />,74 //首页轮播75 <Banner176 id="Banner1_0"77 key="Banner1_0"78 dataSource={Banner10DataSource}79 isMobile={this.state.isMobile}80 />,81 //服务介绍82 <Feature083 id="Feature0_0"84 key="Feature0_0"85 dataSource={Feature00DataSource}86 isMobile={this.state.isMobile}87 />,88 <Pricing089 id="Pricing0_0"90 key="Pricing0_0"91 dataSource={Pricing00DataSource}92 isMobile={this.state.isMobile}93 />,94 //案例赏析95 <Content596 id="Content5_0"97 key="Content5_0"98 dataSource={Content50DataSource}99 isMobile={this.state.isMobile}100 />,101 //大宅102 <Pricing1103 id="Pricing1_0"104 key="Pricing1_0"105 dataSource={Pricing10DataSource}106 isMobile={this.state.isMobile}107 />,108 //设计师109 <Teams0110 id="Teams0_0"111 key="Teams0_0"112 dataSource={Teams00DataSource}113 isMobile={this.state.isMobile}114 />,115 //工艺保障116 <Feature0117 id="Feature0_1"118 key="Feature0_1"119 dataSource={Feature01DataSource}120 isMobile={this.state.isMobile}121 />,122 //尊享家123 <Pricing2124 id="Pricing1_2"125 key="Pricing1_2"126 dataSource={Pricing20DataSource}127 isMobile={this.state.isMobile}128 />,129 //装修攻略130 <Feature5131 id="Feature5_0"132 key="Feature5_0"133 dataSource={Feature50DataSource}134 isMobile={this.state.isMobile}135 />,136 //数据137 <Feature2138 id="Feature2_0"139 key="Feature2_0"140 dataSource={Feature20DataSource}141 isMobile={this.state.isMobile}142 />,143 //合作伙伴144 <Content12145 id="Content12_0"146 key="Content12_0"147 dataSource={Content120DataSource}148 isMobile={this.state.isMobile}149 />,150 //底部151 <Footer1152 id="Footer1_0"153 key="Footer1_0"154 dataSource={Footer10DataSource}155 isMobile={this.state.isMobile}156 />,157 ];158 return (159 <div160 className="templates-wrapper"161 ref={(d) => {162 this.dom = d;163 }}164 >165 {/* 如果不是 dva 2.0 替换成 {children} start */}166 {this.state.show && children}167 {/* 如果不是 dva 2.0 替换成 {children} end */}168 </div>169 );170 }...

Full Screen

Full Screen

Home.js

Source:Home.js Github

copy

Full Screen

1/* eslint no-undef: 0 */2/* eslint arrow-parens: 0 */3import React from 'react';4import { enquireScreen } from 'enquire-js';5import Nav2 from '../../layouts/Nav/Nav2';6import Banner3 from '../../components/Banner3';7import Content8 from '../../components/Content8';8import Content9 from '../../components/Content9';9import Content10 from '../../components/Content10';10import Content11 from '../../components/Content11';11import Content12 from '../../components/Content12';12import Footer2 from '../../layouts/Footer/Footer2';13import {14 Nav20DataSource,15 Banner30DataSource,16 Content80DataSource,17 Content90DataSource,18 Content100DataSource,19 Content110DataSource,20 Content120DataSource,21 Footer20DataSource,22} from '../../data/data.source';23import './less/antMotionStyle.less';24let isMobile;25enquireScreen((b) => {26 isMobile = b;27});28const { location = {} } = typeof window !== 'undefined' ? window : {};29export default class Home extends React.Component {30 constructor(props) {31 super(props);32 this.state = {33 isMobile,34 show: !location.port, // 如果不是 dva 2.0 请删除35 };36 }37 componentDidMount() {38 // 适配手机屏幕;39 enquireScreen((b) => {40 this.setState({ isMobile: !!b });41 });42 // dva 2.0 样式在组件渲染之后动态加载，导致滚动组件不生效；线上不影响；43 /* 如果不是 dva 2.0 请删除 start */44 if (location.port) {45 // 样式 build 时间在 200-300ms 之间;46 setTimeout(() => {47 this.setState({48 show: true,49 });50 }, 500);51 }52 /* 如果不是 dva 2.0 请删除 end */53 }54 render() {55 const children = [56 <Nav257 id="Nav2_0"58 key="Nav2_0"59 dataSource={Nav20DataSource}60 isMobile={this.state.isMobile}61 />,62 <Banner363 id="Banner3_0"64 key="Banner3_0"65 dataSource={Banner30DataSource}66 isMobile={this.state.isMobile}67 />,68 <Content869 id="Content8_0"70 key="Content8_0"71 dataSource={Content80DataSource}72 isMobile={this.state.isMobile}73 />,74 <Content975 id="Content9_0"76 key="Content9_0"77 dataSource={Content90DataSource}78 isMobile={this.state.isMobile}79 />,80 <Content1081 id="Content10_0"82 key="Content10_0"83 dataSource={Content100DataSource}84 isMobile={this.state.isMobile}85 />,86 <Content1187 id="Content11_0"88 key="Content11_0"89 dataSource={Content110DataSource}90 isMobile={this.state.isMobile}91 />,92 <Content1293 id="Content12_0"94 key="Content12_0"95 dataSource={Content120DataSource}96 isMobile={this.state.isMobile}97 />,98 <Footer299 id="Footer2_0"100 key="Footer2_0"101 dataSource={Footer20DataSource}102 isMobile={this.state.isMobile}103 />,104 ];105 return (106 <div107 className="templates-wrapper"108 ref={(d) => {109 this.dom = d;110 }}111 >112 {/* 如果不是 dva 2.0 替换成 {children} start */}113 {this.state.show && children}114 {/* 如果不是 dva 2.0 替换成 {children} end */}115 </div>116 );117 }...

Full Screen

Full Screen

Stretcher.js

Source:Stretcher.js Github

copy

Full Screen

1import React from "react";2import { makeStyles } from '@material-ui/core/styles';3import { CNButton } from "@Components/shared/CNButton/CNButton";4import useIsMobile from "@Core/hooks/useIsMobile";5import styled from 'styled-components';6const useStretcherStyles = makeStyles((theme) => ({7 styleBtn: {8 width: "200px",9 height: "60px",10 backgroundColor: "#FF787C",11 "&:hover": {12 backgroundColor: '#fff'13 },14 },15}))16const HeaderStretcher = styled.h1`17 color: #fff;18 font-size: ${props => props.isMobile ? "22px" : "30px"};19 margin: ${props => props.isMobile ? "16px 0 16px 0" : "0"};20 line-height: 1;21 padding-bottom:${props => props.isMobile ? "0" : "10px"};22 `23const BodyStretcher = styled.p`24 color:#fff;25 margin: ${props => props.isMobile ? "-18px 0 0 0" : "-34px 0 0 0"};26 font-size: ${props => props.isMobile ? "14px" : "16px"};27 `28const RootStretcher = styled.div`29 display: flex;30 height: ${props => props.isMobile ? "180px" : "150px"};31 width: 100%;32 background-color: ${props => props.theme.palette.primary.main};33 justify-content: ${props => props.isMobile ? "space-between" : "space-around"};34 font-family: ${props => props.theme.typography.fontFamily};35 flex-direction: ${props => props.isMobile ? "column" : "row"};36 `37const TextContainer = styled.div`38 display: flex ;39 width: 100% ;40 height: 100% ;41 margin-left: ${props => props.isMobile ? "16px" : "0"}; 42 flex-direction: column ;43 justify-content: space-evenly ;44 text-align: ${props => props.isMobile ? "inherit" : "center"};45 `46const BtnContainer = styled.div`47 display: ${props => props.isMobile ? "inline-block" : "flex"};48 width: 100%;49 height: 100%;50 margin-left: ${props => props.isMobile ? "16px" : "0"}; 51 justify-content: ${props => props.isMobile ? "inherit" : "center"};52 align-items: ${props => props.isMobile ? "inherit" : "center"};53 `54export const Stretcher = (props) => {55 const { isMobile } = useIsMobile();56 const stretcherStyle = useStretcherStyles()57 return (58 <RootStretcher isMobile={isMobile}>59 <TextContainer isMobile={isMobile}>60 <HeaderStretcher isMobile={isMobile} className={stretcherStyle.styleHeader}>Become a Real Estate Agent</HeaderStretcher>61 <BodyStretcher isMobile={isMobile} className={stretcherStyle.styleBody} >We only work with the best companies around the globe</BodyStretcher>62 </TextContainer>63 <BtnContainer isMobile={isMobile}>64 <CNButton type="main" className={stretcherStyle.styleBtn} >Register Now</CNButton>65 </BtnContainer>66 </RootStretcher>67 )...

Full Screen

Full Screen

styles.js

Source:styles.js Github

copy

Full Screen

1import styled from 'styled-components';2import KnowUsImg from '../../assets/img/knowus.png'3export const SectionContainer = styled.div`4 background-color: ${({theme})=> theme.palette.primary};5 display: flex;6 flex-direction: ${({isMobile})=> isMobile ? 'column' : 'row'};7 align-items: center;8 justify-content: center;9 width: 100vw;10 min-height:100vh;11 padding: ${({theme, isMobile})=>theme.scale.base*(isMobile?4:10)}px ${({theme, isMobile})=>theme.scale.base*(isMobile?4:10)}px ${({theme, isMobile})=>theme.scale.base*(isMobile?4:10)}px ${({theme, isMobile})=>theme.scale.base*(isMobile?4:10)}px;12`;13export const OnboardingContainer = styled.div`14 padding: ${({theme,isMobile})=>theme.scale.base*(isMobile?0:6)}px 0 ${({theme,isMobile})=>theme.scale.base*(isMobile?0:6)}px ${({theme,isMobile})=>theme.scale.base*(isMobile?0:6)}px;15 width: ${({isMobile})=> isMobile ? '100%' : '50%'};16 display: flex;17 flex-direction: column;18 align-items: left;19 justify-content: flex-start;20`;21export const SectionTitle = styled.h1`22 color: ${({theme})=> theme.palette.dark};23 font-family: ${({theme})=>theme.fonts.primary};24 font-weight: 700;25 font-size: ${({theme, isMobile})=>isMobile ? theme.scale.h2 : `${theme.scale.base*7}px`};26 text-transform: uppercase;27 margin-bottom: ${({theme})=>theme.scale.base*4}px;28 margin-top: ${({theme, isMobile})=> isMobile ? `${theme.scale.base*4}px` : 0};29`;30export const SectionParagraph = styled.p`31 color: ${({theme})=> theme.palette.dark};32 font-family: ${({theme})=>theme.fonts.secondary};33`;34export const SectionImage = styled.div`35 background-image: url(${KnowUsImg});36 background-size: contain;37 background-size: cover;38 background-position: center;39 width: ${({isMobile})=> isMobile ? '350px' : '600px'};40 height: ${({isMobile})=> isMobile ? '300px' : '450px'};...

Full Screen

Full Screen

index.js

Source:index.js Github

copy

Full Screen

1import React from 'react';2import WindowSection from "../../components/WindowSection";3import Button from '../../components/Button';4import * as S from './styles';5import HomeVideo from '../../assets/video/videohome.mp4';6import HomeImage from '../../assets/img/mobilehomeimg.jpg';7import useMediaQuery from '@material-ui/core/useMediaQuery';8export default function Home(){9 const isMobile = useMediaQuery('(max-width:484px)');10 return (11 <WindowSection id='home'>12 {isMobile ? 13 <S.VideoContainer isMobile={isMobile}>14 <S.HomeImg src={HomeImage} alt='image'/> 15 </S.VideoContainer> 16 :17 <S.VideoContainer isMobile={isMobile}>18 <S.VideoHome isMobile={isMobile} loop autoPlay muted>19 <source src={HomeVideo} type='video/mp4'/>20 </S.VideoHome>21 </S.VideoContainer>22 }23 <S.TextOverlay isMobile={isMobile}>24 <S.HomeText isMobile={isMobile}>25 Hacemos crecer tu negocio con marketing creativo26 </S.HomeText>27 <Button styleType='callToAction' isMobile={isMobile}>QUIERO AUMENTAR MIS VENTAS</Button>28 </S.TextOverlay>29 </WindowSection>30 )...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var webdriverio = require('webdriverio');2var options = {3 desiredCapabilities: {4 }5};6 .remote(options)7 .init()8 .isMobile().then(function(isMobile) {9 console.log("isMobile: " + isMobile);10 })11 .end();

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var webdriverio = require('webdriverio');2var options = {3 desiredCapabilities: {4 }5};6var client = webdriverio.remote(options);7 .init()8 .isMobile(function(err, res) {9 })10 .end();11var webdriverio = require('webdriverio');12var options = {13 desiredCapabilities: {14 }15};16var client = webdriverio.remote(options);17 .init()18 .isMobile(function(err, res) {19 })20 .end();21var webdriverio = require('webdriverio');22var options = {23 desiredCapabilities: {24 }25};26var client = webdriverio.remote(options);27 .init()28 .isMobile(function(err, res) {29 })30 .end();31var webdriverio = require('webdriverio');32var options = {33 desiredCapabilities: {34 }35};36var client = webdriverio.remote(options);37 .init()38 .isMobile(function(err, res) {39 })40 .end();41var webdriverio = require('webdriverio');42var options = {43 desiredCapabilities: {44 }45};46var client = webdriverio.remote(options);47 .init()48 .isMobile(function(err, res) {49 })50 .end();51var webdriverio = require('webdriverio');52var options = {53 desiredCapabilities: {

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const webdriverio = require('webdriverio');2const options = { desiredCapabilities: { browserName: 'chrome' } };3const client = webdriverio.remote(options);4client.isMobile().then(function(isMobile) {5 console.log('Is mobile: ' + isMobile);6});7client.end();

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1describe('My First Test', () => {2 it('Does not do much!', () => {3 expect(true).to.equal(true)4 })5})6describe('My First Test', () => {7 it('Does not do much!', () => {8 expect(true).to.equal(true)9 })10})11describe('My First Test', () => {12 it('Does not do much!', () => {13 expect(true).to.equal(true)14 })15})16describe('My First Test', () => {17 it('Does not do much!', () => {18 expect(true).to.equal(true)19 })20})21describe('My First Test', () => {22 it('Does not do much!', () => {23 expect(true).to.equal(true)24 })25})26describe('My First Test', () => {27 it('Does not do much!', () => {28 expect(true).to.equal(true)29 })30})31describe('My First Test', () => {32 it('Does not do much!', () => {33 expect(true).to.equal(true)34 })35})36describe('My First Test', () => {37 it('Does not do much!', () => {38 expect(true).to.equal(true)39 })40})41describe('My First Test', () => {42 it('Does not do much!', () => {43 expect(true).to.equal(true)44 })45})46describe('My First Test', () => {47 it('Does not do much!', () => {48 expect(true).to.equal(true)49 })50})51describe('My First Test', () => {52 it('Does not do much!', () => {53 expect(true).to.equal(true)54 })55})56describe('My First Test', () => {57 it('Does not do much!', () => {58 expect(true).to

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1describe('Test', function() {2 it('should work', function () {3 console.log(browser.isMobile);4 });5});6describe('Test', function() {7 it('should work', function () {8 console.log(browser.isMobile);9 });10});

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1describe('Test if browser is mobile browser', function() {2 it('should return true if browser is mobile browser', function () {3 browser.isMobile().should.be.true;4 });5});6describe('Test if browser is mobile browser', function() {7 it('should return true if browser is mobile browser', function () {8 expect(browser.isMobile()).to.be.true;9 });10});11describe('Test if browser is mobile browser', function() {12 it('should return true if browser is mobile browser', function () {13 assert.equal(browser.isMobile(), true);14 });15});16describe('Test if browser is mobile browser', function() {17 it('should return true if browser is mobile browser', function () {18 expect(browser.isMobile()).to.equal(true);19 });20});21describe('Test if browser is mobile browser', function() {22 it('should return true if browser is mobile browser', function () {23 expect(browser.isMobile()).to.be.true;24 });25});26describe('Test if browser is mobile browser', function() {27 it('should return true if browser is mobile browser', function () {28 expect(browser.isMobile()).to.equal(true);29 });30});31describe('Test if browser is mobile browser', function() {32 it('should return true if browser

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const isMobile = require('is-mobile');2if (isMobile()) {3 console.log('Mobile');4} else {5 console.log('Desktop');6}

Full Screen

Full Screen

WebdriverIO Tutorial

Wondering what could be a next-gen browser and mobile test automation framework that is also simple and concise? Yes, that’s right, it's WebdriverIO. Since the setup is very easy to follow compared to Selenium testing configuration, you can configure the features manually thereby being the center of attraction for automation testing. Therefore the testers adopt WedriverIO to fulfill their needs of browser testing.

Learn to run automation testing with WebdriverIO tutorial. Go from a beginner to a professional automation test expert with LambdaTest WebdriverIO tutorial.

Chapters

  1. Running Your First Automation Script - Learn the steps involved to execute your first Test Automation Script using WebdriverIO since the setup is very easy to follow and the features can be configured manually.

  2. Selenium Automation With WebdriverIO - Read more about automation testing with WebdriverIO and how it supports both browsers and mobile devices.

  3. Browser Commands For Selenium Testing - Understand more about the barriers faced while working on your Selenium Automation Scripts in WebdriverIO, the ‘browser’ object and how to use them?

  4. Handling Alerts & Overlay In Selenium - Learn different types of alerts faced during automation, how to handle these alerts and pops and also overlay modal in WebdriverIO.

  5. How To Use Selenium Locators? - Understand how Webdriver uses selenium locators in a most unique way since having to choose web elements very carefully for script execution is very important to get stable test results.

  6. Deep Selectors In Selenium WebdriverIO - The most popular automation testing framework that is extensively adopted by all the testers at a global level is WebdriverIO. Learn how you can use Deep Selectors in Selenium WebdriverIO.

  7. Handling Dropdown In Selenium - Learn more about handling dropdowns and how it's important while performing automated browser testing.

  8. Automated Monkey Testing with Selenium & WebdriverIO - Understand how you can leverage the amazing quality of WebdriverIO along with selenium framework to automate monkey testing of your website or web applications.

  9. JavaScript Testing with Selenium and WebdriverIO - Speed up your Javascript testing with Selenium and WebdriverIO.

  10. Cross Browser Testing With WebdriverIO - Learn more with this step-by-step tutorial about WebdriverIO framework and how cross-browser testing is done with WebdriverIO.

Run Webdriverio automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

... View sample repo... View DocumentationSign up Free
›
_

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

...
Sign up with GoogleSign up with Email
Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful