Best JavaScript code snippet using ng-mocks
test-fixed-layer.js
Source:test-fixed-layer.js
1/**2 * Copyright 2016 The AMP HTML Authors. 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 */16import {FixedLayer} from '../../src/service/fixed-layer';17import * as sinon from 'sinon';18describe('FixedLayer', () => {19 let sandbox;20 let documentApi;21 let vsyncApi;22 let vsyncTasks;23 let docBody, docElem;24 let element1;25 let element2;26 let element3;27 let allRules;28 beforeEach(() => {29 sandbox = sinon.sandbox.create();30 allRules = {};31 docBody = createElement('docBody');32 docElem = createElement('docElem');33 element1 = createElement('element1');34 element2 = createElement('element2');35 element3 = createElement('element3');36 docBody.appendChild(element1);37 docBody.appendChild(element2);38 docBody.appendChild(element3);39 const invalidRule = createValidRule('#invalid', [element1, element3]);40 documentApi = {41 styleSheets: [42 // Will be ignored due to being a link.43 {44 ownerNode: document.createElement('link'),45 cssRules: [invalidRule],46 },47 // Will be ignored because it's disabled48 {49 ownerNode: createStyleNode(),50 disabled: true,51 cssRules: [invalidRule],52 },53 // Will be ignored because it's a boilerplate54 {55 ownerNode: createStyleNode('amp-boilerplate'),56 cssRules: [invalidRule],57 },58 // Will be ignored because it's a runtime59 {60 ownerNode: createStyleNode('amp-runtime'),61 cssRules: [invalidRule],62 },63 // Will be ignored because it's an extension64 {65 ownerNode: createStyleNode('amp-extension', 'amp-fit-text'),66 cssRules: [invalidRule],67 },68 // Valid stylesheet with amp-custom69 {70 ownerNode: createStyleNode('amp-custom'),71 cssRules: [72 createValidRule('#amp-custom-rule1', [element1]),73 createValidRule('#amp-custom-rule2', [element1, element2]),74 createUnrelatedRule('#amp-custom-rule3', [element3]),75 {76 type: 4,77 cssRules: [78 createValidRule('#amp-custom-media-rule1', [element1]),79 ],80 },81 {82 type: 12,83 cssRules: [84 createValidRule('#amp-custom-supports-rule1', [element2]),85 ],86 },87 // Uknown rule.88 {89 type: 3,90 },91 ],92 },93 // Valid stylesheet without amp-custom94 {95 ownerNode: createStyleNode(),96 cssRules: [97 createValidRule('#other-rule1', [element1]),98 createValidRule('#other-rule2', [element2]),99 createUnrelatedRule('#other-rule3', [element1, element3]),100 ],101 },102 ],103 querySelectorAll: selector => {104 if (!allRules[selector]) {105 return null;106 }107 return allRules[selector].elements;108 },109 contains: elem => {110 return (!!elem.parentElement);111 },112 defaultView: {113 getComputedStyle: elem => {114 return {115 getPropertyValue: prop => {116 return elem.computedStyle[prop] || '';117 },118 };119 },120 navigator: window.navigator,121 },122 createElement: name => {123 return createElement(name);124 },125 documentElement: docElem,126 body: docBody,127 };128 vsyncTasks = [];129 vsyncApi = {130 runPromise: task => {131 vsyncTasks.push(task);132 return Promise.resolve();133 },134 mutate: mutator => {135 vsyncTasks.push({mutate: mutator});136 },137 };138 });139 afterEach(() => {140 sandbox.restore();141 });142 function createElement(id) {143 const attrs = {};144 const children = [];145 const elem = {146 id,147 autoOffsetTop: 17,148 toString: () => {149 return id;150 },151 style: {152 top: '',153 bottom: '',154 position: '',155 opacity: '0.9',156 visibility: 'visible',157 },158 computedStyle: {159 opacity: '0.9',160 visibility: 'visible',161 },162 matches: () => true,163 compareDocumentPosition: other => {164 if (id < other.id) {165 return 0x0A;166 }167 return 0;168 },169 getAttribute: name => {170 return attrs[name];171 },172 setAttribute: (name, value) => {173 attrs[name] = value;174 },175 appendChild: child => {176 child.parentElement = elem;177 children.push(child);178 },179 removeChild: child => {180 const index = children.indexOf(child);181 if (index != -1) {182 children.splice(index, 1);183 }184 child.parentElement = null;185 },186 replaceChild: (newChild, oldChild) => {187 oldChild.parentElement = null;188 if (children.indexOf(oldChild) != -1) {189 children.splice(children.indexOf(oldChild), 1);190 }191 newChild.parentElement = elem;192 children.push(newChild);193 },194 };195 Object.defineProperty(elem, 'offsetTop', {196 get: () => {197 if (elem.style.top == 'auto' || elem.computedStyle.top == 'auto' ||198 elem.computedStyle.top == '') {199 return elem.autoOffsetTop;200 }201 return parseFloat(elem.computedStyle.top);202 },203 });204 return elem;205 }206 function createStyleNode(attr, value) {207 const node = document.createElement('style');208 if (attr) {209 node.setAttribute(attr, value || '');210 }211 return node;212 }213 function createValidRule(selector, elements) {214 const rule = {215 type: 1,216 selectorText: selector,217 style: {position: 'fixed'},218 elements,219 };220 if (allRules[selector]) {221 throw new Error('dup selector');222 }223 allRules[selector] = rule;224 return rule;225 }226 function createUnrelatedRule(selector, elements) {227 const rule = {228 type: 1,229 selectorText: selector,230 style: {},231 elements,232 };233 if (allRules[selector]) {234 throw new Error('dup selector');235 }236 allRules[selector] = rule;237 return rule;238 }239 describe('no-transfer', () => {240 let fixedLayer;241 beforeEach(() => {242 fixedLayer = new FixedLayer(documentApi, vsyncApi,243 /* paddingTop */ 11, /* transfer */ false);244 fixedLayer.setup();245 });246 it('should initiale fixed layer to null', () => {247 expect(fixedLayer.fixedLayer_).to.be.null;248 });249 it('should discover all potentials', () => {250 function expectFe(actual, expected) {251 expect(actual.id).to.equal(expected.id, `${expected.id} wrong`);252 expect(actual.element).to.equal(expected.element,253 `${expected.id}: wrong element`);254 expect(JSON.stringify(actual.selectors))255 .to.equal(JSON.stringify(expected.selectors),256 `${expected.id}: wrong selectors`);257 }258 expect(fixedLayer.fixedElements_).to.have.length(2);259 expectFe(fixedLayer.fixedElements_[0], {260 id: 'F0',261 element: element1,262 selectors: [263 '#amp-custom-rule1',264 '#amp-custom-rule2',265 '#amp-custom-media-rule1',266 '#other-rule1',267 ],268 });269 expectFe(fixedLayer.fixedElements_[1], {270 id: 'F1',271 element: element2,272 selectors: [273 '#amp-custom-rule2',274 '#amp-custom-supports-rule1',275 '#other-rule2',276 ],277 });278 expect(fixedLayer.isDeclaredFixed(element1)).to.be.true;279 expect(fixedLayer.isDeclaredFixed(element2)).to.be.true;280 expect(fixedLayer.isDeclaredFixed(element3)).to.be.false;281 });282 it('should add and remove element directly', () => {283 const updateStub = sandbox.stub(fixedLayer, 'update');284 expect(fixedLayer.fixedElements_).to.have.length(2);285 // Add.286 fixedLayer.addElement(element3, '*');287 expect(updateStub.callCount).to.equal(1);288 expect(fixedLayer.fixedElements_).to.have.length(3);289 const fe = fixedLayer.fixedElements_[2];290 expect(fe.id).to.equal('F2');291 expect(fe.element).to.equal(element3);292 expect(fe.selectors).to.deep.equal(['*']);293 // Remove.294 fixedLayer.removeElement(element3);295 expect(fixedLayer.fixedElements_).to.have.length(2);296 });297 it('should remove node when disappeared from DOM', () => {298 docBody.removeChild(element1);299 expect(fixedLayer.fixedElements_).to.have.length(2);300 fixedLayer.update();301 expect(fixedLayer.fixedElements_).to.have.length(1);302 });303 it('should collect updates', () => {304 element1.computedStyle['position'] = 'fixed';305 element1.offsetWidth = 10;306 element1.offsetHeight = 10;307 expect(vsyncTasks).to.have.length(1);308 const state = {};309 vsyncTasks[0].measure(state);310 expect(state['F0'].fixed).to.equal(true);311 expect(state['F0'].top).to.equal('');312 expect(state['F0'].zIndex).to.equal('');313 expect(state['F1'].fixed).to.equal(false);314 });315 it('should disregard non-fixed position', () => {316 element1.computedStyle['position'] = 'static';317 element1.offsetWidth = 10;318 element1.offsetHeight = 10;319 expect(vsyncTasks).to.have.length(1);320 const state = {};321 vsyncTasks[0].measure(state);322 expect(state['F0'].fixed).to.equal(false);323 expect(state['F1'].fixed).to.equal(false);324 });325 it('should disregard invisible element', () => {326 element1.computedStyle['position'] = 'fixed';327 element1.offsetWidth = 0;328 element1.offsetHeight = 0;329 expect(vsyncTasks).to.have.length(1);330 const state = {};331 vsyncTasks[0].measure(state);332 expect(state['F0'].fixed).to.equal(false);333 expect(state['F1'].fixed).to.equal(false);334 });335 it('should tolerate getComputedStyle = null', () => {336 // See #3096 and https://bugzilla.mozilla.org/show_bug.cgi?id=548397337 documentApi.defaultView.getComputedStyle = () => null;338 element1.computedStyle['position'] = 'fixed';339 element1.offsetWidth = 10;340 element1.offsetHeight = 10;341 expect(vsyncTasks).to.have.length(1);342 const state = {};343 vsyncTasks[0].measure(state);344 expect(state['F0'].fixed).to.equal(false);345 expect(state['F0'].transferrable).to.equal(false);346 expect(state['F0'].top).to.equal('');347 expect(state['F0'].zIndex).to.equal('');348 expect(state['F1'].fixed).to.equal(false);349 });350 it('should collect for top != auto', () => {351 element1.computedStyle['position'] = 'fixed';352 element1.computedStyle['top'] = '11px';353 element1.offsetWidth = 10;354 element1.offsetHeight = 10;355 expect(vsyncTasks).to.have.length(1);356 const state = {};357 vsyncTasks[0].measure(state);358 expect(state['F0'].fixed).to.equal(true);359 expect(state['F0'].top).to.equal('11px');360 });361 it('should collect for top = auto, but not update top', () => {362 element1.computedStyle['position'] = 'fixed';363 element1.computedStyle['top'] = 'auto';364 element1.offsetWidth = 10;365 element1.offsetHeight = 10;366 expect(vsyncTasks).to.have.length(1);367 const state = {};368 vsyncTasks[0].measure(state);369 expect(state['F0'].fixed).to.equal(true);370 expect(state['F0'].top).to.equal('');371 });372 it('should collect for implicit top = auto, but not update top', () => {373 element1.computedStyle['position'] = 'fixed';374 element1.computedStyle['top'] = '11px';375 element1.autoOffsetTop = 11;376 element1.offsetWidth = 10;377 element1.offsetHeight = 10;378 expect(vsyncTasks).to.have.length(1);379 const state = {};380 vsyncTasks[0].measure(state);381 expect(state['F0'].fixed).to.equal(true);382 expect(state['F0'].top).to.equal('');383 });384 it('should always collect and update top = 0', () => {385 element1.computedStyle['position'] = 'fixed';386 element1.computedStyle['top'] = '0px';387 element1.autoOffsetTop = 0;388 element1.offsetWidth = 10;389 element1.offsetHeight = 10;390 expect(vsyncTasks).to.have.length(1);391 const state = {};392 vsyncTasks[0].measure(state);393 expect(state['F0'].fixed).to.equal(true);394 expect(state['F0'].top).to.equal('0px');395 });396 it('should mutate element to fixed without top', () => {397 const fe = fixedLayer.fixedElements_[0];398 fixedLayer.mutateFixedElement_(fe, 1, {399 fixed: true,400 top: '',401 });402 expect(fe.fixedNow).to.be.true;403 expect(fe.element.style.top).to.equal('');404 expect(fixedLayer.fixedLayer_).to.be.null;405 });406 it('should mutate element to fixed with top', () => {407 const fe = fixedLayer.fixedElements_[0];408 fixedLayer.mutateFixedElement_(fe, 1, {409 fixed: true,410 top: '17px',411 });412 expect(fe.fixedNow).to.be.true;413 expect(fe.element.style.top).to.equal('calc(17px + 11px)');414 });415 it('should reset top upon being removed from fixedlayer', () => {416 expect(fixedLayer.fixedElements_).to.have.length(2);417 // Add.418 fixedLayer.addElement(element3, '*');419 expect(fixedLayer.fixedElements_).to.have.length(3);420 const fe = fixedLayer.fixedElements_[2];421 expect(fe.id).to.equal('F2');422 expect(fe.element).to.equal(element3);423 expect(fe.selectors).to.deep.equal(['*']);424 fixedLayer.mutateFixedElement_(fe, 1, {425 fixed: true,426 top: '17px',427 });428 expect(fe.fixedNow).to.be.true;429 expect(fe.element.style.top).to.equal('calc(17px + 11px)');430 // Remove.431 fixedLayer.vsync_ = {432 mutate: function(callback) {433 callback();434 },435 };436 fixedLayer.removeElement(element3);437 expect(fixedLayer.fixedElements_).to.have.length(2);438 expect(element3.style.top).to.equal('');439 });440 it('should mutate element to non-fixed', () => {441 const fe = fixedLayer.fixedElements_[0];442 fe.fixedNow = true;443 fe.element.style.top = '27px';444 fixedLayer.mutateFixedElement_(fe, 1, {445 fixed: false,446 top: '17px',447 });448 expect(fe.fixedNow).to.be.false;449 expect(fe.element.style.top).to.equal('');450 });451 });452 describe('with-transfer', () => {453 let fixedLayer;454 beforeEach(() => {455 fixedLayer = new FixedLayer(documentApi, vsyncApi,456 /* paddingTop */ 11, /* transfer */ true);457 fixedLayer.setup();458 });459 it('should initiale fixed layer to null', () => {460 expect(fixedLayer.transfer_).to.be.true;461 expect(fixedLayer.fixedLayer_).to.be.null;462 });463 it('should collect turn off transferrable', () => {464 element1.computedStyle['position'] = 'fixed';465 element1.offsetWidth = 10;466 element1.offsetHeight = 10;467 expect(vsyncTasks).to.have.length(1);468 const state = {};469 vsyncTasks[0].measure(state);470 expect(state['F0'].fixed).to.be.true;471 expect(state['F0'].transferrable).to.equal(false);472 expect(state['F1'].fixed).to.equal(false);473 });474 it('should collect turn on transferrable with top = 0', () => {475 element1.computedStyle['position'] = 'fixed';476 element1.offsetWidth = 10;477 element1.offsetHeight = 10;478 element1.computedStyle['top'] = '0px';479 expect(vsyncTasks).to.have.length(1);480 const state = {};481 vsyncTasks[0].measure(state);482 expect(state['F0'].fixed).to.be.true;483 expect(state['F0'].transferrable).to.equal(true);484 expect(state['F0'].top).to.equal('0px');485 });486 it('should collect turn off transferrable with top != 0', () => {487 element1.computedStyle['position'] = 'fixed';488 element1.offsetWidth = 10;489 element1.offsetHeight = 10;490 element1.computedStyle['top'] = '2px';491 expect(vsyncTasks).to.have.length(1);492 const state = {};493 vsyncTasks[0].measure(state);494 expect(state['F0'].fixed).to.be.true;495 expect(state['F0'].transferrable).to.equal(false);496 expect(state['F0'].top).to.equal('2px');497 });498 it('should collect turn on transferrable with bottom = 0', () => {499 element1.computedStyle['position'] = 'fixed';500 element1.offsetWidth = 10;501 element1.offsetHeight = 10;502 element1.computedStyle['bottom'] = '0px';503 expect(vsyncTasks).to.have.length(1);504 const state = {};505 vsyncTasks[0].measure(state);506 expect(state['F0'].fixed).to.be.true;507 expect(state['F0'].transferrable).to.equal(true);508 });509 it('should collect turn off transferrable with bottom != 0', () => {510 element1.computedStyle['position'] = 'fixed';511 element1.offsetWidth = 10;512 element1.offsetHeight = 10;513 element1.computedStyle['bottom'] = '2px';514 expect(vsyncTasks).to.have.length(1);515 const state = {};516 vsyncTasks[0].measure(state);517 expect(state['F0'].fixed).to.be.true;518 expect(state['F0'].transferrable).to.equal(false);519 });520 it('should collect z-index', () => {521 element1.computedStyle['position'] = 'fixed';522 element1.offsetWidth = 10;523 element1.offsetHeight = 10;524 element1.computedStyle['z-index'] = '101';525 expect(vsyncTasks).to.have.length(1);526 const state = {};527 vsyncTasks[0].measure(state);528 expect(state['F0'].fixed).to.be.true;529 expect(state['F0'].zIndex).to.equal('101');530 });531 it('should transfer element', () => {532 const fe = fixedLayer.fixedElements_[0];533 fixedLayer.mutateFixedElement_(fe, 1, {534 fixed: true,535 transferrable: true,536 zIndex: '11',537 });538 expect(fe.fixedNow).to.be.true;539 expect(fe.placeholder).to.exist;540 expect(fe.placeholder.style['display']).to.equal('none');541 expect(fe.element.parentElement).to.equal(fixedLayer.fixedLayer_);542 expect(fe.element.style['pointer-events']).to.equal('initial');543 expect(fe.element.style['zIndex']).to.equal('calc(10001 + 11)');544 expect(fixedLayer.fixedLayer_).to.exist;545 expect(fixedLayer.fixedLayer_.style['pointerEvents']).to.equal('none');546 });547 it('should ignore transfer when non-transferrable', () => {548 const fe = fixedLayer.fixedElements_[0];549 fixedLayer.mutateFixedElement_(fe, 1, {550 fixed: true,551 transferrable: false,552 });553 expect(fe.fixedNow).to.be.true;554 expect(fe.placeholder).to.not.exist;555 expect(fixedLayer.fixedLayer_).to.not.exist;556 expect(fe.element.parentElement).to.not.equal(fixedLayer.fixedLayer_);557 });558 it('should return transfered element if it no longer matches', () => {559 const fe = fixedLayer.fixedElements_[0];560 fe.element.matches = () => false;561 fixedLayer.mutateFixedElement_(fe, 1, {562 fixed: true,563 transferrable: true,564 zIndex: '11',565 });566 expect(fe.fixedNow).to.be.true;567 expect(fe.placeholder).to.exist;568 expect(fixedLayer.fixedLayer_).to.exist;569 expect(fe.element.parentElement).to.not.equal(fixedLayer.fixedLayer_);570 expect(fe.placeholder.parentElement).to.be.null;571 expect(fe.element.style.zIndex).to.equal('');572 });573 it('should remove transfered element if it no longer exists', () => {574 const fe = fixedLayer.fixedElements_[0];575 // Add.576 fixedLayer.mutateFixedElement_(fe, 1, {577 fixed: true,578 transferrable: true,579 zIndex: '11',580 });581 expect(fe.fixedNow).to.be.true;582 expect(fe.placeholder).to.exist;583 expect(fe.element.parentElement).to.equal(fixedLayer.fixedLayer_);584 expect(fixedLayer.fixedLayer_).to.exist;585 // Remove from DOM.586 fe.element.parentElement.removeChild(fe.element);587 fixedLayer.mutateFixedElement_(fe, 1, {588 fixed: false,589 transferrable: false,590 });591 expect(fe.fixedNow).to.be.false;592 expect(fe.placeholder.parentElement).to.not.exist;593 });594 it('should disregard transparent element', () => {595 element1.computedStyle['position'] = 'fixed';596 element1.offsetWidth = 10;597 element1.offsetHeight = 10;598 element1.computedStyle['top'] = '0px';599 element1.computedStyle['opacity'] = '0';600 expect(vsyncTasks).to.have.length(1);601 const state = {};602 vsyncTasks[0].measure(state);603 expect(state['F0'].fixed).to.equal(true);604 expect(state['F0'].transferrable).to.equal(false);605 });606 it('should force transfer for visibility=hidden element', () => {607 element1.computedStyle['position'] = 'fixed';608 element1.offsetWidth = 10;609 element1.offsetHeight = 10;610 element1.computedStyle['top'] = '0px';611 element1.computedStyle['visibility'] = 'hidden';612 expect(vsyncTasks).to.have.length(1);613 const state = {};614 vsyncTasks[0].measure(state);615 expect(state['F0'].fixed).to.equal(true);616 expect(state['F0'].transferrable).to.equal(true);617 });618 });...
script.js
Source:script.js
1function main() {2 jogar();3 limparInput();4}5/* Função de envio da requisição */6function fazerGet(url) {7 let request = new XMLHttpRequest()8 request.open("GET", url, true)9 request.send()10 return request11}12const json = (fazerGet("https://us-central1-ss-devops.cloudfunctions.net/rand?min=1&max=300"));13/*console.log(json); para debugar*/14function jogar() {15 var resposta = JSON.parse(json.responseText).value;16 var statusCode = json.status;17 var palpite = document.getElementById("palpite").value;18 var btnJogar = document.getElementById("btnJogar");19 20 if (statusCode == "200") { /* executa o bloco caso a requisiçõa retorne "ok" */21 if(resposta > palpite) {22 mudarDigito();23 apagarDigito();24 document.getElementById("resultado").innerHTML = "à maior";25 }26 else if (resposta < palpite) {27 mudarDigito();28 apagarDigito();29 document.getElementById("resultado").innerHTML = "à menor";30 }31 else if (resposta == palpite) {32 mudarDigitoVerde();33 apagarDigito();34 document.getElementById("resultado").innerHTML = "Você acertou!!!!";35 document.getElementById("resultado").style.color = "#32BF00";36 document.getElementById("novaPartida").style.visibility = "visible"37 document.getElementById("palpite").disabled = true;38 btnJogar.disabled = true;39 btnJogar.style.background = "#DDDDDD";40 /*acionar botão "nova partida" com enter */41 document.addEventListener("keypress", function(e) {42 if(e.key === 'Enter') {43 var btn = document.querySelector("#novaPartida");44 btn.click();45 }46 });47 }48 }49 else {50 mudarDigitoVermelho(); /* em caso de status code diferente de "ok" captura o erro e mostra no led */51 apagarDigitoErro();52 document.getElementById("resultado").innerHTML = "ERRO";53 document.getElementById("resultado").style.color = "#CC3300";54 document.getElementById("novaPartida").style.visibility = "visible"55 document.getElementById("palpite").disabled = true;56 btnJogar.disabled = true;57 btnJogar.style.background = "#DDDDDD";58 document.addEventListener("keypress", function(e) {59 if(e.key === 'Enter') {60 var btn = document.querySelector("#novaPartida");61 btn.click();62 }63 });64 }65}66/*Função para adicionar uma classe mudando o css do algarismo no mostrador de led*/67function mudarDigito() {68 69 /* primeiro digito */70 var element1 = document.querySelector("#segmentos-1");71 var palpite = document.getElementById("palpite").value;72 switch(palpite.charAt(0)) {73 case "0":74 element1.classList.remove(...element1.classList);75 element1.classList.add("segmentos","zero");76 break;77 case "1":78 element1.classList.remove(...element1.classList);79 element1.classList.add("segmentos","um");80 break;81 case "2":82 element1.classList.remove(...element1.classList);83 element1.classList.add("segmentos","dois");84 break;85 case "3":86 element1.classList.remove(...element1.classList);87 element1.classList.add("segmentos","tres");88 break;89 case "4":90 element1.classList.remove(...element1.classList);91 element1.classList.add("segmentos","quatro");92 break;93 case "5":94 element1.classList.remove(...element1.classList);95 element1.classList.add("segmentos","cinco");96 break;97 case "6":98 element1.classList.remove(...element1.classList);99 element1.classList.add("segmentos","seis");100 break;101 case "7":102 element1.classList.remove(...element1.classList);103 element1.classList.add("segmentos","sete");104 break;105 case "8":106 element1.classList.remove(...element1.classList);107 element1.classList.add("segmentos","oito");108 break;109 case "9":110 element1.classList.remove(...element1.classList);111 element1.classList.add("segmentos","nove");112 break;113 }114 115 /* segundo digito */116 var element2 = document.querySelector("#segmentos-2");117 118 switch(palpite.charAt(1)) {119 case "0":120 element2.classList.remove(...element2.classList);121 element2.classList.add("segmentos","zero");122 break;123 case "1":124 element2.classList.remove(...element2.classList);125 element2.classList.add("segmentos","um");126 break;127 case "2":128 element2.classList.remove(...element2.classList);129 element2.classList.add("segmentos","dois");130 break;131 case "3":132 element2.classList.remove(...element2.classList);133 element2.classList.add("segmentos","tres");134 break;135 case "4":136 element2.classList.remove(...element2.classList);137 element2.classList.add("segmentos","quatro");138 break;139 case "5":140 element2.classList.remove(...element2.classList);141 element2.classList.add("segmentos","cinco");142 break;143 case "6":144 element2.classList.remove(...element2.classList);145 element2.classList.add("segmentos","seis");146 break;147 case "7":148 element2.classList.remove(...element2.classList);149 element2.classList.add("segmentos","sete");150 break;151 case "8":152 element2.classList.remove(...element2.classList);153 element2.classList.add("segmentos","oito");154 break;155 case "9":156 element2.classList.remove(...element2.classList);157 element2.classList.add("segmentos","nove");158 break;159 }160 /* terceiro digito */161 var element3 = document.querySelector("#segmentos-3");162 163 switch(palpite.charAt(2)) {164 case "0":165 element3.classList.remove(...element3.classList);166 element3.classList.add("segmentos","zero");167 break;168 case "1":169 element3.classList.remove(...element3.classList);170 element3.classList.add("segmentos","um");171 break;172 case "2":173 element3.classList.remove(...element3.classList);174 element3.classList.add("segmentos","dois");175 break;176 case "3":177 element3.classList.remove(...element3.classList);178 element3.classList.add("segmentos","tres");179 break;180 case "4":181 element3.classList.remove(...element3.classList);182 element3.classList.add("segmentos","quatro");183 break;184 case "5":185 element3.classList.remove(...element3.classList);186 element3.classList.add("segmentos","cinco");187 break;188 case "6":189 element3.classList.remove(...element3.classList);190 element3.classList.add("segmentos","seis");191 break;192 case "7":193 element3.classList.remove(...element3.classList);194 element3.classList.add("segmentos","sete");195 break;196 case "8":197 element3.classList.remove(...element3.classList);198 element3.classList.add("segmentos","oito");199 break;200 case "9":201 element3.classList.remove(...element3.classList);202 element3.classList.add("segmentos","nove");203 break;204 }205}206/*Função para adicionar uma classe mudando o css do algarismo no mostrador de led*/207function mudarDigitoVerde() {208 209 /* primeiro digito */210 var element1 = document.querySelector("#segmentos-1");211 var palpite = document.getElementById("palpite").value;212 switch(palpite.charAt(0)) {213 case "0":214 element1.classList.remove(...element1.classList);215 element1.classList.add("segmentos","zeroGreen");216 break;217 case "1":218 element1.classList.remove(...element1.classList);219 element1.classList.add("segmentos","umGreen");220 break;221 case "2":222 element1.classList.remove(...element1.classList);223 element1.classList.add("segmentos","doisGreen");224 break;225 case "3":226 element1.classList.remove(...element1.classList);227 element1.classList.add("segmentos","tresGreen");228 break;229 case "4":230 element1.classList.remove(...element1.classList);231 element1.classList.add("segmentos","quatroGreen");232 break;233 case "5":234 element1.classList.remove(...element1.classList);235 element1.classList.add("segmentos","cincoGreen");236 break;237 case "6":238 element1.classList.remove(...element1.classList);239 element1.classList.add("segmentos","seisGreen");240 break;241 case "7":242 element1.classList.remove(...element1.classList);243 element1.classList.add("segmentos","seteGreen");244 break;245 case "8":246 element1.classList.remove(...element1.classList);247 element1.classList.add("segmentos","oitoGreen");248 break;249 case "9":250 element1.classList.remove(...element1.classList);251 element1.classList.add("segmentos","noveGreen");252 break;253 }254 255 /* segundo digito */256 var element2 = document.querySelector("#segmentos-2");257 258 switch(palpite.charAt(1)) {259 case "0":260 element2.classList.remove(...element2.classList);261 element2.classList.add("segmentos","zeroGreen");262 break;263 case "1":264 element2.classList.remove(...element2.classList);265 element2.classList.add("segmentos","umGreen");266 break;267 case "2":268 element2.classList.remove(...element2.classList);269 element2.classList.add("segmentos","doisGreen");270 break;271 case "3":272 element2.classList.remove(...element2.classList);273 element2.classList.add("segmentos","tresGreen");274 break;275 case "4":276 element2.classList.remove(...element2.classList);277 element2.classList.add("segmentos","quatroGreen");278 break;279 case "5":280 element2.classList.remove(...element2.classList);281 element2.classList.add("segmentos","cincoGreen");282 break;283 case "6":284 element2.classList.remove(...element2.classList);285 element2.classList.add("segmentos","seisGreen");286 break;287 case "7":288 element2.classList.remove(...element2.classList);289 element2.classList.add("segmentos","seteGreen");290 break;291 case "8":292 element2.classList.remove(...element2.classList);293 element2.classList.add("segmentos","oitoGreen");294 break;295 case "9":296 element2.classList.remove(...element2.classList);297 element2.classList.add("segmentos","noveGreen");298 break;299 }300 /* terceiro digito */301 var element3 = document.querySelector("#segmentos-3");302 303 switch(palpite.charAt(2)) {304 case "0":305 element3.classList.remove(...element3.classList);306 element3.classList.add("segmentos","zeroGreen");307 break;308 case "1":309 element3.classList.remove(...element3.classList);310 element3.classList.add("segmentos","umGreen");311 break;312 case "2":313 element3.classList.remove(...element3.classList);314 element3.classList.add("segmentos","doisGreen");315 break;316 case "3":317 element3.classList.remove(...element3.classList);318 element3.classList.add("segmentos","tresGreen");319 break;320 case "4":321 element3.classList.remove(...element3.classList);322 element3.classList.add("segmentos","quatroGreen");323 break;324 case "5":325 element3.classList.remove(...element3.classList);326 element3.classList.add("segmentos","cincoGreen");327 break;328 case "6":329 element3.classList.remove(...element3.classList);330 element3.classList.add("segmentos","seisGreen");331 break;332 case "7":333 element3.classList.remove(...element3.classList);334 element3.classList.add("segmentos","seteGreen");335 break;336 case "8":337 element3.classList.remove(...element3.classList);338 element3.classList.add("segmentos","oitoGreen");339 break;340 case "9":341 element3.classList.remove(...element3.classList);342 element3.classList.add("segmentos","noveGreen");343 break;344 }345}346/*Função para adicionar uma classe mudando o css do algarismo no mostrador de led*/347function mudarDigitoVermelho() {348 349 /* primeiro digito */350 var element1 = document.querySelector("#segmentos-1");351 var statusCode = json.status;352 353 switch(String(statusCode).charAt(0)) {354 case "0":355 element1.classList.remove(...element1.classList);356 element1.classList.add("segmentos","zeroRed");357 break;358 case "1":359 element1.classList.remove(...element1.classList);360 element1.classList.add("segmentos","umRed");361 break;362 case "2":363 element1.classList.remove(...element1.classList);364 element1.classList.add("segmentos","doisRed");365 break;366 case "3":367 element1.classList.remove(...element1.classList);368 element1.classList.add("segmentos","tresRed");369 break;370 case "4":371 element1.classList.remove(...element1.classList);372 element1.classList.add("segmentos","quatroRed");373 break;374 case "5":375 element1.classList.remove(...element1.classList);376 element1.classList.add("segmentos","cincoRed");377 break;378 case "6":379 element1.classList.remove(...element1.classList);380 element1.classList.add("segmentos","seisRed");381 break;382 case "7":383 element1.classList.remove(...element1.classList);384 element1.classList.add("segmentos","seteRed");385 break;386 case "8":387 element1.classList.remove(...element1.classList);388 element1.classList.add("segmentos","oitoRed");389 break;390 case "9":391 element1.classList.remove(...element1.classList);392 element1.classList.add("segmentos","noveRed");393 break;394 }395 396 /* segundo digito */397 var element2 = document.querySelector("#segmentos-2");398 399 switch(String(statusCode).charAt(1)) {400 case "0":401 element2.classList.remove(...element2.classList);402 element2.classList.add("segmentos","zeroRed");403 break;404 case "1":405 element2.classList.remove(...element2.classList);406 element2.classList.add("segmentos","umRed");407 break;408 case "2":409 element2.classList.remove(...element2.classList);410 element2.classList.add("segmentos","doisRed");411 break;412 case "3":413 element2.classList.remove(...element2.classList);414 element2.classList.add("segmentos","tresRed");415 break;416 case "4":417 element2.classList.remove(...element2.classList);418 element2.classList.add("segmentos","quatroRed");419 break;420 case "5":421 element2.classList.remove(...element2.classList);422 element2.classList.add("segmentos","cincoRed");423 break;424 case "6":425 element2.classList.remove(...element2.classList);426 element2.classList.add("segmentos","seisRed");427 break;428 case "7":429 element2.classList.remove(...element2.classList);430 element2.classList.add("segmentos","seteRed");431 break;432 case "8":433 element2.classList.remove(...element2.classList);434 element2.classList.add("segmentos","oitoRed");435 break;436 case "9":437 element2.classList.remove(...element2.classList);438 element2.classList.add("segmentos","noveRed");439 break;440 }441 /* terceiro digito */442 var element3 = document.querySelector("#segmentos-3");443 444 switch(String(statusCode).charAt(2)) {445 case "0":446 element3.classList.remove(...element3.classList);447 element3.classList.add("segmentos","zeroRed");448 break;449 case "1":450 element3.classList.remove(...element3.classList);451 element3.classList.add("segmentos","umRed");452 break;453 case "2":454 element3.classList.remove(...element3.classList);455 element3.classList.add("segmentos","doisRed");456 break;457 case "3":458 element3.classList.remove(...element.classList);459 element3.classList.add("segmentos","tresRed");460 break;461 case "4":462 element3.classList.remove(...element3.classList);463 element3.classList.add("segmentos","quatroRed");464 break;465 case "5":466 element3.classList.remove(...element3.classList);467 element3.classList.add("segmentos","cincoRed");468 break;469 case "6":470 element3.classList.remove(...element3.classList);471 element3.classList.add("segmentos","seisRed");472 break;473 case "7":474 element3.classList.remove(...element3.classList);475 element3.classList.add("segmentos","seteRed");476 break;477 case "8":478 element3.classList.remove(...element3.classList);479 element3.classList.add("segmentos","oitoRed");480 break;481 case "9":482 element3.classList.remove(...element3.classList);483 element3.classList.add("segmentos","noveRed");484 break;485 }486}487/* muda o valor do input para vazio sempre que o botão "enviar" é acionado */488function limparInput(){489 document.getElementById("palpite").value = "";490}491/* Verifica quantos caracteres tem na string e mostra a quantidade de digitos correspondentes no led */492function apagarDigito(){493 /* verifica tamanho da string e remove os digitos não usados*/494 var palpite = document.getElementById("palpite").value;495 var digito2 = document.getElementById("segmentos-2");496 var digito3 = document.getElementById("segmentos-3");497 var tamanho = palpite.length;498 if (tamanho == 2){499 digito2.style.display = "inline-block";500 digito3.style.display = "none";501 }502 else if (tamanho == 3) {503 digito2.style.display = "inline-block";504 digito3.style.display = "inline-block";505 }506 else if (tamanho == 1) {507 digito2.style.display = "none";508 digito3.style.display = "none";509 }510}511function apagarDigitoErro(){512 /* verifica tamanho da string e remove os digitos não usados*/513 var statusCode = json.status;514 var erro = String(statusCode); 515 var digito2 = document.getElementById("segmentos-2");516 var digito3 = document.getElementById("segmentos-3");517 var tamanho = erro.length;518 if (tamanho == 2){519 digito2.style.display = "inline-block";520 digito3.style.display = "none";521 }522 else if (tamanho == 3) {523 digito2.style.display = "inline-block";524 digito3.style.display = "inline-block";525 }526 else if (tamanho == 1) {527 digito2.style.display = "none";528 digito3.style.display = "none";529 }530}531document.addEventListener("keypress", function(e) {532 if(e.key === 'Enter') {533 var btn = document.querySelector("#btnJogar");534 btn.click();535 }...
index.js
Source:index.js
1const nameElement1 = document.getElementById('nameElement');2const emailElement1 = document.getElementById('emailElement');3const passElement1 = document.getElementById('Password');4const cpassElement1 = document.getElementById('cpassword');5const mandatory = document.getElementById('nameSmall')6const mandatory2 = document.getElementById('nameSmall2')7const entireForm = document.querySelector('form')8const mandatory3 = document.getElementById('warning')9const mandatory4 = document.getElementById('need')10entireForm.addEventListener('submit',myfunction)11function myfunction(refresh){12 refresh.preventDefault();13 console.log('hello')14 if(nameElement1.value === ""){15 nameElement1.classList = 'error';16 mandatory.classList = 'display';17 }18 else{19 nameElement1.classList = 'success';20 }21 22 if(emailElement1.value === ""){23 emailElement1.classList = 'error';24 mandatory2.classList = 'display';25 }26 else{27 emailElement1.classList = 'success';28 }29 30 if(passElement1.value === ""){31 passElement1.classList = 'error';32 }33 else{34 passElement1.classList = 'success';35 }36 37 if(cpassElement1.value === ""){38 cpassElement1.classList = 'error';39 }40 else{41 cpassElement1.classList = 'success';42 }43 if(passElement1.value !== cpassElement1.value){44 console.log("password does not matched")45 passElement1.classList = 'error';46 cpassElement1.classList = 'error';47 mandatory3.classList = 'display';48 }49 50 if(passElement1.value.includes('@') === false && passElement1.value.includes('#') === false && passElement1.value.includes('$') === false ){51 passElement1.classList = 'error';52 console.log('Password Should Contains any one of @,#,or $....')53 mandatory4.classList = 'display';54 }55 else{56 passElement1.classList = 'success';57 console.log('password satisfied')58 }...
Using AI Code Generation
1import { element1 } from 'ng-mocks';2import { element2 } from 'ng-mocks';3import { element3 } from 'ng-mocks';4import { element1 } from 'ng-mocks';5import { element2 } from 'ng-mocks';6import { element3 } from 'ng-mocks';7import { element1 } from 'ng-mocks';8import { element2 } from 'ng-mocks';9import { element3 } from 'ng-mocks';10import { element1 } from 'ng-mocks';11import { element2 } from 'ng-mocks';12import { element3 } from 'ng-mocks';13import { element1 } from 'ng-mocks';14import { element2 } from 'ng-mocks';15import { element3 } from 'ng-mocks';16import { element1 } from 'ng-mocks';17import { element2 } from 'ng-mocks';18import { element3 } from 'ng-mocks';19import { element1 } from 'ng-mocks';20import { element2 } from 'ng-mocks';21import { element
Using AI Code Generation
1import {element1} from 'ng-mocks';2import {element2} from 'ng-mocks';3import {element1} from 'ng-mocks';4import {element2} from 'ng-mocks';5import {element1} from 'ng-mocks';6import {element2} from 'ng-mocks';7import {element1} from 'ng-mocks';8import {element2} from 'ng-mocks';9import {element1} from 'ng-mocks';10import {element2} from 'ng-mocks';11import {element1} from 'ng-mocks';12import {element2} from 'ng-mocks';13import {element1} from 'ng-mocks';14import {element2} from 'ng-mocks';15import {element1} from 'ng-mocks';16import {element2} from 'ng-mocks';17import {element1} from 'ng-mocks';18import {element2} from 'ng-mocks';19import {element1} from 'ng-mocks';20import {element2} from 'ng
Using AI Code Generation
1import { element1 } from 'ng-mocks';2import { element2 } from 'ng-mocks';3import * as ngMocks from 'ng-mocks';4import { ngMocks } from 'ng-mocks';5import * as ngMocks from 'ng-mocks';6import { ngMocks } from 'ng-mocks';7import * as ngMocks from 'ng-mocks';8import { ngMocks } from 'ng-mocks';9import * as ngMocks from 'ng-mocks';10import { ngMocks } from 'ng-mocks';11import * as ngMocks from 'ng-mocks';12import { ngMocks } from 'ng-mocks';13import * as ngMocks from 'ng-mocks';14import { ngMocks } from 'ng-mocks';15import * as ngMocks from 'ng-mocks';16import { ngMocks } from 'ng-mocks';17import * as ngMocks from 'ng-mocks';18import { ngMocks } from 'ng-mocks';
Using AI Code Generation
1import { element1 } from 'ng-mocks';2describe('test', () => {3 it('test', () => {4 const fixture = MockRender(`5 `);6 const element = element1('span', fixture.debugElement);7 expect(element).not.toBeNull();8 });9});
Using AI Code Generation
1var element1 = ngMocks.element;2var element2 = ngMocks.element;3var element3 = ngMocks.element;4var element4 = ngMocks.element;5var element5 = ngMocks.element;6var element6 = ngMocks.element;7var element7 = ngMocks.element;8var element8 = ngMocks.element;9var element9 = ngMocks.element;10var element10 = ngMocks.element;11var element11 = ngMocks.element;12var element12 = ngMocks.element;13var element13 = ngMocks.element;14var element14 = ngMocks.element;15var element15 = ngMocks.element;16var element16 = ngMocks.element;17var element17 = ngMocks.element;18var element18 = ngMocks.element;19var element19 = ngMocks.element;20var element20 = ngMocks.element;21var element21 = ngMocks.element;22var element22 = ngMocks.element;23var element23 = ngMocks.element;24var element24 = ngMocks.element;25var element25 = ngMocks.element;26var element26 = ngMocks.element;27var element27 = ngMocks.element;28var element28 = ngMocks.element;29var element29 = ngMocks.element;30var element30 = ngMocks.element;
Using AI Code Generation
1const element1 = require('ng-mocks').element1;2describe('TestController', () => {3 let controller: TestController;4 let $scope: IScope;5 let $rootScope: IRootScopeService;6 let $compile: ICompileService;7 beforeEach(() => {8 angular.mock.module('myApp');9 });10 beforeEach(inject(($controller: IControllerService, _$rootScope_: IRootScopeService, _$compile_: ICompileService) => {11 $rootScope = _$rootScope_;12 $scope = $rootScope.$new();13 $compile = _$compile_;14 controller = $controller('TestController', {15 });16 }));17 it('should test the controller', () => {18 });19});20const element1 = require('ng-mocks').element1;21describe('TestController', () => {22 let controller: TestController;23 let $scope: IScope;24 let $rootScope: IRootScopeService;25 let $compile: ICompileService;26 beforeEach(() => {27 angular.mock.module('myApp');28 });29 beforeEach(inject(($controller: IControllerService, _$rootScope_: IRootScopeService, _$compile_: ICompileService) => {30 $rootScope = _$rootScope_;31 $scope = $rootScope.$new();32 $compile = _$compile_;33 controller = $controller('TestController', {34 });35 }));36 it('should test the controller', () => {37 });38});39const element1 = require('ng-mocks').element1;40describe('TestController', () => {41 let controller: TestController;42 let $scope: IScope;43 let $rootScope: IRootScopeService;44 let $compile: ICompileService;45 beforeEach(() => {46 angular.mock.module('myApp');47 });48 beforeEach(inject(($controller: IControllerService, _$rootScope_: IRootScopeService, _$compile_: ICompileService) => {49 $rootScope = _$rootScope_;50 $scope = $rootScope.$new();51 $compile = _$compile_;52 controller = $controller('TestController', {
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.
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Get 100 minutes of automation test minutes FREE!!