How to use getBoundingClientRect method in taiko

Best JavaScript code snippet using taiko

game.js

Source:game.js Github

copy

Full Screen

...103 points = 0;104 }105 $('.inner-name').text(player.name);106 document.querySelector('.game-over').classList.remove('on');107 player.x = gameZone.getBoundingClientRect().width / 2 - player.w;108 player.y = gameZone.getBoundingClientRect().height - player.h;109 gameZone.innerHTML += `<div class="player" style="left: ${player.x}px; top: ${player.y}px;"></div>`;110 player.el = document.querySelector('.player');111 switch (player.hp) {112 case 2:113 document.querySelector('.life').innerHTML = `<img src="src/sprites/heart-1.png" class="life__image">`;114 break;115 case 1:116 document.querySelector('.life').innerHTML = `<img src="src/sprites/heart-2.png" class="life__image">`;117 break;118 case 0:119 document.querySelector('.life').innerHTML = `<img src="src/sprites/heart-3.png" class="life__image">`;120 break;121 }122}123/*124 Intervals125 */126function intervals() {127 ints.run = setInterval(() => {128 if (player.run) {129 switch (player.side) {130 case 1: // Top131 if (player.y > 0) {132 player.y -= player.step;133 player.el.style.top = `${player.y}px`;134 }135 break;136 case 3: // Bottom137 if (player.y < gameZone.getBoundingClientRect().bottom - player.h - 2) {138 player.y += player.step;139 player.el.style.top = `${player.y}px`;140 }141 break;142 case 2: // Right143 if (player.x < gameZone.getBoundingClientRect().right - player.w - 2) {144 player.x += player.step;145 player.el.style.left = `${player.x}px`;146 }147 break;148 case 4: // Left149 if (player.x > 0) {150 player.x -= player.step;151 player.el.style.left = `${player.x}px`;152 }153 break;154 }155 }156 }, fps);157 ints.bullet = setInterval(() => {158 let bullets = document.querySelectorAll('.bullet');159 bullets.forEach((bullet) => {160 let direction = bullet.getAttribute('direction');161 switch (direction) {162 case 'top':163 if (bullet.getBoundingClientRect().top < 0) {164 bullet.parentNode.removeChild(bullet);165 } else {166 bullet.style.top = bullet.getBoundingClientRect().top - bulletSpeed + 'px';167 }168 break;169 case 'right':170 if (bullet.getBoundingClientRect().right > gameZone.getBoundingClientRect().width) {171 bullet.parentNode.removeChild(bullet);172 } else {173 bullet.style.left = bullet.getBoundingClientRect().left + bulletSpeed + 'px';174 }175 break;176 case 'bottom':177 if (bullet.getBoundingClientRect().bottom > gameZone.getBoundingClientRect().height) {178 bullet.parentNode.removeChild(bullet);179 } else {180 bullet.style.top = bullet.getBoundingClientRect().top + bulletSpeed + 'px';181 }182 break;183 case 'left':184 if (bullet.getBoundingClientRect().left < 0) {185 bullet.parentNode.removeChild(bullet);186 } else {187 bullet.style.left = bullet.getBoundingClientRect().left - bulletSpeed + 'px';188 }189 break;190 }191 })192 }, fps);193 ints.enemyBullet = setInterval(() => {194 let bullets = document.querySelectorAll('.enemy-bullet');195 bullets.forEach((bullet) => {196 let direction = bullet.getAttribute('direction');197 switch (direction) {198 case 'top':199 if (bullet.getBoundingClientRect().top < 0) {200 bullet.parentNode.removeChild(bullet);201 } else {202 bullet.style.top = bullet.getBoundingClientRect().top - enemyBulletSpeed + 'px';203 }204 break;205 case 'right':206 if (bullet.getBoundingClientRect().right > gameZone.getBoundingClientRect().width) {207 bullet.parentNode.removeChild(bullet);208 } else {209 bullet.style.left = bullet.getBoundingClientRect().left + enemyBulletSpeed + 'px';210 }211 break;212 case 'bottom':213 if (bullet.getBoundingClientRect().bottom > gameZone.getBoundingClientRect().height) {214 bullet.parentNode.removeChild(bullet);215 } else {216 bullet.style.top = bullet.getBoundingClientRect().top + enemyBulletSpeed + 'px';217 }218 break;219 case 'left':220 if (bullet.getBoundingClientRect().left < 0) {221 bullet.parentNode.removeChild(bullet);222 } else {223 bullet.style.left = bullet.getBoundingClientRect().left - enemyBulletSpeed + 'px';224 }225 break;226 }227 })228 }, fps)229 ints.enemy = setInterval(() => {230 let enemies = document.querySelectorAll('.enemy');231 enemies.forEach((enemy) => {232 const playerPosTop = player.el.getBoundingClientRect().top,233 playerPosRight = player.el.getBoundingClientRect().right,234 playerPosBottom = player.el.getBoundingClientRect().bottom,235 playerPosLeft = player.el.getBoundingClientRect().left,236 enemyPosTop = enemy.getBoundingClientRect().top,237 enemyPosRight = enemy.getBoundingClientRect().right,238 enemyPosBottom = enemy.getBoundingClientRect().bottom,239 enemyPosLeft = enemy.getBoundingClientRect().left;240 if (241 playerPosTop < enemyPosBottom &&242 playerPosBottom > enemyPosTop &&243 playerPosRight > enemyPosLeft &&244 playerPosLeft < enemyPosRight245 ) {246 next();247 //alert('Зіткнення')248 }249 let bullets = document.querySelectorAll('.bullet');250 bullets.forEach((bullet) => {251 let direction = bullet.getAttribute('direction');252 if (['top', 'left', 'right'].includes(direction)) {253 if (254 bullet.getBoundingClientRect().top < enemy.getBoundingClientRect().bottom &&255 bullet.getBoundingClientRect().bottom > enemy.getBoundingClientRect().top &&256 bullet.getBoundingClientRect().right > enemy.getBoundingClientRect().left &&257 bullet.getBoundingClientRect().left < enemy.getBoundingClientRect().right258 ) {259 enemy.parentNode.removeChild(enemy);260 bullet.parentNode.removeChild(bullet);261 points += 1;262 document.querySelector('.inner-points').innerText = points;263 }264 } else {265 if (266 bullet.getBoundingClientRect().bottom > enemy.getBoundingClientRect().top &&267 bullet.getBoundingClientRect().right > enemy.getBoundingClientRect().left &&268 bullet.getBoundingClientRect().left < enemy.getBoundingClientRect().right269 ) {270 enemy.parentNode.removeChild(enemy);271 bullet.parentNode.removeChild(bullet);272 points += 1;273 document.querySelector('.inner-points').innerText = points;274 }275 }276 });277 let direction = enemy.getAttribute('direction');278 switch (direction) {279 case 'right':280 if (enemy.getBoundingClientRect().left <= 0) {281 enemy.parentNode.removeChild(enemy);282 } else {283 enemy.style.left = enemy.getBoundingClientRect().left - 3 + 'px';284 }285 break;286 case 'left':287 if (enemy.getBoundingClientRect().left >= gameZone.getBoundingClientRect().width) {288 enemy.parentNode.removeChild(enemy);289 } else {290 enemy.style.left = enemy.getBoundingClientRect().left + 3 + 'px';291 }292 break;293 case 'top':294 if (enemy.getBoundingClientRect().top <= 0) {295 enemy.parentNode.removeChild(enemy);296 } else {297 enemy.style.top = enemy.getBoundingClientRect().top - 3 + 'px';298 }299 break;300 case 'bottom':301 if (enemy.getBoundingClientRect().bottom >= gameZone.getBoundingClientRect().height) {302 enemy.parentNode.removeChild(enemy);303 } else {304 enemy.style.top = enemy.getBoundingClientRect().top + 3 + 'px';305 }306 break;307 }308 // if (enemy.getBoundingClientRect().right >= gameZone.getBoundingClientRect().width) {309 // enemy.parentNode.removeChild(enemy);310 // } else {311 // enemy.style.left = enemy.getBoundingClientRect().left + 3 + 'px';312 // }313 })314 }, fps);315 ints.generateEnemy = setInterval(() => {316 let direction = randomInteger(1, 4);317 switch (direction) {318 case 1: //Top319 gameZone.innerHTML += `<div class="enemy" style="transform: rotate(-90deg); top: ${gameZone.getBoundingClientRect().height - player.h}px; left: ${randomInteger(0, gameZone.getBoundingClientRect().width - player.w)}px" direction="top"></div>`;320 break;321 case 2: //Left322 gameZone.innerHTML += `<div class="enemy" style="transform: rotate(-180deg); top: ${randomInteger(0, gameZone.getBoundingClientRect().height - player.h)}px; left: ${gameZone.getBoundingClientRect().width - player.w}px;" direction="right"></div>`;323 break;324 case 3: //Bottom325 gameZone.innerHTML += `<div class="enemy" style="transform: rotate(90deg); top: 0; left: ${randomInteger(0, gameZone.getBoundingClientRect().width - player.w)}px;" direction="bottom"></div>`;326 break;327 case 4: //Right328 gameZone.innerHTML += `<div class="enemy" style="top: ${randomInteger(0, gameZone.getBoundingClientRect().height - player.h)}px; left: 0;" direction="left"></div>`;329 break;330 }331 player.el = document.querySelector('.player');332 }, enemyGenerateSpeed);333 ints.enemyShots = setInterval(() => {334 let enemies = document.querySelectorAll('.enemy');335 enemies.forEach((enemy) => {336 let direction = enemy.getAttribute('direction');337 switch (direction) {338 case 'right':339 if (340 player.el.getBoundingClientRect().top > enemy.getBoundingClientRect().top &&341 player.el.getBoundingClientRect().top < enemy.getBoundingClientRect().bottom &&342 player.el.getBoundingClientRect().right < enemy.getBoundingClientRect().left343 ) {344 // alert('в зоні видимості')345 gameZone.innerHTML += `<div class="enemy-bullet" direction="left" style="left: ${enemy.getBoundingClientRect().left}px; top: ${enemy.getBoundingClientRect().top + 30}px;"></div>`;346 player.el = document.querySelector('.player');347 }348 if (enemy.getBoundingClientRect().left <= 0) {349 enemy.parentNode.removeChild(enemy);350 } else {351 enemy.style.left = enemy.getBoundingClientRect().left - 3 + 'px';352 }353 break;354 case 'left':355 if (356 player.el.getBoundingClientRect().top > enemy.getBoundingClientRect().top &&357 player.el.getBoundingClientRect().top < enemy.getBoundingClientRect().bottom &&358 player.el.getBoundingClientRect().left > enemy.getBoundingClientRect().right359 ) {360 gameZone.innerHTML += `<div class="enemy-bullet" direction="right" style="left: ${enemy.getBoundingClientRect().right}px; top: ${enemy.getBoundingClientRect().top + enemy.getBoundingClientRect().height / 2 - 10}px;"></div>`;361 player.el = document.querySelector('.player');362 }363 if (enemy.getBoundingClientRect().left >= gameZone.getBoundingClientRect().width) {364 enemy.parentNode.removeChild(enemy);365 } else {366 enemy.style.left = enemy.getBoundingClientRect().left + 3 + 'px';367 }368 break;369 case 'top':370 if (371 player.el.getBoundingClientRect().bottom < enemy.getBoundingClientRect().top &&372 player.el.getBoundingClientRect().right > enemy.getBoundingClientRect().left &&373 player.el.getBoundingClientRect().right < enemy.getBoundingClientRect().right374 ) {375 gameZone.innerHTML += `<div class="enemy-bullet" direction="top" style="left: ${enemy.getBoundingClientRect().left + enemy.getBoundingClientRect().width / 2 - 10}px; top: ${enemy.getBoundingClientRect().top}px;"></div>`;376 player.el = document.querySelector('.player');377 }378 if (enemy.getBoundingClientRect().top <= 0) {379 enemy.parentNode.removeChild(enemy);380 } else {381 enemy.style.top = enemy.getBoundingClientRect().top - 3 + 'px';382 }383 break;384 case 'bottom':385 if (386 player.el.getBoundingClientRect().top > enemy.getBoundingClientRect().bottom &&387 player.el.getBoundingClientRect().right > enemy.getBoundingClientRect().left &&388 player.el.getBoundingClientRect().right < enemy.getBoundingClientRect().right389 ) {390 gameZone.innerHTML += `<div class="enemy-bullet" direction="bottom" style="left: ${enemy.getBoundingClientRect().left + enemy.getBoundingClientRect().width / 2 - 10}px; top: ${enemy.getBoundingClientRect().bottom}px;"></div>`;391 player.el = document.querySelector('.player');392 }393 if (enemy.getBoundingClientRect().bottom >= gameZone.getBoundingClientRect().height) {394 enemy.parentNode.removeChild(enemy);395 } else {396 enemy.style.top = enemy.getBoundingClientRect().top + 3 + 'px';397 }398 break;399 }400 // if (enemy.getBoundingClientRect().right >= gameZone.getBoundingClientRect().width) {401 // enemy.parentNode.removeChild(enemy);402 // } else {403 // enemy.style.left = enemy.getBoundingClientRect().left + 3 + 'px';404 // }405 })406 }, enemyShotsSpeed)407 ints.checkEnemyBulletForPlayer = setInterval(() => {408 let bullets = document.querySelectorAll('.enemy-bullet');409 bullets.forEach((bullet) => {410 let direction = bullet.getAttribute('direction');411 if (['top', 'left', 'right'].includes(direction)) {412 if (413 bullet.getBoundingClientRect().top < player.el.getBoundingClientRect().bottom &&414 bullet.getBoundingClientRect().bottom > player.el.getBoundingClientRect().top &&415 bullet.getBoundingClientRect().right > player.el.getBoundingClientRect().left &&416 bullet.getBoundingClientRect().left < player.el.getBoundingClientRect().right417 ) {418 next();419 bullet.parentNode.removeChild(bullet);420 }421 } else {422 if (423 bullet.getBoundingClientRect().bottom > player.el.getBoundingClientRect().top &&424 bullet.getBoundingClientRect().right > player.el.getBoundingClientRect().left &&425 bullet.getBoundingClientRect().left < player.el.getBoundingClientRect().right426 ) {427 next();428 bullet.parentNode.removeChild(bullet);429 }430 }431 });432 }, fps)433}434/*435 Add Bullet436 */437function addBullet() {438 switch (player.side) {439 case 1:...

Full Screen

Full Screen

Dragable.js

Source:Dragable.js Github

copy

Full Screen

...129 this.changeBoxPosition(ReactDOM.findDOMNode(this.b), ReactDOM.findDOMNode(this.a));130 }131 }132 changeBoxPosition(newBoxA, newBoxB) {133 if (newBoxA.getBoundingClientRect().left > newBoxB.getBoundingClientRect().right) {134 if (newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().top) {135 PubSub.publish('boxMove', ['left bottom', 'right top']);136 }137 if (138 newBoxA.getBoundingClientRect().bottom <139 newBoxB.getBoundingClientRect().top + newBoxB.getBoundingClientRect().height / 2 &&140 newBoxA.getBoundingClientRect().bottom > newBoxB.getBoundingClientRect().top141 ) {142 PubSub.publish('boxMove', ['left middle-bottom', 'right top-middle']);143 }144 if (145 newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().bottom &&146 newBoxA.getBoundingClientRect().bottom >147 newBoxB.getBoundingClientRect().top + newBoxB.getBoundingClientRect().height / 2148 ) {149 PubSub.publish('boxMove', ['left middle', 'right middle']);150 }151 if (152 newBoxA.getBoundingClientRect().top >153 newBoxB.getBoundingClientRect().top + newBoxB.getBoundingClientRect().height / 2 &&154 newBoxA.getBoundingClientRect().top < newBoxB.getBoundingClientRect().bottom155 ) {156 PubSub.publish('boxMove', ['left top-middle', 'right middle-bottom']);157 }158 if (newBoxA.getBoundingClientRect().top > newBoxB.getBoundingClientRect().bottom) {159 PubSub.publish('boxMove', ['left top', 'right bottom']);160 }161 }162 if (newBoxA.getBoundingClientRect().right < newBoxB.getBoundingClientRect().left) {163 if (newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().top) {164 PubSub.publish('boxMove', ['right bottom', 'left top']);165 }166 if (167 newBoxA.getBoundingClientRect().bottom <168 newBoxB.getBoundingClientRect().top + newBoxB.getBoundingClientRect().height / 2 &&169 newBoxA.getBoundingClientRect().bottom > newBoxB.getBoundingClientRect().top170 ) {171 PubSub.publish('boxMove', ['right middle-bottom', 'left top-middle']);172 }173 if (174 newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().bottom &&175 newBoxA.getBoundingClientRect().bottom >176 newBoxB.getBoundingClientRect().top + newBoxB.getBoundingClientRect().height / 2177 ) {178 PubSub.publish('boxMove', ['right middle', 'left middle']);179 }180 if (181 newBoxA.getBoundingClientRect().top >182 newBoxB.getBoundingClientRect().top + newBoxB.getBoundingClientRect().height / 2 &&183 newBoxA.getBoundingClientRect().top < newBoxB.getBoundingClientRect().bottom184 ) {185 PubSub.publish('boxMove', ['right top-middle', 'left middle-bottom']);186 }187 if (newBoxA.getBoundingClientRect().top > newBoxB.getBoundingClientRect().bottom) {188 PubSub.publish('boxMove', ['right top', 'left bottom']);189 }190 }191 if (192 newBoxA.getBoundingClientRect().right <193 newBoxB.getBoundingClientRect().left + newBoxB.getBoundingClientRect().width / 2 &&194 newBoxA.getBoundingClientRect().right > newBoxB.getBoundingClientRect().left195 ) {196 if (newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().top) {197 PubSub.publish('boxMove', ['center-right bottom', 'left-center top']);198 }199 if (newBoxA.getBoundingClientRect().top > newBoxB.getBoundingClientRect().bottom) {200 PubSub.publish('boxMove', ['center-right top', 'left-center bottom']);201 }202 }203 if (204 newBoxA.getBoundingClientRect().right < newBoxB.getBoundingClientRect().right &&205 newBoxA.getBoundingClientRect().right >206 newBoxB.getBoundingClientRect().left + newBoxB.getBoundingClientRect().width / 2207 ) {208 if (newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().top) {209 PubSub.publish('boxMove', ['center bottom', 'center top']);210 }211 if (newBoxA.getBoundingClientRect().top > newBoxB.getBoundingClientRect().bottom) {212 PubSub.publish('boxMove', ['center top', 'center bottom']);213 }214 }215 if (216 newBoxA.getBoundingClientRect().left < newBoxB.getBoundingClientRect().right &&217 newBoxA.getBoundingClientRect().left >218 newBoxB.getBoundingClientRect().left + newBoxB.getBoundingClientRect().width / 2219 ) {220 if (newBoxA.getBoundingClientRect().bottom < newBoxB.getBoundingClientRect().top) {221 PubSub.publish('boxMove', ['left-center bottom', 'center-right top']);222 }223 if (newBoxA.getBoundingClientRect().top > newBoxB.getBoundingClientRect().bottom) {224 PubSub.publish('boxMove', ['left-center top', 'center-right bottom']);225 }226 }227 }228 mousedown(event) {229 if (!this.props.allowDraw) {230 return;231 }232 const doc = document.documentElement;233 const body = document.body;234 const x00 =235 event.clientX +236 (doc.scrollLeft || body.scrollLeft || 0) -237 (doc.clientLeft || body.clientLeft || 0);238 const y00 =239 event.clientY +240 (doc.scrollTop || body.scrollTop || 0) -241 (doc.clientTop || body.clientTop || 0);242 this.setState(preState => ({243 point: { ...preState.point, x0: x00, y0: y00 },244 startDrawflag: true,245 }));246 //console.log('points')247 //console.log(this.state.point)248 }249 mousemove(event) {250 if (!this.props.allowDraw || !this.state.startDrawflag) {251 return;252 }253 const doc = document.documentElement;254 const body = document.body;255 const x11 =256 event.clientX +257 (doc.scrollLeft || body.scrollLeft || 0) -258 (doc.clientLeft || body.clientLeft || 0);259 const y11 =260 event.clientY +261 (doc.scrollTop || body.scrollTop || 0) -262 (doc.clientTop || body.clientTop || 0);263 this.setState(preState => ({264 point: { ...preState.point, x1: x11, y1: y11 },265 }));266 }267 mouseup(event) {268 if (!this.props.allowDraw) {269 return;270 }271 this.setState({ startDrawflag: false });272 const newBoxA = ReactDOM.findDOMNode(this.a);273 const newBoxB = ReactDOM.findDOMNode(this.b);274 const doc = document.documentElement;275 const body = document.body;276 const offsetX =277 (doc.scrollLeft || body.scrollLeft || 0) - (doc.clientLeft || body.clientLeft || 0);278 const offsetY = (doc.scrollTop || body.scrollTop || 0) - (doc.clientTop || body.clientTop || 0);279 if (280 this.state.point.x0 > newBoxA.getBoundingClientRect().left + offsetX &&281 this.state.point.x0 < newBoxA.getBoundingClientRect().right + offsetX &&282 this.state.point.y0 > newBoxA.getBoundingClientRect().top + offsetY &&283 this.state.point.y0 < newBoxA.getBoundingClientRect().bottom + offsetY284 ) {285 if (286 this.state.point.x1 > newBoxB.getBoundingClientRect().left + offsetX &&287 this.state.point.x1 < newBoxB.getBoundingClientRect().right + offsetX &&288 this.state.point.y1 > newBoxB.getBoundingClientRect().top + offsetY &&289 this.state.point.y1 < newBoxB.getBoundingClientRect().bottom + offsetY290 ) {291 console.log('around to too');292 this.setState({293 AtoBinproperArea: true,294 });295 this.props.drawComplete();296 }297 }298 if (299 this.state.point.x1 > newBoxA.getBoundingClientRect().left + offsetX &&300 this.state.point.x1 < newBoxA.getBoundingClientRect().right + offsetX &&301 this.state.point.y1 > newBoxA.getBoundingClientRect().top + offsetY &&302 this.state.point.y1 < newBoxA.getBoundingClientRect().bottom + offsetY303 ) {304 if (305 this.state.point.x0 > newBoxB.getBoundingClientRect().left + offsetX &&306 this.state.point.x0 < newBoxB.getBoundingClientRect().right + offsetX &&307 this.state.point.y0 > newBoxB.getBoundingClientRect().top + offsetY &&308 this.state.point.y0 < newBoxB.getBoundingClientRect().bottom + offsetY309 ) {310 console.log('too to around');311 this.setState({312 BtoAinproperArea: true,313 });314 this.props.drawComplete();315 }316 }317 }318 static getDerivedStateFromProps(props, state) {319 if (props.removeLine) {320 return {321 AtoBinproperArea: false,322 BtoAinproperArea: false,...

Full Screen

Full Screen

script.js

Source:script.js Github

copy

Full Screen

...54 } else {55 let arrayOfX = [];56 let arrayOfY = [];57 arrayOfX.push({58 'x1': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().bottom)),59 'x2': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().top)),60 'x3': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().top)),61 'x4': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().bottom)),62 })63 arrayOfY.push({64 'y2': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().left)),65 'y1': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().left)),66 'y3': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().right)),67 'y4': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().right)),68 })69 arrayOfX.push({70 'x1': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().bottom)),71 'x2': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().top)),72 'x3': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().top)),73 'x4': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().bottom)),74 })75 arrayOfY.push({76 'y1': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().left)),77 'y2': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().left)),78 'y3': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().right)),79 'y4': Math.abs(parseInt(i.getBoundingClientRect().left) - parseInt(j.getBoundingClientRect().right)),80 })81 arrayOfX.push({82 'x1': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().bottom)),83 'x2': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().top)),84 'x3': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().top)),85 'x4': Math.abs(parseInt(i.getBoundingClientRect().top) - parseInt(j.getBoundingClientRect().bottom)),86 })87 arrayOfY.push({88 'y1': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().left)),89 'y2': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().left)),90 'y3': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().right)),91 'y4': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().right)),92 })93 arrayOfX.push({94 'x1': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().bottom)),95 'x2': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().top)),96 'x3': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().top)),97 'x4': Math.abs(parseInt(i.getBoundingClientRect().bottom) - parseInt(j.getBoundingClientRect().bottom)),98 })99 arrayOfY.push({100 'y1': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().left)),101 'y2': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().left)),102 'y3': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().right)),103 'y4': Math.abs(parseInt(i.getBoundingClientRect().right) - parseInt(j.getBoundingClientRect().right)),104 })105 let minX = arrayOfX[0].x1;106 for (let k of arrayOfX) {107 let arr = Object.values(k);108 let localMin = Math.min(...arr);109 if (localMin < minX) {110 minX = localMin;111 }112 }113 let minY = arrayOfY[0].y1;114 for (let k of arrayOfY) {115 let arr = Object.values(k);116 let localMin = Math.min(...arr);117 if (localMin < minY) {...

Full Screen

Full Screen

offset.js

Source:offset.js Github

copy

Full Screen

...16 offset: offset,17 },18 },19 onCreate: data => {20 const refLeft = reference.getBoundingClientRect().left;21 const refWidth = reference.offsetWidth;22 const popperLeft = popper.getBoundingClientRect().left;23 const popperWidth = popper.offsetWidth;24 const expectedPopperLeft =25 refLeft + refWidth / 2 - popperWidth / 2 + offset;26 expect(popperLeft).toBeApprox(expectedPopperLeft);27 data.instance.destroy();28 done();29 },30 });31 });32 it('creates a popper with double implicit px offset', done => {33 const reference = appendNewRef(1);34 reference.style.marginLeft = '100px';35 const popper = appendNewPopper(2);36 const offset = '10,10';37 const arrowHeight = 5;38 new Popper(reference, popper, {39 placement: 'bottom',40 modifiers: {41 offset: {42 offset: offset,43 },44 },45 onCreate: data => {46 const refLeft = reference.getBoundingClientRect().left;47 const refBottom = reference.getBoundingClientRect().bottom;48 const refWidth = reference.offsetWidth;49 const popperLeft = popper.getBoundingClientRect().left;50 const popperTop = popper.getBoundingClientRect().top;51 const popperWidth = popper.offsetWidth;52 const expectedPopperLeft =53 refLeft + refWidth / 2 - popperWidth / 2 + +offset.split(',')[0];54 expect(popperLeft).toBeApprox(expectedPopperLeft);55 expect(popperTop - arrowHeight).toBeApprox(56 refBottom + +offset.split(',')[1]57 );58 data.instance.destroy();59 done();60 },61 });62 });63 it('creates a popper with single explicit % offset', done => {64 const reference = appendNewRef(1);65 reference.style.marginLeft = '100px';66 const popper = appendNewPopper(2);67 const offset = '25%';68 new Popper(reference, popper, {69 placement: 'bottom',70 modifiers: {71 offset: {72 offset: offset,73 },74 },75 onCreate: data => {76 const refLeft = reference.getBoundingClientRect().left;77 const refWidth = reference.offsetWidth;78 const popperLeft = popper.getBoundingClientRect().left;79 const popperWidth = popper.offsetWidth;80 const expectedPopperLeft =81 refLeft + refWidth / 2 - popperWidth / 2 + refWidth / 4;82 expect(popperLeft).toBeApprox(expectedPopperLeft);83 data.instance.destroy();84 done();85 },86 });87 });88 it('creates a popper with single explicit negative % offset', done => {89 const reference = appendNewRef(1);90 reference.style.marginLeft = '100px';91 const popper = appendNewPopper(2);92 const offset = '-25%';93 new Popper(reference, popper, {94 placement: 'bottom',95 modifiers: {96 offset: {97 offset: offset,98 },99 },100 onCreate: data => {101 const refLeft = reference.getBoundingClientRect().left;102 const refWidth = reference.offsetWidth;103 const popperLeft = popper.getBoundingClientRect().left;104 const popperWidth = popper.offsetWidth;105 const expectedPopperLeft =106 refLeft + refWidth / 2 - popperWidth / 2 - refWidth / 4;107 expect(popperLeft).toBeApprox(expectedPopperLeft);108 data.instance.destroy();109 done();110 },111 });112 });113 it('creates a popper with double explicit % offset', done => {114 const reference = appendNewRef(1);115 reference.style.marginLeft = '100px';116 const popper = appendNewPopper(2);117 const offset = '25%, 25%';118 const arrowHeight = 5;119 new Popper(reference, popper, {120 placement: 'bottom',121 modifiers: {122 offset: {123 offset: offset,124 },125 },126 onCreate: data => {127 const refLeft = reference.getBoundingClientRect().left;128 const refBottom = reference.getBoundingClientRect().bottom;129 const refWidth = reference.offsetWidth;130 const refHeight = reference.offsetHeight;131 const popperLeft = popper.getBoundingClientRect().left;132 const popperTop = popper.getBoundingClientRect().top;133 const popperWidth = popper.offsetWidth;134 const expectedPopperLeft =135 refLeft + refWidth / 2 - popperWidth / 2 + refWidth / 4;136 expect(popperLeft).toBeApprox(expectedPopperLeft);137 expect(popperTop - arrowHeight).toBeApprox(refBottom + refHeight / 4);138 data.instance.destroy();139 done();140 },141 });142 });143 it('creates a popper with double explicit negative % offset', done => {144 const reference = appendNewRef(1);145 reference.style.marginLeft = '100px';146 reference.style.marginTop = '100px';147 const popper = appendNewPopper(2);148 const offset = '-25%, -25%';149 const arrowHeight = 5;150 new Popper(reference, popper, {151 placement: 'bottom',152 modifiers: {153 offset: {154 offset: offset,155 },156 flip: { enabled: false },157 },158 onCreate: data => {159 const refLeft = reference.getBoundingClientRect().left;160 const refBottom = reference.getBoundingClientRect().bottom;161 const refWidth = reference.offsetWidth;162 const refHeight = reference.offsetHeight;163 const popperLeft = popper.getBoundingClientRect().left;164 const popperTop = popper.getBoundingClientRect().top;165 const popperWidth = popper.offsetWidth;166 const expectedPopperLeft =167 refLeft + refWidth / 2 - popperWidth / 2 - refWidth / 4;168 expect(popperLeft).toBeApprox(expectedPopperLeft);169 expect(popperTop - arrowHeight).toBeApprox(refBottom - refHeight / 4);170 data.instance.destroy();171 done();172 },173 });174 });175 it('creates a popper with math operation as offset value', done => {176 const reference = appendNewRef(1);177 reference.style.marginLeft = '100px';178 reference.style.marginTop = '100px';179 const popper = appendNewPopper(2);180 const offset = '5 - 25%';181 const arrowHeight = 5;182 new Popper(reference, popper, {183 placement: 'bottom',184 modifiers: {185 offset: {186 offset: offset,187 },188 flip: { enabled: false },189 },190 onCreate: data => {191 const refLeft = reference.getBoundingClientRect().left;192 const refBottom = reference.getBoundingClientRect().bottom;193 const refWidth = reference.offsetWidth;194 const popperLeft = popper.getBoundingClientRect().left;195 const popperTop = popper.getBoundingClientRect().top;196 const popperWidth = popper.offsetWidth;197 const expectedPopperLeft =198 refLeft + refWidth / 2 - popperWidth / 2 - refWidth / 4 + 5;199 expect(popperLeft).toBeApprox(expectedPopperLeft);200 expect(popperTop - arrowHeight).toBeApprox(refBottom);201 data.instance.destroy();202 done();203 },204 });205 });206 it('creates a popper with a couple of math operations as offset values', done => {207 const reference = appendNewRef(1);208 reference.style.marginLeft = '100px';209 reference.style.marginTop = '100px';210 const popper = appendNewPopper(2);211 const offset = '5 - 25%, 10px + 25%';212 const arrowHeight = 5;213 new Popper(reference, popper, {214 placement: 'bottom',215 modifiers: {216 offset: {217 offset: offset,218 },219 flip: { enabled: false },220 },221 onCreate: data => {222 const refLeft = reference.getBoundingClientRect().left;223 const refHeight = reference.getBoundingClientRect().height;224 const refBottom = reference.getBoundingClientRect().bottom;225 const refWidth = reference.offsetWidth;226 const popperLeft = popper.getBoundingClientRect().left;227 const popperTop = popper.getBoundingClientRect().top;228 const popperWidth = popper.offsetWidth;229 const expectedPopperLeft =230 refLeft + refWidth / 2 - popperWidth / 2 - refWidth / 4 + 5;231 expect(popperLeft).toBeApprox(expectedPopperLeft);232 expect(popperTop - arrowHeight).toBeApprox(233 refBottom + refHeight / 4 + 10234 );235 data.instance.destroy();236 done();237 },238 });239 });...

