Unlock 30% off on Manual Testing Annual Plans this Holiday Season. 
Use Code: LCMYEARENDEXCL30
Use Code: LCMYEARENDEXCL30Check icon
Copied to Clipboard!
How to use parseAttribute method in Playwright Internal
Best JavaScript code snippet using playwright-internal
chart.js
Source:chart.js 
...318 let margin = Math.abs(xPos - xBuffer);319 320 for (let i = 0; i < data.length; i++) {321 let node = document.getElementById(data[i].image);322 let originalY = parseAttribute('y', node.style.cssText);323 let originalX = parseAttribute('x', node.style.cssText);324 node.setAttribute('style', `--y: ${originalY}px; --x: ${originalX + margin}px`);325 }326 //fix spouse X positioning327 let fixedSpouses = []328 for (let i = 0; i < data.length; ++i) {329 if (data[i].spouse != null) {330 if (fixedSpouses.every(element => element != data[i].image)) {331 adjustSpouseXPos(data[i], fixedSpouses);332 }333 }334 }335 //Check to make sure the x distance between all nodes is the same336 let rootNode = getRootNode(data[0]);337 let rootNodeChildren = getChildren(rootNode);338 let rootNodeChildrenXPos = [];339 340 //find the max difference in x position between each node341 let maxXDiff = 0;342 for (let i = 0; i < rootNodeChildren.length; i++) {343 let rootNodeChildXPos = getX(rootNodeChildren[i].image);344 rootNodeChildrenXPos.push(rootNodeChildXPos);345 if (i != 0) {346 let xDiff = rootNodeChildrenXPos[i] - rootNodeChildrenXPos[i - 1];347 if (xDiff > maxXDiff) {348 maxXDiff = xDiff;349 }350 }351 }352 //update all node's x positions by the maxXDiff353 for (let i = 0; i < rootNodeChildren.length; i++) {354 if (i != 0) {355 let thisDiff = Math.abs(rootNodeChildrenXPos[i] - rootNodeChildrenXPos[i-1]);356 if(thisDiff != maxXDiff) {357 let node = document.getElementById(rootNodeChildren[i].image);358 let originalY = parseAttribute('y', node.style.cssText);359 node.setAttribute('style', `--y: ${originalY}px; --x: ${rootNodeChildrenXPos[i] + (maxXDiff - thisDiff)}px`);360 if (rootNodeChildren[i].spouse != null) {361 node = document.getElementById(rootNodeChildren[i].spouse);362 let originalX = parseAttribute('x', node.style.cssText);363 node.setAttribute('style', `--y: ${originalY}px; --x: ${originalX + (maxXDiff - thisDiff)}px`);364 }365 if(hasChildren(rootNodeChildren[i])) {366 let children = getChildren(rootNodeChildren[i]);367 for (let i = 0; i < children.length; i++) {368 node = document.getElementById(children[i].image);369 let originalX = parseAttribute('x', node.style.cssText);370 originalY = parseAttribute('y', node.style.cssText);371 node.setAttribute('style', `--y: ${originalY}px; --x: ${originalX + (maxXDiff - thisDiff)}px`);372 }373 }374 }375 }376 }377 //adjust root node378 for (let i = 0; i < data.length; i++) {379 if (data[i] == rootNode) {380 adjustRootNode();381 }382 }383}384function createLines() {385 //FIXME: SVG has to be wider than chartwidth, however find better way of doing this, don't use magic number386 let svgString = `<svg id='lines' height="${chartWidth}" width="${chartWidth+1000}" xmlns="http://www.w3.org/2000/svg" style='z-index:-1;'>`;387 for (let i = 0; i < data.length; ++i) {388 let li = $(`#${data[i].image}`);389 let yPos = parseAttribute('y', li[0].style.cssText);390 let xPos = parseAttribute('x', li[0].style.cssText);391 //Creates Child Lines392 if (hasChildren(data[i])) { 393 let index = getMomArrayIndex(momArray, data[i].image);394 for (let j = 0; j < momArray[index][0].children.length; ++j) {395 let childElement = $(`#${momArray[index][0].children[j].image}`)396 let x1 = xPos;397 let x2 = parseAttribute('x', childElement[0].style.cssText);398 let y1 = yPos;399 let y2 = parseAttribute('y', childElement[0].style.cssText);400 svgString += `<line class='svg-line' x1="${x1}" y1="${chartWidth - y1}" x2="${x2}" y2="${chartWidth - y2}" stroke="black" stroke-width='6' onclick='testAdd(data[${i}], momArray[${index}][0].children[${j}])'/>`401 }402 }403 //Creates Spouse Lines404 if (data[i].spouse != null) {405 let spouseElement = $(`#${data[i].spouse}`);406 let spouseXPos = parseAttribute('x', spouseElement[0].style.cssText);407 let spouseYPos = parseAttribute('y', spouseElement[0].style.cssText);408 let line = `<line class='svg-line' x1="${xPos}" y1="${chartWidth - yPos}" x2="${spouseXPos}" y2="${chartWidth - spouseYPos}" stroke="blue" stroke-width='6' onclick='testAdd(data[${i}], data[getDataIndex(data[${i}].spouse)])'/>`409 //if statement so that two spouse lines aren't drawn between spouses410 if (spouseXPos > xPos) {411 svgString += line412 }413 }414 }415 svgString += "</svg>"416 $('#chart').html($('#chart').html() + svgString);417}418function adjustSpouseXPos(node, fixedSpouses) {419 //debugger420 let spouseElement = document.getElementById(`${node.spouse}`);421 let spouseId = node.spouse;422 let spouseNode = getNode(spouseId);423 let spouseXPos = getX(spouseId);424 let currNodeElement = document.getElementById(`${node.image}`);425 let currNodeXPos = getX(node.image);426 let spacing = 100;427 let originalY = parseAttribute('y', spouseElement.style.cssText);428 if (hasChildren(spouseNode)) {429 currNodeElement.setAttribute('style', `--y: ${originalY}px; --x: ${spouseXPos - spacing}px`);430 } else {431 spouseElement.setAttribute('style', `--y: ${originalY}px; --x: ${currNodeXPos + spacing}px`);432 }433 fixedSpouses.push(spouseId);434 fixedSpouses.push(node.image);435}436/**437 * Finds the x positions of the leftmost and rightmost child 438 * of the root node and sets the x position of the rootnode439 * and root spouse at the central position of those two nodes.440 */441function adjustRootNode() {442 let leftmostChild = getLeftmostChild(getRootNode(data[0]));443 let rightmostChild = getRightmostChild(getRootNode(data[0]));444 let leftChildX = getX(leftmostChild.image);445 let rightChildX = getX(rightmostChild.image);446 let newXPos = (leftChildX + rightChildX)/2;447 448 let rootNodeElement = document.getElementById(getRootNode(data[0]).image);449 let rootNodeSpouse = document.getElementById(getRootNode(data[0]).spouse);450 let originalY = parseAttribute('y', rootNodeElement.style.cssText);451 452 rootNodeElement.setAttribute('style', `--y: ${originalY}px; --x: ${newXPos}px`);453 if (rootNodeSpouse != null) {454 rootNodeSpouse.setAttribute('style', `--y: ${originalY}px; --x: ${newXPos + 100}px`);455 }456}457//NEW getX Function (for gen1 and gen2 nodes)458function setX(node, map, width, placeInGen) {459 let keyGen = getGeneration(node);460 let xPos = (width/(getNumInGeneration(keyGen) + 1)) * (placeInGen + 1);461 return xPos;462}463//setX for gen3 and above nodes464function setChildX(node, widthOfFamily) {465 let numChildren = getNumChildrenInFamily(node);466 let placeInFam = getPlaceInFamily(node);467 468 let nodeMother = node.mother;469 let momXPos;470 if (nodeMother != null) {471 momXPos = getX(nodeMother);472 } else {473 momXPos = 0;474 }475 let famSpacing = widthOfFamily/(numChildren + 1);476 let momGen = getGeneration(node.mother);477 let momsInGen = getMomsInGen(momGen);478 let xPos;479 for (let i = 0; i < momsInGen.length; i++) {480 xPos = (famSpacing * placeInFam) + (momXPos - (widthOfFamily/2));481 }482 483 //adjust positions of higher gen nodes484 if (numChildren > 1) {485 adjustHigherGenNodes(nodeMother, momXPos);486 }487 return xPos;488}489function adjustHigherGenNodes(nodeMother, currentMomNodeXPos) {490 491 let motherId = getDataIndex(nodeMother);492 let mother = data[motherId];493 494 //Get an array of the children nodes495 let childNodeArray = getChildren(mother);496 let nodesToAdjust = []497 //1. Get the xPositions of all nodes besides the mom and her children498 for (let i = 0; i < data.length; i++) {499 if (!childNodeArray.some(element => element == data[i]) && isOnTree(data[i])) {500 nodesToAdjust.push(data[i]);501 }502 }503 let nodesXPositions = []504 for (let i = 0; i < nodesToAdjust.length; i++) {505 nodesXPositions.push(getX(nodesToAdjust[i].image));506 }507 //2. Adjust the xPositions of elements in the momXPositions array508 let adjustX = 50;509 for (let i = 0; i < nodesXPositions.length; i++) {510 if (nodesXPositions[i] > currentMomNodeXPos) {511 nodesXPositions[i] += adjustX;512 }513 else if (nodesXPositions[i] < currentMomNodeXPos) {514 nodesXPositions[i] -= adjustX;515 }516 }517 //3. Adjust the corresponding node elements with their new xPositions518 for (let i = 0; i < nodesToAdjust.length; i++) {519 let node = document.getElementById(nodesToAdjust[i].image);520 let originalY = parseAttribute('y', node.style.cssText);521 node.setAttribute('style', `--y: ${originalY}px; --x: ${nodesXPositions[i]}px`);522 }523}524function addSpouseRelationship(id1, id2) {525 let node1;526 let node2;527 for (let i = 0; i < data.length; ++i) {528 if (data[i].image == id1) {529 node1 = data[i];530 }531 if (data[i].image == id2) {532 node2 = data[i];533 }534 }535 for (let i = 0; i < nodeBoxData.length; ++i) {536 if (nodeBoxData[i].image == id1) {537 node1 = nodeBoxData[i];538 }539 if (nodeBoxData[i].image == id2) {540 node2 = nodeBoxData[i];541 }542 }543 //For Spouse -> Spouse544 let spouse1 = node1;545 let spouse2 = node2;546 if (getNodeBoxDataIndex(spouse1.image) != null) {547 spouse1Index = getNodeBoxDataIndex(spouse1.image);548 data.push(nodeBoxData[spouse1Index]);549 nodeBoxData.splice(spouse1Index, 1);550 } 551 //What if spouse2 is in nodeBoxData552 if (getNodeBoxDataIndex(spouse2.image) != null) {553 spouse2Index = getNodeBoxDataIndex(spouse2.image);554 data.push(nodeBoxData[spouse2Index]);555 nodeBoxData.splice(spouse2Index, 1);556 }557 if (getDataIndex(spouse1.image) != null) {558 spouse1Index = getDataIndex(spouse1.image);559 data[spouse1Index].spouse = spouse2.image;560 }561 if (getDataIndex(spouse2.image) != null) {562 spouse2Index = getDataIndex(spouse2.image);563 data[spouse2Index].spouse = spouse1.image;564 }565 566 createChart(chartList);567 document.getElementById('confirmBox').innerHTML = '';568 closeMenu();569}570//TODO fix issues571//ADDED TEST SPACING FOR PRESENTATION572function addMotherRelationship(id1, id2) {573 //SOLVE:574 //4. Impossible to do with current data but if male, you can't make it mother575 //5. If moved from nodeBoxData into confirmBox and error occurs (ie more than 2 nodes) and confirmBox is cleared, the data from nodeBoxData is lost forever576 577 let id1Node;578 let id2Node;579 for (let i = 0; i < data.length; ++i) {580 if (data[i].image == id1) {581 id1Node = data[i];582 }583 if (data[i].image == id2) {584 id2Node = data[i];585 }586 }587 for (let i = 0; i < nodeBoxData.length; ++i) {588 if (nodeBoxData[i].image == id1) {589 id1Node = nodeBoxData[i];590 }591 if (nodeBoxData[i].image == id2) {592 id2Node = nodeBoxData[i];593 }594 }595 let mother;596 let child;597 if (id1Node.birthyear > id2Node.birthyear) {598 mother = id2Node;599 child = id1Node;600 } else {601 mother = id1Node;602 child = id2Node;603 }604 let childIndex;605 let momIndex606 if (getNodeBoxDataIndex(child.image) != null) {607 childIndex = getNodeBoxDataIndex(child.image);608 data.push(nodeBoxData[childIndex]);609 nodeBoxData.splice(childIndex, 1)610 } 611 //What if mom is in nodeBoxData612 if (getNodeBoxDataIndex(mother.image) != null) {613 momIndex = getNodeBoxDataIndex(mother.image);614 data.push(nodeBoxData[momIndex]);615 nodeBoxData.splice(momIndex, 1)616 }617 if (getDataIndex(child.image) != null) {618 childIndex = getDataIndex(child.image);619 data[childIndex].mother = mother.image;620 }621 momArray = makeMomArray()622 623 createChart(chartList)624 document.getElementById('confirmBox').innerHTML = ''625 closeMenu();626}627//FIXME: If nodes are in different gens, it should not remove the line628//TODO: What is the purpose of this function? - Brandon629function removeSpouseLine(id1, id2) {630 let node1XPos = getX(id1);631 let node2XPos = getX(id2);632 let node1Elem = document.getElementById(id1);633 let node2Elem = document.getElementById(id2);634 let node1YPos = parseAttribute('y', node1Elem.style.cssText);635 let node2YPos = parseAttribute('y', node2Elem.style.cssText);636 637 const svgLines = document.querySelectorAll(".svg-line");638 for (let i = 0; i < svgLines.length; i++) {639 let elem1X = svgLines[i].x1.baseVal.value;640 let elem1Y = svgLines[i].y1.baseVal.value;641 let elem2X = svgLines[i].x2.baseVal.value;642 let elem2Y = svgLines[i].y2.baseVal.value;643 if (node2XPos == elem1X && node1XPos == elem2X && (node1YPos - elem1Y) < 30 && (node2YPos - elem2Y) < 30) {644 svgLines[i].remove();645 }646 }647}648function removeRelationship(id1, id2) {649 let id1Index = getDataIndex(id1)650 let id2Index = getDataIndex(id2)651 let isRelated = false652 //Removes Spouse Relationship653 if (data[id1Index].spouse == id2) {654 isRelated = true655 data[id1Index].spouse = null656 data[id2Index].spouse = null657 if (!(hasRelationship(data[id1Index]))) {658 addToNodeContainer(id1)659 data.splice(id1Index, 1)660 }661 id2Index = getDataIndex(id2)662 if (!(hasRelationship(data[id2Index]))) {663 addToNodeContainer(id2)664 data.splice(id2Index, 1)665 }666 closeMenu();667 createChart(chartList);668 let box = document.getElementById('confirmBox');669 box.innerHTML = ''670 box.style.border = ''671 672 return;673 }674 //Removes Mother/Child Relationship675 id1Index = getDataIndex(id1);676 id2Index = getDataIndex(id2);677 if (data[id1Index].mother == id2) {678 for (let i = 0; i < momArray.length; ++i) {679 if (momArray[i][0].data.image == id2) {680 for (let j = 0; j < momArray[i][0].children.length; ++j) {681 if (momArray[i][0].children[j].image == id1) {682 isRelated = true;683 data[id1Index].mother = null;684 if (!hasRelationship(data[id1Index])) {685 addToNodeContainer(data[id1Index].image);686 data.splice(id1Index, 1);687 }688 id2Index = getDataIndex(id2);689 690 momArray = makeMomArray();691 if (!hasRelationship(data[id2Index])) {692 addToNodeContainer(data[id2Index].image);693 data.splice(id2Index, 1);694 }695 break;696 }697 }698 }699 }700 }701 else if (data[id2Index].mother == id1) {702 for (let i = 0; i < momArray.length; ++i) {703 if (momArray[i][0].data.image == id1) {704 for (let j = 0; j < momArray[i][0].children.length; ++j) {705 if (momArray[i][0].children[j].image == id2) {706 isRelated = true;707 data[id2Index].mother = null;708 if (!hasRelationship(data[id2Index])) {709 addToNodeContainer(data[id2Index].image);710 data.splice(id2Index, 1);711 }712 id1Index = getDataIndex(id1);713 momArray = makeMomArray();714 if (!hasRelationship(data[id1Index])) {715 addToNodeContainer(data[id1Index].image);716 data.splice(id1Index, 1);717 }718 break;719 }720 }721 }722 }723 }724 if (!isRelated) {725 alert("Error, No Direct Relationship");726 }727 createChart(chartList)728 let box = document.getElementById('confirmBox');729 box.innerHTML = ''730 box.style.border = ''731 closeMenu();732}733function addToConfirmBox(id) {734 let box = document.getElementById("confirmBox");735 //Doesn't let you add a node twice736 for (let i = 0; i < box.children.length; ++i) {737 if (box.children[i].id == `node${id}`) {738 return;739 }740 }741 //Doesn't let you add more than 2 nodes742 if (box.children.length >= 2) {743 alert("Can't have more than 2 nodes in confirmation box.");744 $('#confirmBox').html('');745 return;746 }747 let nodeId = `node${id}`;748 let img = document.createElement('img');749 img.setAttribute('id', nodeId);750 img.setAttribute('class', 'node-image');751 img.setAttribute('src', `../../static/tree/images/pictures/${id}.PNG`);752 $('#confirmBox').append(img);753 //sets border for confirmBox754 if ($('#confirmBox').children.length > 0) {755 $('#confirmBox').css('border', '5px solid black');756 }757 //Parses id to just original ID758 let children = [];759 for (let i = 0; i < box.children.length; ++i) {760 children.push(box.children[i].id.substr(4))761 }762 //Opens menu with all the info763 if (children.length == 2) {764 let param1 = children[0];765 let param2 = children[1];766 let node1;767 let node2;768 let id1Index = getDataIndex(parseInt(param1));769 let id2Index = getDataIndex(parseInt(param2));770 771 //These statements account for if the node is in the data or nodeBoxData772 if (id1Index != null) {773 node1 = data[id1Index]774 }775 if (id2Index != null) {776 node2 = data[id2Index]777 }778 if (id1Index == null) {779 id1Index = getNodeBoxDataIndex(parseInt(param1));780 node1 = nodeBoxData[id1Index];781 }782 if (id2Index == null) {783 id2Index = getNodeBoxDataIndex(parseInt(param2));784 node2 = nodeBoxData[id2Index]785 }786 testAdd(node1, node2)787 }788}789function addToNodeContainer(id) {790 let index = getDataIndex(id);791 nodeBoxData.push(data[index]);792 let container = document.getElementById('nodeContainer');793 let nodeId = `node${id}`;794 let button = document.createElement('button');795 let img = document.createElement('img');796 img.setAttribute('id', nodeId);797 img.setAttribute('class', 'node-image');798 img.setAttribute('src', `../../static/tree/images/pictures/${id}.PNG`);799 button.setAttribute('id', `button${id}`);800 button.setAttribute('class', 'nodeBox-button');801 button.setAttribute('onclick', `addToConfirmBox(${id}), removeFromNodeContainer(${id})`);802 button.appendChild(img);803 container.appendChild(button);804}805function removeFromNodeContainer(id) {806 let container = document.getElementById('nodeContainer');807 let child = document.getElementById("button" + id);808 container.removeChild(child);809}810function removeAllChildNodes(parent) {811 while (parent.firstChild) {812 parent.removeChild(parent.firstChild);813 }814}815function hoverMenu(nodeId) {816 let hMenu = document.getElementById('hover-menu');817 //debugger818 let nodeIndex = getDataIndex(nodeId);819 let node = document.getElementById(nodeId);820 let nodeX = parseAttribute('x', node.style.cssText);821 let nodeY = parseAttribute('y', node.style.cssText);822 //Make this class a datapoint technically and make XY pos's from there, just get X,Y from node and then adjust slightly for it to be near node823 hMenu.innerHTML = `824 <div id='hover-menu' class='hover-menu hover-point' style='--y: ${nodeY + 100}px; --x: ${nodeX - 25}px'>825 <div>Gen: ${getGeneration(data[nodeIndex])} <br> Node: ${data[nodeIndex].image}</b><br>Spouse: ${data[nodeIndex].spouse}<br>Mother: ${data[nodeIndex]?.mother}<br>x: ${nodeX}</div>826 <img class='menu-pic' src='../../static/tree/images/pictures/${nodeId}.PNG'/>827 <div id ='node-${nodeId}-info' style='display: flex; justify-content:center; align-items:center; flex-direction: column;'>828 <div><b>John Doe</br></div>829 <div><b>${data[nodeIndex]?.birthyear}</b></div>830 </div>831 </div>832 `833}834function closeHoverMenu() {835 let menu = document.getElementById('hover-menu');836 menu.innerHTML = '';837}838function openMenu(id1, id2) {839 let box = document.getElementById('confirmBox');840 let id1Birthyear;841 let id2Birthyear;842 let id1Index = getDataIndex(parseInt(id1));843 let id2Index = getDataIndex(parseInt(id2));844 //These statements account for if the node is in the data or nodeBoxData845 if (id1Index != null) {846 id1Birthyear = data[id1Index].birthyear847 }848 if (id2Index != null) {849 id2Birthyear = data[id2Index].birthyear850 }851 if (id1Index == null) {852 id1Index = getNodeBoxDataIndex(parseInt(id1));853 id1Birthyear = nodeBoxData[id1Index].birthyear;854 }855 if (id2Index == null) {856 id2Index = getNodeBoxDataIndex(parseInt(id2));857 id2Birthyear = nodeBoxData[id2Index].birthyear;858 }859 if (box.children.length == 2) {860 let menu = document.getElementById('center-menu');861 menu.innerHTML = `<div id='center-menu' class='center-menu'>862 863 <div><button onclick='closeMenu()'>X</button></div>864 <div class='menu-pics-container'>865 <div>866 <img class='menu-pic' src='../../static/tree/images/pictures/${id1}.PNG'/>867 <div id ='node-${id1}-info' style='display: flex; justify-content:center; align-items:center; flex-direction: column; padding-top: 5px;'>868 <div><b>John Doe</b></div>869 <div><b>${id1Birthyear}</b></div>870 </div>871 </div>872 <div>873 <img class='menu-pic' src='../../static/tree/images/pictures/${id2}.PNG'/>874 <div id ='node-${id2}-info' style='display: flex; justify-content:center; align-items:center; flex-direction: column; padding-top: 5px;'>875 <div><b>John Doe</b></div>876 <div><b>${id2Birthyear}</b></div>877 </div>878 </div>879 </div>880 <div class='menu-button'>881 <button id='removeButton' class='button-34' onclick='removeRelationship(${id1}, ${id2})'>Remove Relationship</button>882 <button id='addMotherButton' class='button-34' onclick=addMotherRelationship(${id1}, ${id2})>Add Mother/Child Relationship</button>883 <button id='addSpouseButton' class='button-34' onclick=addSpouseRelationship(${id1}, ${id2})>Add Spouse Relationship</button>884 </div>885 </div>`886 } else {887 let menu = document.getElementById('center-menu');888 menu.innerHTML = '';889 }890 changeRemoveButtonParameters()891 changeAddButtonParameters()892}893function closeMenu() {894 let menu = document.getElementById('center-menu') 895 //TODO Add if that put nodedataBox nodes back to nodeBox896 menu.innerHTML = '';897 let confirmBox = document.getElementById('confirmBox');898 confirmBox.innerHTML = '';899}900///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////901//All helper functions to access data, etc.902function hasSpouse(node) {903 if (node.spouse != null) {904 return true;905 } else {906 return false;907 }908}909function getNode(nodeId) {910 for (let i = 0; i < data.length; i++) {911 if(data[i].image == nodeId) {912 return data[i];913 }914 }915}916function getX(node) {917 if (node != null) {918 let thisNode = document.getElementById(node);919 let nodeXPos = parseAttribute('x', thisNode.style.cssText);920 return nodeXPos;921 }922}923function getY(height, generation) {924 let genCount = getLongestGenChain();925 return (chartWidth + 225) - (chartWidth/genCount + 1) * generation;926 //added a little to chartWidth to center it, can change later927}928function getLongestGenChain() {929 let genCount = 0;930 for (let j = 0; j < data.length; ++j) {931 let tmp = getGenerationCount(data[j], 1);932 if (tmp > genCount) {933 genCount = tmp;934 }935 }936 return genCount;937}938function getPlaceInGeneration(node, generation) {939 let nodeArray = [];940 nodeArray = getNodesInGeneration(generation);941 let placeInGen;942 for (let i = 0; i < nodeArray.length; i++) {943 if(nodeArray[i] == node) {944 placeInGen = i;945 }946 }947 return placeInGen;948}949function getPlaceInFamily(node) {950 let nodeArray = [];951 nodeArray = getFamilyArray(node);952 let placeInFamily;953 for (let i = 0; i < nodeArray.length; i++) {954 if(nodeArray[i] == node) {955 placeInFamily = i;956 }957 }958 return placeInFamily + 1;959}960function getNumChildrenInFamily(node) {961 962 let nodesInFamily = [];963 for (let i = 0; i < data.length; ++i) {964 if (data[i].mother == node.mother) {965 nodesInFamily.push(data[i]);966 }967 }968 return nodesInFamily.length;969}970function getFamilyArray(node) {971 972 let nodesInFamily = [];973 for (let i = 0; i < data.length; ++i) {974 if (data[i].mother == node.mother) {975 nodesInFamily.push(data[i]);976 }977 }978 return nodesInFamily;979}980function getWidthOfFamily(node) {981 let width = 800; //TODO: make it variable based on generation982 return width;983}984function getMomsInGen(generation) {985 theMomArray = [];986 //gets all motherId's in data987 for (let i = 0; i < data.length; i++) {988 if(data[i].mother != null) {989 if (theMomArray.every(element => element != data[i].mother)) {990 theMomArray.push(data[i].mother); //push the motherIds991 }992 }993 }994 //gets array of motherId's in generation995 newMomArray = []996 for (let i = 0; i < theMomArray.length; i++) {997 if (getGeneration(theMomArray[i]) == generation) {998 newMomArray.push(theMomArray[i]);999 }1000 }1001 return newMomArray;1002}1003function getMother(node) {1004 return node.mother;1005}1006function getDataIndex(id) {1007 for (let i = 0; i < data.length; ++i) {1008 if (id === data[i].image) {1009 return i;1010 }1011 }1012 return null;1013}1014function getNodeBoxDataIndex(id) {1015 for (let i = 0; i < nodeBoxData.length; ++i) {1016 if (id === nodeBoxData[i].image) {1017 return i;1018 }1019 }1020 return null;1021}1022function getMomArrayIndex(array, id) {1023 for (let i = 0; i < array.length; ++i) {1024 if (array[i][0].data.image == id) {1025 return i;1026 }1027 }1028}1029//For testing with different data positions1030function randomizeDataOrder(data) {1031 for (let i = 0; i < data.length; ++i) {1032 let randomIndex = Math.floor(Math.random() * data.length);1033 let tmpVal = data[randomIndex];1034 data[randomIndex] = data[i];1035 data[i] = tmpVal;1036 }1037}1038function hasChildren(node) {1039 1040 let hasChildren = false;1041 for (let i = 0; i < data.length; i++) {1042 if (data[i]?.mother == node?.image) {1043 hasChildren = true;1044 }1045 }1046 return hasChildren;1047}1048function isOnTree(node) {1049 let thisNode = document.getElementById(node.image);1050 let checkNode = false;1051 if (thisNode != null) {1052 checkNode = true;1053 }1054 return checkNode;1055}1056function getHypotenuse(datapoint1, datapoint2, left1, left2) {1057 triSide = datapoint1 - datapoint2;1058 tmpSpacing = left1 - left2;1059 hypotenuse = Math.sqrt((triSide * triSide) + (tmpSpacing * tmpSpacing));1060 return hypotenuse;1061}1062function getAngle(opposite, hypotenuse) {1063 let sine = Math.asin(opposite / hypotenuse);1064 //Convert from radians to degrees1065 sine = sine * (180 / Math.PI);1066 return sine;1067}1068function parseAttribute(lookFor, attribute) {1069 let numString = '';1070 if (lookFor == 'y') {1071 for (let i = 0; i < attribute.length; ++i) {1072 if (attribute[i] == 'y') {1073 let j = i + 2 //skips colon and white space1074 while (attribute[j] != 'p') {1075 numString += attribute[j];1076 j++;1077 }1078 }1079 }1080 }1081 if (lookFor == 'x') {1082 for (let i = 0; i < attribute.length; ++i) {1083 if (attribute[i] == 'x' && attribute[i-1] != 'p') {1084 let j = i + 2; //skips colon and white space1085 while (attribute[j] != 'p') {1086 numString += attribute[j];1087 j++;1088 }1089 }1090 }1091 }1092 return parseInt(numString);1093}1094function hasRelationship(node) {1095 let hasRelationship = false;1096 if (node.spouse != null) {1097 hasRelationship = true;1098 }1099 if (hasChildren(node)) {1100 hasRelationship = true;1101 }1102 if (node.mother != null) {1103 hasRelationship = true;1104 }1105 return hasRelationship;1106}1107function getGenerationCount(node, count) {1108 if (node?.mother == null) {1109 if (node?.spouse != null) {1110 let spouseIndex = getDataIndex(node.spouse);1111 if (data[spouseIndex].mother != null) {1112 let motherIndex = getDataIndex(data[spouseIndex].mother);1113 return count += getGenerationCount(data[motherIndex], count);1114 }1115 else {1116 return count;1117 }1118 }1119 else {1120 return count;1121 }1122 }1123 let motherIndex = getDataIndex(node.mother);1124 if (node.mother != null) {1125 return count += getGenerationCount(data[motherIndex], count);1126 }1127}1128function getGeneration(node) {1129 let count = 1;1130 count = getGenerationCount(node, count);1131 return count;1132}1133function getNumInGeneration(generation) {1134 let numInGen = 0;1135 for (let i = 0; i < data.length; ++i) {1136 if (getGeneration(data[i]) == generation) {1137 numInGen++;1138 }1139 }1140 return numInGen;1141}1142function getNodesInGeneration(generation) {1143 let nodeGeneration = [];1144 for (let i = 0; i < data.length; ++i) {1145 if (getGeneration(data[i]) == generation) {1146 nodeGeneration.push(data[i]);1147 }1148 }1149 return nodeGeneration;1150}1151function getChildren(motherNode) {1152 let children = [];1153 if (hasChildren(motherNode)) {1154 let index = getMomArrayIndex(momArray, motherNode.image);1155 for (let i = 0; i < momArray[index][0].children.length; ++i) {1156 children.push(momArray[index][0].children[i]);1157 }1158 }1159 return children;1160}1161function getRootNode(node) {1162 if (node.mother == null) {1163 let spouseIndex = getDataIndex(node.spouse);1164 if (node.spouse != null && data[spouseIndex].mother != null) {1165 let motherIndex = getDataIndex(data[spouseIndex].mother);1166 return getRootNode(data[motherIndex]);1167 }1168 else {1169 if (!hasChildren(node)) {1170 return getNode(node.spouse);1171 } else {1172 return node;1173 }1174 }1175 }1176 if (node.mother != null) {1177 let momIndex = getDataIndex(node.mother);1178 return getRootNode(data[momIndex]);1179 }1180}1181function getLeftmostChild(momNode) {1182 let childElementXPos;1183 let leftmostChild;1184 for (let i = 0; i < momArray.length; ++i) {1185 if (momArray[i][0].data.image == momNode.image) {1186 //Initial comparing value1187 let tmpChild = document.getElementById(`${momArray[i][0].children[0].image}`);1188 childElementXPos = parseAttribute('x', tmpChild.style.cssText)1189 leftmostChild = tmpChild.id1190 for (let j = 0; j < momArray[i][0].children.length; ++j) {1191 let child = document.getElementById(`${momArray[i][0].children[j].image}`);1192 let childXPos = parseAttribute('x', child.style.cssText);1193 if (childXPos < childElementXPos) {1194 childElementXPos = childXPos;1195 leftmostChild = child.id1196 }1197 }1198 break;1199 }1200 }1201 return data[getDataIndex(parseInt(leftmostChild))];1202}1203function getRightmostChild(momNode) {1204 let childElementXPos;1205 let rightmostChild;1206 for (let i = 0; i < momArray.length; ++i) {1207 if (momArray[i][0].data.image == momNode.image) {1208 //Initial comparing value1209 let tmpChild = document.getElementById(`${momArray[i][0].children[0].image}`);1210 childElementXPos = parseAttribute('x', tmpChild.style.cssText)1211 rightmostChild = tmpChild.id1212 for (let j = 0; j < momArray[i][0].children.length; ++j) {1213 let child = document.getElementById(`${momArray[i][0].children[j].image}`);1214 let childXPos = parseAttribute('x', child.style.cssText);1215 if (childXPos > childElementXPos) {1216 childElementXPos = childXPos;1217 rightmostChild = child.id;1218 }1219 }1220 break;1221 }1222 }1223 return data[getDataIndex(parseInt(rightmostChild))]...
Query.js
Source:Query.js
...57 });58 test.equal(false, query.checkIfKeyExists("testing"));59 test.end();60 });61 test("QUERY - validate parseAttribute() - SUCCESS", async test => {62 const query = new QueryBuilder({}, {}, "User");63 query.setModelDefinition({64 schema: {65 paths: {66 "test": {67 instance: "String",68 enumValues: []69 }70 }71 }72 });73 const response = query.parseAttribute("test", "testing", false);74 test.deepEqual({75 test: "testing"76 },77 response78 );79 test.end();80 });81 test("QUERY - validate parseAttribute() with search flag - SUCCESS", async test => {82 const query = new QueryBuilder({}, {}, "User");83 query.setModelDefinition({84 schema: {85 paths: {86 "test": {87 instance: "String",88 enumValues: []89 }90 }91 }92 });93 const response = query.parseAttribute("test", "testing", true);94 const compare = {95 test: new RegExp("testing", "i")96 };97 test.deepEqual(response, compare);98 test.end();99 });100 test("QUERY - validate parseAttribute() with search flag - FAIL", async test => {101 const query = new QueryBuilder({}, {}, "User");102 query.setModelDefinition({103 schema: {104 paths: {105 "test": {106 instance: "String",107 enumValues: []108 }109 }110 }111 });112 try {113 query.parseAttribute("test", { test: "testing object" }, true);114 } catch (error) {115 test.equal(error.code, 400);116 test.equal(error.message, "Bad query for search. Field 'test' invalid type.");117 }118 test.end();119 });120 test("QUERY - validate buildQueryObject() with query and search - SUCCESS", async test => {121 const momentDate = moment();122 const timeNow = momentDate.unix();123 const query = new QueryBuilder({124 array: ["testingArray"],125 boolean: "TRUE",126 date: timeNow,127 mixed: { test: "testing" },...
parse-element.test.js
Source:parse-element.test.js
...36 expect(crsbinding.providerManager.items.size).toBeGreaterThan(0);37});38test("parseAttribute", async () => {39 const attr = {name: "value.bind", value: "firstName", ownerElement: element};40 const provider = await parseAttribute(attr, context);41 expect(provider).not.toBeNull();42 expect(provider.constructor.name).toBe("BindProvider");43 expect(provider._element).not.toBeNull();44 expect(provider._context).not.toBeNull();45 expect(provider._property).not.toBeNull();46 expect(provider._value).not.toBeNull();47});48test("parseAttribute", async () => {49 const attr = {name: "value.two-way", value: "firstName", ownerElement: element};50 const provider = await parseAttribute(attr, context);51 expect(provider).not.toBeNull();52 expect(provider.constructor.name).toBe("BindProvider");53 expect(provider._element).not.toBeNull();54 expect(provider._context).not.toBeNull();55 expect(provider._property).not.toBeNull();56 expect(provider._value).not.toBeNull();57});58test("parseAttribute", async () => {59 const attr = {name: "value.one-way", value: "firstName", ownerElement: element};60 const provider = await parseAttribute(attr, context);61 expect(provider).not.toBeNull();62 expect(provider.constructor.name).toBe("OneWayProvider");63 expect(provider._element).not.toBeNull();64 expect(provider._context).not.toBeNull();65 expect(provider._property).not.toBeNull();66 expect(provider._value).not.toBeNull();67});68test("parseAttribute - once", async () => {69 const attr = {name: "value.once", value: "firstName", ownerElement: element};70 const provider = parseAttribute(attr, context);71 expect(provider).toBeNull();72});73test("parseAttribute - call", async () => {74 const attr = {name: "value.call", value: "firstName", ownerElement: element};75 const provider = await parseAttribute(attr, {firstName: "John"});76 expect(provider).not.toBeNull();77 expect(provider.constructor.name).toBe("CallProvider");78 expect(provider._element).not.toBeNull();79 expect(provider._context).not.toBeNull();80 expect(provider._property).not.toBeNull();81 expect(provider._value).not.toBeNull();82});83test("releaseBinding", async () => {84 crsbinding.providerManager.releaseElement = jest.fn();85 await releaseBinding(element);86 expect(crsbinding.providerManager.releaseElement).toBeCalled();...
parse-attribute.js
Source:parse-attribute.js
1var test = require('tape');2var parseAttribute = require('../../../src/helpers/dom/parse-attribute');3var el = document.createElement('div');4el.innerHTML = '<div min="50" data-bool data-bool-val="true" data-bool-val2="false" data-val3="sdf"></div>';5var el2 = el.children[0];6test('should parse boolean attributes or fall back to a default value.', function(t) {7 t.ok(parseAttribute.boolean(el2, 'data-bool'), 'attribute existing is considered true');8 t.ok(parseAttribute.boolean(el2, 'data-bool-val'), 'attribute set to "true" is considered true');9 t.notOk(parseAttribute.boolean(el2, 'data-bool-val2'), 'attribute set to "false" is considered false');10 t.notOk(parseAttribute.boolean(el2, 'data-val3'), 'attribute set to "sdf" is considered false');11 t.notOk(parseAttribute.boolean(el2, 'data-not', false), 'falls back to default value');12 t.end();13});14test('should parse numeric attributes or fall back to a default value.', function(t) {15 t.equal(parseAttribute.number(el2, 'min'), 50, 'parses a number');16 t.equal(parseAttribute.number(el2, 'max', 100), 100, 'returns a default numeric value');17 t.end();18});19test('should parse numeric attributes or fall back to a default value.', function(t) {20 t.equal(parseAttribute.string(el2, 'data-val3'), 'sdf', 'parses a string');21 t.equal(parseAttribute.string(el2, 'data-val4', 'aaa'), 'aaa', 'returns a default string value');22 t.end();...
parse.test.js
Source:parse.test.js
2 var parseAttribute = require( 'saber-ui/parse' ).parseAttribute;3 describe( 'parse', function() {4 it( '`parseAttribute`', function () {5 var source = 'type: MyControl; id: foo; name: bar; age: 99;';6 var obj = parseAttribute( source );7 expect(8 Object.prototype.toString.call( obj )9 ).toEqual( '[object Object]' );10 expect( obj.type ).toEqual( 'MyControl' );11 expect( obj.id ).toEqual( 'foo' );12 expect( obj.name ).toEqual( 'bar' );13 expect( obj.age ).toEqual( '99' );14 var source2 = 'type: MyControl; id: foo;name: bar';15 var obj2 = parseAttribute( source2 );16 expect(17 Object.prototype.toString.call( obj2 )18 ).toEqual( '[object Object]' );19 expect( obj.type ).toEqual( 'MyControl' );20 expect( obj.id ).toEqual( 'foo' );21 expect( obj.name ).toEqual( 'bar' );22 });23 });...
testEsprima.js
Source:testEsprima.js
...9var file = fs.readFileSync(fn,"utf8");10var ast = esprima.parse(file, { comment: true });11console.log(JSON.stringify(ast));12/*13 var a = jsdocgen.parseAttribute("params", {name : "A" , type : "Number", description : "ciao mondo "});14 var b = jsdocgen.parseAttribute("params", {name : "A" });15 var c = jsdocgen.parseAttribute("returns", {name : "A" , type : "Number", description : "ciao mondo "});16 var attributes = [17 {18 attributeName: "params",19 args: {name: "A", type: "Number", description: "ciao mondo sono un parametro"}20 },21 {22 attributeName: "params",23 args: {name: "B"}24 },25 {26 attributeName: "returns",27 args: {name : "A" , type : "Number|Array", description : "ciao mondo sono un Return "}28 }29 ];...
loadImage.js
Source:loadImage.js
2 function loadImageInternally(elem, width, height) {3 function fits(data) {4 return data.w >= width && (height === 0 || data.h >= height)5 }6 const cur = parseAttribute(elem, "cur") || {w: -1, h: -1}7 if (fits(cur)) return cur;8 const sizes = elem.getAttribute("data-sizes")9 for (let i = 0; i < sizes; i++) {10 const data = parseAttribute(elem, "data-" + i);11 if (fits(data)) {12 elem.cur = data13 return data14 }15 }16 elem.cur = parseAttribute(elem, "data-" + (sizes - 1));17 return elem.cur18 }19 function parseAttribute(elem, attr) {20 if (typeof elem[attr] === "object")21 return elem[attr];22 return elem[attr] = JSON.parse(elem.getAttribute(attr));23 }24 return loadImageInternally;...
parseAttribute.test.js
Source:parseAttribute.test.js
1import parseAttribute from "../lib/parseAttribute";2test('parseAttribute', () => {3 const attr = parseAttribute('a');4 expect(attr).toEqual([ 'a', undefined, undefined ]);5});6test('parseAttribute', () => {7 const attr = parseAttribute('a.b');8 expect(attr).toEqual([ 'a', 'b', undefined ]);9});10test('parseAttribute', () => {11 const attr = parseAttribute('a.b:c');12 expect(attr).toEqual([ 'a', 'b', 'c' ]);...
Using AI Code Generation
1const { parseAttribute } = require('playwright/lib/utils/utils');2const { parseSelector } = require('playwright/lib/utils/utils');3const selector = parseSelector('text="Login"');4const attribute = parseAttribute('data-testid');5console.log(selector);6console.log(attribute);
Using AI Code Generation
1const { parseAttribute } = require('playwright/lib/server/supplements/utils/attributes');2const { parseSelector } = require('playwright/lib/server/supplements/utils/selectors');3const { parseSelectorList } = require('playwright/lib/server/supplements/utils/selectors');4const { parseWaitForOptions } = require('playwright/lib/server/supplements/utils/timeoutSettings');5const { waitForEvent } = require('playwright/lib/server/supplements/utils/helper');6const { TimeoutError } = require('playwright/lib/server/supplements/utils/errors');7const { debugError } = require('playwright/lib/server/supplements/utils/debug');8const { debugLogger } = require('playwright/lib/server/supplements/utils/debug');9const { debugServer } = require('playwright/lib/server/supplements/utils/debug');10const { debugTest } = require('playwright/lib/server/supplements/utils/debug');11const { debugWorker } = require('playwright/lib/server/supplements/utils/debug');12const { debugBrowser } = require('playwright/lib/server/supplements/utils/debug');13const { debugPage } = require('playwright/lib/server/supplements/utils/debug');14const { debugFrame } = require('playwright/lib/server/supplements/utils/debug');15const { debugElement } = require('playwright/lib/server/supplements/utils/debug');16const { debugSelector } = require('playwright/lib/server/supplements/utils/debug');17const { debugAction } = require('playwright/lib/server/supplements/utils/debug');18const { debug } = require('playwright/lib/server/supplements/utils/debug');19const { debugScope } = require('playwright/lib/server/supplements/utils/debug');20const { debugLog } = require('playwright/lib/server/supplements/utils/debug');21const { debugErrorLog } = require('playwright/lib/server/supplements/utils/debug');22const { debugInfoLog } = require('playwright/lib/server/supplements/utils/debug');23const { debugWarnLog } = require('playwright/lib/server/supplements/utils/debug');24const { debugAssertLog } = require('playwright/lib/server/supplements/utils/debug');25const { debugDir } = require('playwright/lib/server/supplements/utils/debug');26const { debugDirxml } = require('playwright/lib/server/supplements/utils/debug');27const { debugTable } = require('playwright/lib/server/supplements/utils/debug
Using AI Code Generation
1const { parseAttribute } = require('playwright/lib/server/utils');2const value = parseAttribute('foo', 'foo="bar"');3const { parseAttributes } = require('playwright/lib/server/utils');4const value = parseAttributes('foo', 'foo="bar"');5const { parseAttributes } = require('playwright/lib/server/utils');6const value = parseAttributes('foo', 'foo="bar"');7const { parseAttributes } = require('playwright/lib/server/utils');8const value = parseAttributes('foo', 'foo="bar"');9const { parseAttributes } = require('playwright/lib/server/utils');10const value = parseAttributes('foo', 'foo="bar"');11const { parseAttributes } = require('playwright/lib/server/utils');12const value = parseAttributes('foo', 'foo="bar"');13const { parseAttributes } = require('playwright/lib/server/utils');14const value = parseAttributes('foo', 'foo="bar"');15const { parseAttributes } = require('playwright/lib/server/utils');16const value = parseAttributes('foo', 'foo="bar"');17const { parseAttributes } = require('playwright/lib/server/utils');18const value = parseAttributes('foo', 'foo="bar"');19const { parseAttributes } = require('playwright/lib/server/utils');20const value = parseAttributes('foo', 'foo="bar"');21const { parseAttributes } = require('playwright/lib/server/utils');
Using AI Code Generation
1const { parseAttribute } = require('playwright/lib/server/frames');2console.log(parseAttribute('test', 'test'));3console.log(parseAttribute('test', 'test"'));4console.log(parseAttribute('test', 'test"test'));5console.log(parseAttribute('test', 'test"test"'));6console.log(parseAttribute('test', 'test"test"test'));7console.log(parseAttribute('test', 'test"test"test"'));8console.log(parseAttribute('test', 'test"test"test""'));9console.log(parseAttribute('test', 'test"test"test""test'));10console.log(parseAttribute('test', 'test"test"test""test"'));11console.log(parseAttribute('test', 'test"test"test""test""'));12console.log(parseAttribute('test', 'test"test"test""test""test'));13console.log(parseAttribute('test', 'test"test"test""test""test"'));14console.log(parseAttribute('test', 'test"test"test""test""test""'));15console.log(parseAttribute('test', 'test"test"test""test""test"""'));16console.log(parseAttribute('test', 'test"test"test""test""test"""test'));17console.log(parseAttribute('test', 'test"test"test""test""test"""test"'));18console.log(parseAttribute('test', 'test"test"test""test""test"""test""'));19console.log(parseAttribute('test', 'test"test
Playwright tutorial
LambdaTest’s Playwright tutorial will give you a broader idea about the Playwright automation framework, its unique features, and use cases with examples to exceed your understanding of Playwright testing. This tutorial will give A to Z guidance, from installing the Playwright framework to some best practices and advanced concepts.
Chapters:
- What is Playwright : Playwright is comparatively new but has gained good popularity. Get to know some history of the Playwright with some interesting facts connected with it.
- How To Install Playwright : Learn in detail about what basic configuration and dependencies are required for installing Playwright and run a test. Get a step-by-step direction for installing the Playwright automation framework.
- Playwright Futuristic Features: Launched in 2020, Playwright gained huge popularity quickly because of some obliging features such as Playwright Test Generator and Inspector, Playwright Reporter, Playwright auto-waiting mechanism and etc. Read up on those features to master Playwright testing.
- What is Component Testing: Component testing in Playwright is a unique feature that allows a tester to test a single component of a web application without integrating them with other elements. Learn how to perform Component testing on the Playwright automation framework.
- Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
- Functions and Selectors in Playwright: Learn how to launch the Chromium browser with Playwright. Also, gain a better understanding of some important functions like “BrowserContext,” which allows you to run multiple browser sessions, and “newPage” which interacts with a page.
- Handling Alerts and Dropdowns in Playwright : Playwright interact with different types of alerts and pop-ups, such as simple, confirmation, and prompt, and different types of dropdowns, such as single selector and multi-selector get your hands-on with handling alerts and dropdown in Playright testing.
- Playwright vs Puppeteer: Get to know about the difference between two testing frameworks and how they are different than one another, which browsers they support, and what features they provide.
- Run Playwright Tests on LambdaTest: Playwright testing with LambdaTest leverages test performance to the utmost. You can run multiple Playwright tests in Parallel with the LammbdaTest test cloud. Get a step-by-step guide to run your Playwright test on the LambdaTest platform.
- Playwright Python Tutorial: Playwright automation framework support all major languages such as Python, JavaScript, TypeScript, .NET and etc. However, there are various advantages to Python end-to-end testing with Playwright because of its versatile utility. Get the hang of Playwright python testing with this chapter.
- Playwright End To End Testing Tutorial: Get your hands on with Playwright end-to-end testing and learn to use some exciting features such as TraceViewer, Debugging, Networking, Component testing, Visual testing, and many more.
- Playwright Video Tutorial: Watch the video tutorials on Playwright testing from experts and get a consecutive in-depth explanation of Playwright automation testing.
Run Playwright Internal automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