Full Screen

Full Screen

jogo.js

Source:jogo.js Github

copy

Full Screen

...14 //placa mae = sem numero15 // mouse = 216 // teclado = 317 //disco rigido = 418 if((ball.getBoundingClientRect().left > gate.getBoundingClientRect().left && ball.getBoundingClientRect().left < gate2.getBoundingClientRect().left) && (ball.getBoundingClientRect().top > gate.getBoundingClientRect().top) && (ball.getBoundingClientRect().top < (gate.getBoundingClientRect().top + gate.offsetHeight))19 && (ball4.getBoundingClientRect().left > gate.getBoundingClientRect().left && ball4.getBoundingClientRect().left < gate2.getBoundingClientRect().left) && (ball4.getBoundingClientRect().top > gate.getBoundingClientRect().top) && (ball4.getBoundingClientRect().top < (gate.getBoundingClientRect().top + gate.offsetHeight))20 && ((ball2.getBoundingClientRect().left && ball2.getBoundingClientRect().left < (gate.getBoundingClientRect().left + gate.offsetWidth)) && (ball2.getBoundingClientRect().top > gate.getBoundingClientRect().top) && (ball2.getBoundingClientRect().top < (gate.getBoundingClientRect().top + gate.offsetHeight)))21 && ((ball3.getBoundingClientRect().left > (gate.getBoundingClientRect().left + gate.offsetWidth) && ball3.getBoundingClientRect().left < (gate2.getBoundingClientRect().left + gate2.offsetWidth)) && (ball3.getBoundingClientRect().top > gate2.getBoundingClientRect().top) && (ball3.getBoundingClientRect().top < (gate2.getBoundingClientRect().top +gate2.offsetHeight)))){22 $(".jogo").css("display","none");23 $(".gate").css("display","none");24 $(".ball").css("display","none");25 $("#play").css("display","none");26 $("#ganhou").css("display","block");27 $("#perdeu").css("display","none");28 $(".avisos").css("display","block");29 $(".listas").css("display","none");30 $(".game").css("margin-top","5vh");31 }else{32 $(".jogo").css("display","none");33 $(".gate").css("display","none");34 $(".ball").css("display","none");35 $("#play").css("display","none");36 $("#perdeu").css("display","block"); 37 $("#ganhou").css("display","none");38 //$("#perdeu").css("margin-left","38%");39 $(".avisos").css("display","block");40 $(".listas").css("display","none");41 $(".game").css("margin-top","5vh");42 43 }44 45 /*console.log("Placa mãe no A: " + ((ball.getBoundingClientRect().left > gate.getBoundingClientRect().left && ball.getBoundingClientRect().left < gate2.getBoundingClientRect().left) && (ball.getBoundingClientRect().top > gate.getBoundingClientRect().top) && (ball.getBoundingClientRect().top < (gate.getBoundingClientRect().top + gate.offsetHeight))));46 console.log("Placa mãe no B: " + ((ball.getBoundingClientRect().left > (gate.getBoundingClientRect().left + gate.offsetWidth) && ball.getBoundingClientRect().left < (gate2.getBoundingClientRect().left + gate2.offsetWidth)) && (ball.getBoundingClientRect().top > gate2.getBoundingClientRect().top) && (ball.getBoundingClientRect().top < (gate2.getBoundingClientRect().top + gate2.offsetHeight))));47 console.log("Placa mãe na junção: " + ((ball.getBoundingClientRect().left > gate2.getBoundingClientRect().left && ball.getBoundingClientRect().left < (gate.getBoundingClientRect().left + gate.offsetWidth)) && (ball.getBoundingClientRect().top > gate.getBoundingClientRect().top) && (ball.getBoundingClientRect().top < (gate.getBoundingClientRect().top + gate.offsetHeight))));48*/49}50function jogar(){51 $(".gate").css("display","block");52 $(".ball").css("display","block");53 $(".jogo").css("display","block");54 $(".avisos").css("display","none");55 $("#ganhou").css("display","none");56 $("#perdeu").css("display","none");57 $(".listas").css("display","block");58 $(".game").css("margin-top","-20vh");59}60document.querySelectorAll(".ball").forEach(function (ball) {61 ball.ondragstart = function () {62 return false;63 };64 ball.onmousedown = function (event) {65 let shiftX = event.clientX - ball.getBoundingClientRect().left;66 let shiftY = event.clientY - ball.getBoundingClientRect().top;67 ball.style.position = 'absolute';68 ball.style.zIndex = 1000;69 document.body.append(ball);70 moveAt(event.pageX, event.pageY);71 function moveAt(pageX, pageY) {72 ball.style.left = pageX - shiftX + 'px';73 ball.style.top = pageY - shiftY + 'px';74 }75 function onMouseMove(event) {76 moveAt(event.pageX, event.pageY);77 ball.hidden = true;78 let elemBelow = document.elementFromPoint(event.clientX, event.clientY);79 ball.hidden = false;80 if (!elemBelow) return;81 }82 document.addEventListener('mousemove', onMouseMove);83 ball.onmouseup = function () {84 document.removeEventListener('mousemove', onMouseMove);85 ball.onmouseup = null;86 };87 };88 ball.onmousedown = function (event) {89 let shiftX = event.clientX - ball.getBoundingClientRect().left;90 let shiftY = event.clientY - ball.getBoundingClientRect().top;91 ball.style.position = 'absolute';92 ball.style.zIndex = 1000;93 document.body.append(ball);94 moveAt(event.pageX, event.pageY);95 function moveAt(pageX, pageY) {96 ball.style.left = pageX - shiftX + 'px';97 ball.style.top = pageY - shiftY + 'px';98 }99 function onMouseMove(event) {100 moveAt(event.pageX, event.pageY);101 ball.hidden = true;102 let elemBelow = document.elementFromPoint(event.clientX, event.clientY);103 ball.hidden = false;104 if (!elemBelow) return;...

Full Screen

Full Screen

proces.js

Source:proces.js Github

copy

Full Screen

...4 const element = document.querySelectorAll('.tocka');5 6 console.log(element.length)7 8 var x1 = element[0].getBoundingClientRect().left + element[0].getBoundingClientRect().width/2;9 var y1 = element[0].getBoundingClientRect().top + element[0].getBoundingClientRect().height/2;10 var x2 = element[1].getBoundingClientRect().left + element[1].getBoundingClientRect().width/2;11 var y2 = element[1].getBoundingClientRect().top + element[1].getBoundingClientRect().height/2;12 13 const svg = document.querySelector('svg');14 15 let line = document.createElementNS("http://www.w3.org/2000/svg", "line");16 17 line.setAttribute("x1", x1);18 line.setAttribute("y1", y1);19 line.setAttribute("x2", x2);20 line.setAttribute("y2", y2);21 line.setAttribute("stroke", "#fff")22 line.setAttribute("stroke-width", "10px");23 24 svg.appendChild(line);25 26 }27 pozicija();28 29 const pozicijaa = () => {30 const element = document.querySelectorAll('.tocka');31 32 var x1 = element[1].getBoundingClientRect().left + element[1].getBoundingClientRect().width/2;33 var y1 = element[1].getBoundingClientRect().top + element[1].getBoundingClientRect().height/2;34 var x2 = element[2].getBoundingClientRect().left + element[2].getBoundingClientRect().width/2;35 var y2 = element[2].getBoundingClientRect().top + element[2].getBoundingClientRect().height/2;36 37 const svg = document.querySelector('svg');38 39 let line = document.createElementNS("http://www.w3.org/2000/svg", "line");40 41 line.setAttribute("x1", x1);42 line.setAttribute("y1", y1);43 line.setAttribute("x2", x2);44 line.setAttribute("y2", y2);45 line.setAttribute("stroke", "#fff")46 line.setAttribute("stroke-width", "10px");47 48 svg.appendChild(line);49 50 }51 pozicijaa();52 53 const pozicijaaa = () => {54 const element = document.querySelectorAll('.tocka');55 56 var x1 = element[2].getBoundingClientRect().left + element[2].getBoundingClientRect().width/2;57 var y1 = element[2].getBoundingClientRect().top + element[2].getBoundingClientRect().height/2;58 var x2 = element[3].getBoundingClientRect().left + element[3].getBoundingClientRect().width/2;59 var y2 = element[3].getBoundingClientRect().top + element[3].getBoundingClientRect().height/2;60 61 const svg = document.querySelector('svg');62 63 let line = document.createElementNS("http://www.w3.org/2000/svg", "line");64 65 line.setAttribute("x1", x1);66 line.setAttribute("y1", y1);67 line.setAttribute("x2", x2);68 line.setAttribute("y2", y2);69 line.setAttribute("stroke", "#fff")70 line.setAttribute("stroke-width", "10px");71 72 svg.appendChild(line);73 ...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, link, closeBrowser, getBoundingClientRect } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await goto("google.com");6 let rect = await getBoundingClientRect(link('Gmail'));7 console.log(rect);8 } catch (e) {9 console.error(e);10 } finally {11 await closeBrowser();12 }13})();14{ x: 0.5, y: 0.5, width: 0.5, height: 0.5 }15The getBoundingClientRect() method returns a JSON object with the following properties:16getClientRects() method17getClientRects() method18getClientRects()19const { openBrowser, goto, link, closeBrowser, getClientRects } = require('taiko');20(async () => {21 try {22 await openBrowser();23 await goto("google.com");24 let rect = await getClientRects(link('Gmail'));25 console.log(rect);26 } catch (e) {27 console.error(e);28 } finally {29 await closeBrowser();30 }31})();32[ { x: 0.5, y: 0.5, width: 0.5, height: 0.5 } ]33The getClientRects() method returns a list of JSON objects with the following properties:

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, click, closeBrowser, getBoundingClientRect } = require('taiko');2(async () => {3 try {4 await openBrowser({ headless: false });5 await click("Google apps");6 const { x, y, width, height } = await getBoundingClientRect("Gmail");7 console.log(x, y, width, height);8 } catch (error) {9 console.error(error);10 } finally {11 await closeBrowser();12 }13})();14const puppeteer = require('puppeteer');15(async () => {16 const browser = await puppeteer.launch({ headless: false });17 const page = await browser.newPage();18 await page.click("Google apps");19 const rect = await page.evaluate(() => {20 const element = document.querySelector("Gmail");21 const { x, y, width, height } = element.getBoundingClientRect();22 return { x, y, width, height };23 });24 console.log(rect);25 await browser.close();26})();27const webdriverio = require('webdriverio');28(async () => {29 const browser = await webdriverio.remote({ desiredCapabilities: { browserName: 'chrome' } });30 await browser.click("Google apps");31 const rect = await browser.execute(() => {32 const element = document.querySelector("Gmail");33 const { x, y, width, height } = element.getBoundingClientRect();34 return { x, y, width, height };35 });36 console.log(rect);37 await browser.deleteSession();38})();39const playwright = require('playwright');40(async () => {41 const browser = await playwright.chromium.launch({ headless: false });42 const context = await browser.newContext();43 const page = await context.newPage();44 await page.click("Google apps");45 const rect = await page.evaluate(() => {46 const element = document.querySelector("Gmail");47 const { x, y, width, height } = element.getBoundingClientRect();48 return { x, y, width, height };49 });50 console.log(rect);51 await browser.close();52})();

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, link, toRightOf, getBoundingClientRect, closeBrowser } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await goto("google.com");6 await link("Gmail").exists();7 let gmailLink = await getBoundingClientRect(link("Gmail"));8 console.log(gmailLink);9 } catch (e) {10 console.error(e);11 } finally {12 await closeBrowser();13 }14})();15const { openBrowser, goto, link, toRightOf, getAttribute, closeBrowser } = require('taiko');16(async () => {17 try {18 await openBrowser();19 await goto("google.com");20 await link("Gmail").exists();21 let gmailLink = await getAttribute(link("Gmail"), "href");22 console.log(gmailLink);23 } catch (e) {24 console.error(e);25 } finally {26 await closeBrowser();27 }28})();

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, below, toRightOf, getBoundingClientRect } = require('taiko');2(async () => {3 try {4 await openBrowser();5 const rect = await getBoundingClientRect("Google");6 console.log(rect);7 } catch (e) {8 console.error(e);9 } finally {10 await closeBrowser();11 }12})();13{ x: 277.5, y: 30, width: 90, height: 30 }14const { openBrowser, goto, below, toRightOf, getBoundingClientRect } = require('taiko');15(async () => {16 try {17 await openBrowser();18 const rect = await getBoundingClientRect("Google", below("Gmail"));19 console.log(rect);20 } catch (e) {21 console.error(e);22 } finally {23 await closeBrowser();24 }25})();26{ x: 277.5, y: 60, width: 90, height: 30 }27const { openBrowser, goto, below, toRightOf, getBoundingClientRect } = require('taiko');28(async () => {29 try {30 await openBrowser();31 const rect = await getBoundingClientRect("Google", toRightOf("Gmail"));32 console.log(rect);33 } catch (e) {34 console.error(e);35 } finally {36 await closeBrowser();37 }38})();39{ x: 367.5, y: 30, width: 90, height: 30 }40const { openBrowser, goto, below, toRightOf, getBoundingClientRect } = require('taiko');41(async () => {42 try {43 await openBrowser();44 const rect = await getBoundingClientRect("Google", below("Gmail"), toRightOf("Gmail"));45 console.log(rect);46 } catch (e) {47 console.error(e);48 } finally {49 await closeBrowser();50 }51})();52{ x: 367.5, y: 60, width

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, textBox, closeBrowser, $, getBoundingClientRect } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await write("Taiko", into(textBox()));6 let boundingBox = await getBoundingClientRect($("Taiko"));7 console.log(boundingBox);8 } catch (e) {9 console.error(e);10 } finally {11 await closeBrowser();12 }13})();14{ x: 14,15 left: 14 }16getBoundingClientRect(elementHandle, options)17getBoundingClientRect($("#elementId"))

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, button, $, closeBrowser } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await goto("google.com");6 let search = await $("input[name='q']");7 let rect = await search.getBoundingClientRect();8 console.log(rect);9 } catch (e) {10 console.error(e);11 } finally {12 await closeBrowser();13 }14})();15{ x: 0, y: 0, width: 0, height: 0, top: 0, right: 0, bottom: 0, left: 0 }16Version: 1.0.9 (Chromium: 81.0.4044.138)17Protractor || WebDriverIO || Nightmare version (if related)18const { setHeadlessWhen } = require('@codeceptjs/configure');19const { join } = require('path');20setHeadlessWhen(process.env.HEADLESS);21exports.config = {22 tests: join(__dirname, 'tests/*_test.js'),23 output: join(__dirname, 'output'),24 helpers: {25 Taiko: {26 chrome: {27 },28 },29 },30 include: {31 I: join(__dirname, 'steps_file.js'),32 },33 mocha: {},34};

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, link, closeBrowser, getBoundingClientRect, $ } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await goto("google.com");6 let ele = await link("Gmail");7 let eleRect = await getBoundingClientRect(ele);8 console.log(eleRect);9 let ele1 = await $("a[title='Gmail']");10 let eleRect1 = await getBoundingClientRect(ele1);11 console.log(eleRect1);12 } catch (e) {13 console.error(e);14 } finally {15 await closeBrowser();16 }17})();

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { openBrowser, goto, below, button, closeBrowser, getBoundingClientRect, write } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await write("Taiko", into("Google Search"));6 await click("Google Search");7 await click("Taiko - A Node.js library for automating end-to-end testing of web applications");8 let rect = await getBoundingClientRect(below('Taiko supports modern web applications'));9 console.log(rect);10 await closeBrowser();11 } catch (error) {12 console.error(error);13 }14})();15{ x: 0.5, y: 0.5, width: 0.5, height: 0.5 }16const { openBrowser, goto, below, button, closeBrowser, getBounds, write } = require('taiko');17(async () => {18 try {19 await openBrowser();20 await write("Taiko", into("Google Search"));21 await click("Google Search");22 await click("Taiko - A Node.js library for automating end-to-end testing of web applications");23 let rect = await getBounds(below('Taiko supports modern web applications'));24 console.log(rect);25 await closeBrowser();26 } catch (error) {27 console.error(error);28 }29})();30{ x: 0.5, y: 0.5, width: 0.5, height: 0.5 }31const { openBrowser, goto, below, button, closeBrowser, getCSSProperty, write } = require('taiko');32(async () => {33 try {34 await openBrowser();35 await write("Taiko", into("Google Search"));36 await click("Google Search");37 await click("Taiko - A Node.js library for automating end-to-end testing of web applications");

Full Screen

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run taiko 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