How to use updateProps method in Playwright Internal

Best JavaScript code snippet using playwright-internal

cpu-grid-layer.spec.js

Source:cpu-grid-layer.spec.js Github

copy

Full Screen

1// Copyright (c) 2015 - 2017 Uber Technologies, Inc.2//3// Permission is hereby granted, free of charge, to any person obtaining a copy4// of this software and associated documentation files (the "Software"), to deal5// in the Software without restriction, including without limitation the rights6// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell7// copies of the Software, and to permit persons to whom the Software is8// furnished to do so, subject to the following conditions:9//10// The above copyright notice and this permission notice shall be included in11// all copies or substantial portions of the Software.12//13// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR14// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,15// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE16// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER17// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,18// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN19// THE SOFTWARE.20import test from 'tape-catch';21import {makeSpy} from '@probe.gl/test-utils';22import * as FIXTURES from 'deck.gl-test/data';23import {testLayer, testInitializeLayer, generateLayerTests} from '@deck.gl/test-utils';24import {GridCellLayer} from '@deck.gl/layers';25import {CPUGridLayer} from '@deck.gl/aggregation-layers';26test('CPUGridLayer', t => {27 const testCases = generateLayerTests({28 Layer: CPUGridLayer,29 sampleProps: {30 data: FIXTURES.points.slice(0, 3),31 getPosition: d => d.COORDINATES32 },33 assert: t.ok,34 onBeforeUpdate: ({testCase}) => t.comment(testCase.title),35 onAfterUpdate({layer}) {36 if (layer.props.data && layer.props.data.length) {37 t.ok(38 layer.state.aggregatorState.layerData.data.length > 0,39 'should update state.layerData'40 );41 }42 }43 });44 testLayer({Layer: CPUGridLayer, testCases, onError: t.notOk});45 t.end();46});47test('CPUGridLayer#renderSubLayer', t => {48 makeSpy(CPUGridLayer.prototype, '_onGetSublayerColor');49 makeSpy(CPUGridLayer.prototype, '_onGetSublayerElevation');50 const layer = new CPUGridLayer({51 data: FIXTURES.points,52 cellSize: 500,53 getPosition: d => d.COORDINATES,54 pickable: true55 });56 testInitializeLayer({layer, onError: t.notOk});57 // render sublayer58 const subLayer = layer.renderLayers();59 testInitializeLayer({layer: subLayer, onError: t.notOk});60 t.ok(subLayer instanceof GridCellLayer, 'GridCellLayer rendered');61 // should call attribute updater twice62 // because test util calls both initialize and update layer63 t.ok(CPUGridLayer.prototype._onGetSublayerColor.called, 'should call _onGetSublayerColor');64 t.ok(65 CPUGridLayer.prototype._onGetSublayerElevation.called,66 'should call _onGetSublayerElevation'67 );68 CPUGridLayer.prototype._onGetSublayerColor.restore();69 CPUGridLayer.prototype._onGetSublayerElevation.restore();70 t.end();71});72test('CPUGridLayer#updates', t => {73 // assert on state property updates after layer.prop change74 function assertStateUpdate(shouldUpdate, prop) {75 return function onAfterUpdate({layer, oldState: oldLayerState}) {76 function checkIfUpdated(state, oldState, shouldUpdateItem, previousKeys) {77 if (typeof shouldUpdateItem === 'object') {78 for (const key in shouldUpdateItem) {79 checkIfUpdated(80 state[key],81 oldState[key],82 shouldUpdateItem[key],83 `${previousKeys}.${key}`84 );85 }86 } else {87 t.ok(88 shouldUpdateItem ? state !== oldState : state === oldState,89 `update props.${prop} should ${!shouldUpdateItem ? 'not' : ''} update ${previousKeys}`90 );91 }92 }93 checkIfUpdated(94 layer.state.aggregatorState,95 oldLayerState.aggregatorState,96 shouldUpdate,97 'aggregatorState'98 );99 };100 }101 function getChecksForCellSizeChange() {102 const shouldUpdate = {103 layerData: true,104 dimensions: {105 fillColor: {106 sortedBins: true,107 valueDomain: true,108 getValue: false,109 scaleFunc: true110 },111 elevation: {112 sortedBins: true,113 valueDomain: true,114 getValue: false,115 scaleFunc: true116 }117 }118 };119 return assertStateUpdate(shouldUpdate, 'cellSize');120 }121 function getChecksForFilterChange(triggered) {122 const shouldUpdate = {123 layerData: false,124 dimensions: {125 fillColor: {126 sortedBins: triggered,127 valueDomain: triggered,128 getValue: triggered,129 scaleFunc: triggered130 },131 elevation: {132 sortedBins: triggered,133 valueDomain: triggered,134 getValue: triggered,135 scaleFunc: triggered136 }137 }138 };139 return assertStateUpdate(shouldUpdate, '_filterData');140 }141 function getChecksForPositionChange(triggerChange) {142 const shouldUpdate = {143 layerData: triggerChange,144 dimensions: {145 fillColor: {146 sortedBins: triggerChange,147 valueDomain: triggerChange,148 getValue: false,149 scaleFunc: triggerChange150 },151 elevation: {152 sortedBins: triggerChange,153 valueDomain: triggerChange,154 getValue: false,155 scaleFunc: triggerChange156 }157 }158 };159 return assertStateUpdate(160 shouldUpdate,161 `getPosition ${triggerChange ? 'w/' : 'w/o'} trigger change`162 );163 }164 function getCheckForNoBinChange(accessor, dimension) {165 const update = dimension;166 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);167 const shouldUpdate = {168 layerData: false,169 dimensions: {170 [update]: {171 sortedBins: false,172 valueDomain: false,173 getValue:174 accessor === 'getColorValue w/o trigger' ||175 accessor === 'getElevationValue w/o trigger',176 scaleFunc: false177 },178 [noUpdate]: {179 sortedBins: false,180 valueDomain: false,181 getValue: false,182 scaleFunc: false183 }184 }185 };186 return assertStateUpdate(shouldUpdate, accessor);187 }188 function getCheckForTriggeredBinUpdate(accessor, dimension) {189 const update = dimension;190 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);191 const shouldUpdate = {192 layerData: false,193 dimensions: {194 [update]: {195 sortedBins: true,196 valueDomain: true,197 getValue: true,198 scaleFunc: true199 },200 [noUpdate]: {201 sortedBins: false,202 valueDomain: false,203 getValue: false,204 scaleFunc: false205 }206 }207 };208 return assertStateUpdate(shouldUpdate, accessor);209 }210 function getChecksForPercentileUpdate(side, dimension) {211 const update = dimension;212 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);213 const shouldUpdate = {214 layerData: false,215 dimensions: {216 [update]: {217 sortedBins: false,218 valueDomain: true,219 getValue: false,220 scaleFunc: true221 },222 [noUpdate]: {223 sortedBins: false,224 valueDomain: false,225 getValue: false,226 scaleFunc: false227 }228 }229 };230 return assertStateUpdate(shouldUpdate, `${side}Percentile`);231 }232 function getChecksForDomainOrRangeUpdate(prop, dimension) {233 const update = dimension;234 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);235 const shouldUpdate = {236 layerData: false,237 dimensions: {238 [update]: {239 sortedBins: false,240 valueDomain: false,241 getValue: false,242 scaleFunc: true243 },244 [noUpdate]: {245 sortedBins: false,246 valueDomain: false,247 getValue: false,248 scaleFunc: false249 }250 }251 };252 return assertStateUpdate(shouldUpdate, `${dimension}${prop}`);253 }254 function getChecksForColorScaleTypeQuantize(scaleType) {255 const shouldUpdate = {256 dimensions: {257 colorScaleType: 'quantize'258 }259 };260 t.ok(261 shouldUpdate.dimensions.colorScaleType === scaleType,262 `update aggregatorState.dimension.colorScaleType to ${scaleType}`263 );264 }265 function getChecksForColorScaleTypeLinear(scaleType) {266 const shouldUpdate = {267 dimensions: {268 colorScaleType: 'linear'269 }270 };271 t.ok(272 shouldUpdate.dimensions.colorScaleType === scaleType,273 `update aggregatorState.dimension.colorScaleType to ${scaleType}`274 );275 }276 function getChecksForColorScaleTypeQuantile(scaleType) {277 const shouldUpdate = {278 dimensions: {279 colorScaleType: 'quantile'280 }281 };282 t.ok(283 shouldUpdate.dimensions.colorScaleType === scaleType,284 `update aggregatorState.dimension.colorScaleType to ${scaleType}`285 );286 }287 function getChecksForColorScaleTypeOrdinal(scaleType) {288 const shouldUpdate = {289 dimensions: {290 colorScaleType: 'ordinal'291 }292 };293 return t.ok(294 shouldUpdate.dimensions.colorScaleType === scaleType,295 `update aggregatorState.dimension.colorScaleType to ${scaleType}`296 );297 }298 testLayer({299 Layer: CPUGridLayer,300 onError: t.notOk,301 testCases: [302 {303 props: {304 data: FIXTURES.points,305 cellSize: 400,306 getPosition: d => d.COORDINATES,307 pickable: true308 },309 onAfterUpdate({layer}) {310 const {311 layerData,312 dimensions: {fillColor, elevation}313 } = layer.state.aggregatorState;314 t.ok(layerData.data.length > 0, 'aggregatorState.dimensions.layerDate calculated');315 t.ok(316 fillColor.sortedBins,317 'aggregatorState.dimensions.fillColor.sortedColorBins calculated'318 );319 t.ok(320 elevation.sortedBins,321 'aggregatorState.dimensions.elevation.sortedColorBins calculated'322 );323 t.ok(324 Array.isArray(fillColor.valueDomain),325 'aggregatorState.dimensions.fillColor.valueDomain calculated'326 );327 t.ok(328 Array.isArray(elevation.valueDomain),329 'aggregatorState.dimensions.elevation.valueDomain calculated'330 );331 t.ok(332 typeof fillColor.getValue === 'function',333 'aggregatorState.dimensions.fillColor.getValue calculated'334 );335 t.ok(336 typeof elevation.getValue === 'function',337 'aggregatorState.dimension.elevation.getValue calculated'338 );339 t.ok(340 Array.isArray(fillColor.sortedBins.aggregatedBins),341 'aggregatorState.dimension.fillColor.sortedBins.aggregatedBins calculated'342 );343 t.ok(344 Array.isArray(elevation.sortedBins.aggregatedBins),345 'aggregatorState.dimension.elevation.sortedBins.aggregatedBins calculated'346 );347 const firstSortedBin = fillColor.sortedBins.sortedBins[0];348 const binToCell = layerData.data.find(d => d.index === firstSortedBin.i);349 t.ok(350 fillColor.sortedBins.binMap[binToCell.index] === firstSortedBin,351 'Correct aggregatorState.dimension.fillColor.sortedBins.binMap created'352 );353 }354 },355 {356 updateProps: {357 _filterData: pt => pt.SPACES >= 4 && pt.SPACES <= 10358 },359 onAfterUpdate: ({layer, oldState}) => {360 getChecksForFilterChange(false)({layer, oldState});361 const {layerData} = layer.state.aggregatorState;362 const isPointFiltered = layerData.data.every(bin => bin.filteredPoints === null);363 t.ok(isPointFiltered, 'filteredPoints in bins should be reset to null');364 }365 },366 {367 updateProps: {368 _filterData: pt => pt.SPACES >= 4 && pt.SPACES <= 10,369 updateTriggers: {370 _filterData: 1371 }372 },373 onAfterUpdate: ({layer, oldState}) => {374 getChecksForFilterChange(true)({layer, oldState});375 const {376 layerData,377 dimensions: {fillColor, elevation}378 } = layer.state.aggregatorState;379 const isPointFiltered = layerData.data.every(bin =>380 bin.filteredPoints.every(pt => pt.SPACES >= 4 && pt.SPACES <= 10)381 );382 t.ok(isPointFiltered, 'filteredPoints in bins should be correct');383 t.ok(384 fillColor.sortedBins,385 'aggregatorState.dimensions.fillColor.sortedColorBins calculated'386 );387 t.ok(388 elevation.sortedBins,389 'aggregatorState.dimensions.elevation.sortedColorBins calculated'390 );391 }392 },393 {394 updateProps: {395 _filterData: null,396 updateTriggers: {397 _filterData: 0398 }399 },400 onAfterUpdate: ({layer, oldState}) => {401 getChecksForFilterChange(true)({layer, oldState});402 const {layerData} = layer.state.aggregatorState;403 const isPointFiltered = layerData.data.every(bin => bin.filteredPoints === null);404 t.ok(isPointFiltered, 'filteredPoints in bins should be reset to null');405 }406 },407 {408 updateProps: {409 cellSize: 800410 },411 onAfterUpdate: getChecksForCellSizeChange()412 },413 {414 updateProps: {415 getPosition: d => d.COORDINATES416 },417 onAfterUpdate: getChecksForPositionChange(false)418 },419 {420 updateProps: {421 getPosition: d => d.COORDINATES,422 updateTriggers: {423 getPosition: 1424 }425 },426 onAfterUpdate: getChecksForPositionChange(true)427 },428 {429 updateProps: {430 getColorWeight: x => 2431 },432 onAfterUpdate: getCheckForNoBinChange('getColorWeight w/o trigger', 'fillColor')433 },434 {435 updateProps: {436 getColorWeight: x => 2,437 updateTriggers: {438 getColorWeight: 1439 }440 },441 onAfterUpdate: getCheckForTriggeredBinUpdate('getColorWeight w/ trigger', 'fillColor')442 },443 {444 updateProps: {445 getColorValue: x => 2446 },447 onAfterUpdate: getCheckForNoBinChange('getColorValue w/o trigger', 'fillColor')448 },449 {450 updateProps: {451 getColorValue: x => 2,452 updateTriggers: {453 getColorValue: 1454 }455 },456 onAfterUpdate: getCheckForTriggeredBinUpdate('getColorValue w/ trigger', 'fillColor')457 },458 {459 updateProps: {460 colorAggregation: 'MEAN',461 getColorValue: null462 },463 onAfterUpdate: getCheckForTriggeredBinUpdate(464 'colorAggregation w/o getColorValue',465 'fillColor'466 )467 },468 {469 updateProps: {470 upperPercentile: 90471 },472 onAfterUpdate: getChecksForPercentileUpdate('upper', 'fillColor')473 },474 {475 updateProps: {476 lowerPercentile: 90477 },478 onAfterUpdate: getChecksForPercentileUpdate('lower', 'fillColor')479 },480 {481 updateProps: {482 colorDomain: [0, 10]483 },484 onAfterUpdate: getChecksForDomainOrRangeUpdate('Domain', 'fillColor')485 },486 {487 updateProps: {488 colorRange: [[1, 1, 1], [2, 2, 2], [3, 3, 3]]489 },490 onAfterUpdate: getChecksForDomainOrRangeUpdate('Range', 'fillColor')491 },492 {493 updateProps: {494 getElevationWeight: x => 2495 },496 onAfterUpdate: getCheckForNoBinChange('getElevationWeight', 'elevation')497 },498 {499 updateProps: {500 getElevationWeight: x => 2,501 updateTriggers: {502 getElevationWeight: 1503 }504 },505 onAfterUpdate: getCheckForTriggeredBinUpdate('getElevationWeight', 'elevation')506 },507 {508 updateProps: {509 getElevationValue: x => 2510 },511 onAfterUpdate: getCheckForNoBinChange('getElevationValue w/o trigger', 'elevation')512 },513 {514 updateProps: {515 getElevationValue: x => 2,516 updateTriggers: {517 getElevationValue: 1518 }519 },520 onAfterUpdate: getCheckForTriggeredBinUpdate('getElevationValue', 'elevation')521 },522 {523 updateProps: {524 elevationAggregation: 'MEAN',525 getElevationValue: null526 },527 onAfterUpdate: getCheckForTriggeredBinUpdate('elevationAggregation', 'elevation')528 },529 {530 updateProps: {531 elevationUpperPercentile: 80532 },533 onAfterUpdate: getChecksForPercentileUpdate('elevationUpper', 'elevation')534 },535 {536 updateProps: {537 elevationLowerPercentile: 10538 },539 onAfterUpdate: getChecksForPercentileUpdate('elevationLower', 'elevation')540 },541 {542 updateProps: {543 elevationRange: [1, 10]544 },545 onAfterUpdate: getChecksForDomainOrRangeUpdate('Range', 'elevation')546 },547 {548 updateProps: {549 elevationDomain: [0, 10]550 },551 onAfterUpdate: getChecksForDomainOrRangeUpdate('Domain', 'elevation')552 },553 {554 updateProps: {555 colorScaleType: 'quantize'556 },557 onAfterUpdate: getChecksForColorScaleTypeQuantize('quantize')558 },559 {560 updateProps: {561 colorScaleType: 'linear'562 },563 onAfterUpdate: getChecksForColorScaleTypeLinear('linear')564 },565 {566 updateProps: {567 colorScaleType: 'quantile'568 },569 onAfterUpdate: getChecksForColorScaleTypeQuantile('quantile')570 },571 {572 updateProps: {573 colorScaleType: 'ordinal'574 },575 onAfterUpdate: getChecksForColorScaleTypeOrdinal('ordinal')576 }577 ]578 });579 t.end();580});581test('CPUGridLayer#updateTriggers', t => {582 // setup spies583 const SPIES = ['_onGetSublayerColor', '_onGetSublayerElevation'];584 function getSublayerAttributeUpdateCheck(prop, result = {}) {585 return function onAfterUpdate({subLayer, spies}) {586 t.ok(587 result.color ? spies._onGetSublayerColor.called : !spies._onGetSublayerColor.called,588 `update ${prop} should ${result.color ? '' : 'not'} call _onGetSublayerColor`589 );590 t.ok(591 result.elevation592 ? spies._onGetSublayerElevation.called593 : !spies._onGetSublayerElevation.called,594 `update ${prop} should ${result.elevation ? '' : 'not'} call _onGetSublayerElevation`595 );596 };597 }598 testLayer({599 Layer: CPUGridLayer,600 spies: SPIES,601 onError: t.notOk,602 testCases: [603 {604 props: {605 data: FIXTURES.points,606 cellSize: 400,607 getColorValue: d => 3,608 getElevationValue: d => 4,609 getPosition: d => d.COORDINATES610 }611 },612 {613 updateProps: {614 cellSize: 800615 },616 onAfterUpdate: getSublayerAttributeUpdateCheck('cellSize', {color: true, elevation: true})617 },618 {619 updateProps: {620 opacity: 0.1621 },622 onAfterUpdate: getSublayerAttributeUpdateCheck('opacity', {color: false, elevation: false})623 },624 {625 updateProps: {626 coverage: 0.1627 },628 onAfterUpdate: getSublayerAttributeUpdateCheck('coverage', {color: false, elevation: false})629 },630 {631 updateProps: {632 extruded: true633 },634 onAfterUpdate: getSublayerAttributeUpdateCheck('extruded', {color: false, elevation: false})635 },636 {637 updateProps: {638 getColorWeight: x => 2639 },640 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorWeight w/o triggers', {641 color: false,642 elevation: false643 })644 },645 {646 updateProps: {647 getColorWeight: x => 2,648 updateTriggers: {649 getColorWeight: 1650 }651 },652 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorWeight w triggers', {653 color: true,654 elevation: false655 })656 },657 {658 updateProps: {659 getColorWeight: x => 3660 },661 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorWeight w/o triggers', {662 color: false,663 elevation: false664 })665 },666 {667 updateProps: {668 getColorValue: x => 2669 },670 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue null to assigned ', {671 color: false,672 elevation: false673 })674 },675 // {676 // updateProps: {677 // getColorValue: x => 3678 // },679 // onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue w/o triggers', {680 // color: false,681 // elevation: false682 // })683 // },684 {685 updateProps: {686 getColorValue: x => 4,687 updateTriggers: {688 getColorValue: 1689 }690 },691 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue w triggers', {692 color: true,693 elevation: false694 })695 },696 {697 updateProps: {698 getColorValue: x => 4,699 updateTriggers: {700 getColorValue: {701 a: 1,702 b: 2703 }704 }705 },706 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue w triggers as object', {707 color: true,708 elevation: false709 })710 },711 {712 updateProps: {713 getColorValue: x => 4,714 updateTriggers: {715 getColorValue: {716 a: 1,717 b: 2718 }719 }720 },721 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue w triggers as object', {722 color: false,723 elevation: false724 })725 },726 {727 updateProps: {728 getColorValue: x => 4,729 updateTriggers: {730 getColorValue: {731 a: 2,732 b: 2733 }734 }735 },736 onAfterUpdate: getSublayerAttributeUpdateCheck(737 'getColorValue w triggers as changed object',738 {739 color: true,740 elevation: false741 }742 )743 },744 {745 updateProps: {746 upperPercentile: 90747 },748 onAfterUpdate: getSublayerAttributeUpdateCheck('upperPercentile', {749 color: true,750 elevation: false751 })752 },753 {754 updateProps: {755 lowerPercentile: 10756 },757 onAfterUpdate: getSublayerAttributeUpdateCheck('lowerPercentile', {758 color: true,759 elevation: false760 })761 },762 {763 updateProps: {764 colorDomain: [10, 20]765 },766 onAfterUpdate: getSublayerAttributeUpdateCheck('colorDomain', {767 color: true,768 elevation: false769 })770 },771 {772 updateProps: {773 colorRange: [[1, 2, 3], [2, 3, 4], [3, 4, 5]]774 },775 onAfterUpdate: getSublayerAttributeUpdateCheck('colorRange', {776 color: true,777 elevation: false778 })779 },780 {781 updateProps: {782 elevationAggregation: 'MEAN'783 },784 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationAggregation', {785 color: false,786 elevation: true787 })788 },789 {790 updateProps: {791 getElevationWeight: x => 2792 },793 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationWeight w/o triggers', {794 color: false,795 elevation: false796 })797 },798 {799 updateProps: {800 getElevationWeight: x => 2,801 updateTriggers: {802 getElevationWeight: 1,803 // persist color updateTriggers to avoid triggering color update804 getColorValue: 1805 }806 },807 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationWeight w triggers', {808 color: true,809 elevation: true810 })811 },812 {813 updateProps: {814 getElevationWeight: x => 3815 },816 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationWeight w/o triggers', {817 color: false,818 elevation: false819 })820 },821 {822 updateProps: {823 getElevationValue: x => 2824 },825 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationValue null to assigned', {826 color: false,827 elevation: false828 })829 },830 {831 updateProps: {832 getElevationValue: x => 3833 },834 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationValue w/o triggers', {835 color: false,836 elevation: false837 })838 },839 {840 updateProps: {841 getElevationValue: x => 4,842 updateTriggers: {843 getElevationValue: 1,844 // persist getColorValue update triggers845 getColorValue: 1846 }847 },848 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationValue w triggers', {849 color: false,850 elevation: true851 })852 },853 {854 updateProps: {855 elevationUpperPercentile: 90856 },857 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationUpperPercentile', {858 color: false,859 elevation: true860 })861 },862 {863 updateProps: {864 elevationLowerPercentile: 10865 },866 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationLowerPercentile', {867 color: false,868 elevation: true869 })870 },871 {872 updateProps: {873 elevationDomain: [10, 20]874 },875 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationDomain', {876 color: false,877 elevation: true878 })879 },880 {881 updateProps: {882 elevationRange: [2, 20]883 },884 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationRange', {885 color: false,886 elevation: true887 })888 }889 ]890 });891 t.end();...

Full Screen

Full Screen

hexagon-layer.spec.js

Source:hexagon-layer.spec.js Github

copy

Full Screen

1// Copyright (c) 2015 - 2017 Uber Technologies, Inc.2//3// Permission is hereby granted, free of charge, to any person obtaining a copy4// of this software and associated documentation files (the "Software"), to deal5// in the Software without restriction, including without limitation the rights6// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell7// copies of the Software, and to permit persons to whom the Software is8// furnished to do so, subject to the following conditions:9//10// The above copyright notice and this permission notice shall be included in11// all copies or substantial portions of the Software.12//13// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR14// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,15// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE16// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER17// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,18// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN19// THE SOFTWARE.20import test from 'tape-catch';21import {makeSpy} from '@probe.gl/test-utils';22import * as data from 'deck.gl-test/data';23import {testLayer, testInitializeLayer, generateLayerTests} from '@deck.gl/test-utils';24import {ColumnLayer} from '@deck.gl/layers';25import {HexagonLayer} from '@deck.gl/aggregation-layers';26test('HexagonLayer', t => {27 const testCases = generateLayerTests({28 Layer: HexagonLayer,29 sampleProps: {30 data: data.points.slice(0, 3),31 getPosition: d => d.COORDINATES32 },33 assert: t.ok,34 onBeforeUpdate: ({testCase}) => t.comment(testCase.title),35 onAfterUpdate({layer}) {36 if (layer.props.data && layer.props.data.length) {37 t.ok(layer.state.aggregatorState.layerData.data.length > 0, 'should update state.hexagons');38 }39 }40 });41 testLayer({Layer: HexagonLayer, testCases, onError: t.notOk});42 t.end();43});44// props to initialize layer with45// update props46// asserts on the resulting layer47test('HexagonLayer#updateLayer', t => {48 // assert on state property updates after layer.prop change49 function assertStateUpdate(shouldUpdate, prop) {50 return function onAfterUpdate({layer, oldState: oldLayerState}) {51 function checkIfUpdated(state, oldState, shouldUpdateItem, previousKeys) {52 if (typeof shouldUpdateItem === 'object') {53 for (const key in shouldUpdateItem) {54 checkIfUpdated(55 state[key],56 oldState[key],57 shouldUpdateItem[key],58 `${previousKeys}.${key}`59 );60 }61 } else {62 t.ok(63 shouldUpdateItem ? state !== oldState : state === oldState,64 `update props.${prop} should ${!shouldUpdateItem ? 'not' : ''} update ${previousKeys}`65 );66 }67 }68 checkIfUpdated(69 layer.state.aggregatorState,70 oldLayerState.aggregatorState,71 shouldUpdate,72 'aggregatorState'73 );74 };75 }76 function getChecksForFilterChange(triggered) {77 const shouldUpdate = {78 layerData: false,79 dimensions: {80 fillColor: {81 sortedBins: triggered,82 valueDomain: triggered,83 getValue: triggered,84 scaleFunc: triggered85 },86 elevation: {87 sortedBins: triggered,88 valueDomain: triggered,89 getValue: triggered,90 scaleFunc: triggered91 }92 }93 };94 return assertStateUpdate(shouldUpdate, 'getFitlerBy');95 }96 function getChecksForRadiusChange() {97 const shouldUpdate = {98 layerData: true,99 dimensions: {100 fillColor: {101 sortedBins: true,102 valueDomain: true,103 getValue: false,104 scaleFunc: true105 },106 elevation: {107 sortedBins: true,108 valueDomain: true,109 getValue: false,110 scaleFunc: true111 }112 }113 };114 return assertStateUpdate(shouldUpdate, 'radius');115 }116 function getChecksForPositionChange(triggerChange) {117 const shouldUpdate = {118 layerData: triggerChange,119 dimensions: {120 fillColor: {121 sortedBins: triggerChange,122 valueDomain: triggerChange,123 getValue: false,124 scaleFunc: triggerChange125 },126 elevation: {127 sortedBins: triggerChange,128 valueDomain: triggerChange,129 getValue: false,130 scaleFunc: triggerChange131 }132 }133 };134 return assertStateUpdate(135 shouldUpdate,136 `getPosition ${triggerChange ? 'w/' : 'w/o'} trigger change`137 );138 }139 function getCheckForNoBinChange(accessor, dimension) {140 const update = dimension;141 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);142 const shouldUpdate = {143 layerData: false,144 dimensions: {145 [update]: {146 sortedBins: false,147 valueDomain: false,148 getValue:149 accessor === 'getColorValue w/o trigger' ||150 accessor === 'getElevationValue w/o trigger',151 scaleFunc: false152 },153 [noUpdate]: {154 sortedBins: false,155 valueDomain: false,156 getValue: false,157 scaleFunc: false158 }159 }160 };161 return assertStateUpdate(shouldUpdate, accessor);162 }163 function getCheckForTriggeredBinUpdate(accessor, dimension) {164 const update = dimension;165 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);166 const shouldUpdate = {167 layerData: false,168 dimensions: {169 [update]: {170 sortedBins: true,171 valueDomain: true,172 getValue: true,173 scaleFunc: true174 },175 [noUpdate]: {176 sortedBins: false,177 valueDomain: false,178 getValue: false,179 scaleFunc: false180 }181 }182 };183 return assertStateUpdate(shouldUpdate, accessor);184 }185 function getChecksForPercentileUpdate(side, dimension) {186 const update = dimension;187 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);188 const shouldUpdate = {189 layerData: false,190 dimensions: {191 [update]: {192 sortedBins: false,193 valueDomain: true,194 getValue: false,195 scaleFunc: true196 },197 [noUpdate]: {198 sortedBins: false,199 valueDomain: false,200 getValue: false,201 scaleFunc: false202 }203 }204 };205 return assertStateUpdate(shouldUpdate, `${side}Percentile`);206 }207 function getChecksForDomainOrRangeUpdate(prop, dimension) {208 const update = dimension;209 const noUpdate = ['fillColor', 'elevation'].find(k => k !== dimension);210 const shouldUpdate = {211 layerData: false,212 dimensions: {213 [update]: {214 sortedBins: false,215 valueDomain: false,216 getValue: false,217 scaleFunc: true218 },219 [noUpdate]: {220 sortedBins: false,221 valueDomain: false,222 getValue: false,223 scaleFunc: false224 }225 }226 };227 return assertStateUpdate(shouldUpdate, `${dimension}${prop}`);228 }229 /*230 * Test layer update with test cases231 */232 testLayer({233 Layer: HexagonLayer,234 onError: t.notOk,235 testCases: [236 {237 title: 'Initialize',238 props: {239 data: data.points,240 radius: 400,241 getPosition: d => d.COORDINATES242 },243 onAfterUpdate({layer}) {244 const {245 layerData,246 dimensions: {fillColor, elevation}247 } = layer.state.aggregatorState;248 t.ok(layerData.data.length > 0, 'aggregatorState.dimensions.layerDate calculated');249 t.ok(250 fillColor.sortedBins,251 'aggregatorState.dimensions.fillColor.sortedColorBins calculated'252 );253 t.ok(254 elevation.sortedBins,255 'aggregatorState.dimensions.elevation.sortedColorBins calculated'256 );257 t.ok(258 Array.isArray(fillColor.valueDomain),259 'aggregatorState.dimensions.fillColor.valueDomain calculated'260 );261 t.ok(262 Array.isArray(elevation.valueDomain),263 'aggregatorState.dimensions.elevation.valueDomain calculated'264 );265 t.ok(266 typeof fillColor.getValue === 'function',267 'aggregatorState.dimensions.fillColor.getValue calculated'268 );269 t.ok(270 typeof elevation.getValue === 'function',271 'aggregatorState.dimension.elevation.getValue calculated'272 );273 t.ok(274 Array.isArray(fillColor.sortedBins.aggregatedBins),275 'aggregatorState.dimension.fillColor.sortedBins.aggregatedBins calculated'276 );277 t.ok(278 Array.isArray(elevation.sortedBins.aggregatedBins),279 'aggregatorState.dimension.elevation.sortedBins.aggregatedBins calculated'280 );281 const firstSortedBin = fillColor.sortedBins.aggregatedBins[0];282 const binTocell = layerData.data.find(d => d.index === firstSortedBin.i);283 t.ok(284 fillColor.sortedBins.binMap[binTocell.index] === firstSortedBin,285 'Correct aggregatorState.dimension.fillColor.sortedBins.binMap created'286 );287 }288 },289 {290 updateProps: {291 hexagonAggregator: points => ({hexagons: []})292 },293 onAfterUpdate: getChecksForRadiusChange()294 },295 {296 updateProps: {297 _filterData: pt => pt.SPACES >= 4 && pt.SPACES <= 10298 },299 onAfterUpdate: ({layer, oldState}) => {300 getChecksForFilterChange(false)({layer, oldState});301 const {layerData} = layer.state.aggregatorState;302 const isPointFiltered = layerData.data.every(bin => bin.filteredPoints === null);303 t.ok(isPointFiltered, 'filteredPoints in bins should be reset to null');304 }305 },306 {307 updateProps: {308 _filterData: pt => pt.SPACES >= 4 && pt.SPACES <= 10,309 updateTriggers: {310 _filterData: 1311 }312 },313 onAfterUpdate: ({layer, oldState}) => {314 getChecksForFilterChange(true)({layer, oldState});315 const {316 layerData,317 dimensions: {fillColor, elevation}318 } = layer.state.aggregatorState;319 const isPointFiltered = layerData.data.every(bin =>320 bin.filteredPoints.every(pt => pt.SPACES >= 4 && pt.SPACES <= 10)321 );322 t.ok(isPointFiltered, 'filteredPoints in bins should be correct');323 t.ok(324 fillColor.sortedBins,325 'aggregatorState.dimensions.fillColor.sortedColorBins calculated'326 );327 t.ok(328 elevation.sortedBins,329 'aggregatorState.dimensions.elevation.sortedColorBins calculated'330 );331 }332 },333 {334 updateProps: {335 _filterData: null,336 updateTriggers: {337 _filterData: 0338 }339 },340 onAfterUpdate: ({layer, oldState}) => {341 getChecksForFilterChange(true)({layer, oldState});342 const {layerData} = layer.state.aggregatorState;343 const isPointFiltered = layerData.data.every(bin => bin.filteredPoints === null);344 t.ok(isPointFiltered, 'filteredPoints in bins should be reset to null');345 }346 },347 {348 updateProps: {349 radius: 800350 },351 onAfterUpdate: getChecksForRadiusChange()352 },353 {354 updateProps: {355 getPosition: d => d.COORDINATES356 },357 onAfterUpdate: getChecksForPositionChange(false)358 },359 {360 updateProps: {361 getPosition: d => d.COORDINATES,362 updateTriggers: {363 getPosition: 1364 }365 },366 onAfterUpdate: getChecksForPositionChange(true)367 },368 {369 updateProps: {370 getColorWeight: x => 2371 },372 onAfterUpdate: getCheckForNoBinChange('getColorWeight w/o trigger', 'fillColor')373 },374 {375 updateProps: {376 getColorWeight: x => 2,377 updateTriggers: {378 getColorWeight: 1379 }380 },381 onAfterUpdate: getCheckForTriggeredBinUpdate('getColorWeight w/ trigger', 'fillColor')382 },383 {384 updateProps: {385 getColorValue: x => 2386 },387 onAfterUpdate: getCheckForNoBinChange('getColorValue w/o trigger', 'fillColor')388 },389 {390 updateProps: {391 getColorValue: x => 2,392 updateTriggers: {393 getColorValue: 1394 }395 },396 onAfterUpdate: getCheckForTriggeredBinUpdate('getColorValue w/ trigger', 'fillColor')397 },398 {399 updateProps: {400 colorAggregation: 'MEAN',401 getColorValue: null402 },403 onAfterUpdate: getCheckForTriggeredBinUpdate(404 'colorAggregation w/o getColorValue',405 'fillColor'406 )407 },408 {409 updateProps: {410 upperPercentile: 90411 },412 onAfterUpdate: getChecksForPercentileUpdate('upper', 'fillColor')413 },414 {415 updateProps: {416 lowerPercentile: 90417 },418 onAfterUpdate: getChecksForPercentileUpdate('lower', 'fillColor')419 },420 {421 updateProps: {422 colorDomain: [0, 10]423 },424 onAfterUpdate: getChecksForDomainOrRangeUpdate('Domain', 'fillColor')425 },426 {427 updateProps: {428 colorRange: [[1, 1, 1], [2, 2, 2], [3, 3, 3]]429 },430 onAfterUpdate: getChecksForDomainOrRangeUpdate('Range', 'fillColor')431 },432 {433 updateProps: {434 getElevationWeight: x => 2435 },436 onAfterUpdate: getCheckForNoBinChange('getElevationWeight', 'elevation')437 },438 {439 updateProps: {440 getElevationWeight: x => 2,441 updateTriggers: {442 getElevationWeight: 1443 }444 },445 onAfterUpdate: getCheckForTriggeredBinUpdate('getElevationWeight', 'elevation')446 },447 {448 updateProps: {449 getElevationValue: x => 2450 },451 onAfterUpdate: getCheckForNoBinChange('getElevationValue w/o trigger', 'elevation')452 },453 {454 updateProps: {455 getElevationValue: x => 2,456 updateTriggers: {457 getElevationValue: 1458 }459 },460 onAfterUpdate: getCheckForTriggeredBinUpdate('getElevationValue', 'elevation')461 },462 {463 updateProps: {464 elevationAggregation: 'MEAN',465 getElevationValue: null466 },467 onAfterUpdate: getCheckForTriggeredBinUpdate('elevationAggregation', 'elevation')468 },469 {470 updateProps: {471 elevationUpperPercentile: 80472 },473 onAfterUpdate: getChecksForPercentileUpdate('elevationUpper', 'elevation')474 },475 {476 updateProps: {477 elevationLowerPercentile: 10478 },479 onAfterUpdate: getChecksForPercentileUpdate('elevationLower', 'elevation')480 },481 {482 updateProps: {483 elevationRange: [1, 10]484 },485 onAfterUpdate: getChecksForDomainOrRangeUpdate('Range', 'elevation')486 },487 {488 updateProps: {489 elevationDomain: [0, 10]490 },491 onAfterUpdate: getChecksForDomainOrRangeUpdate('Domain', 'elevation')492 }493 ]494 });495 t.end();496});497test('HexagonLayer#updateTriggers', t => {498 const SPIES = ['_onGetSublayerColor', '_onGetSublayerElevation'];499 function getSublayerAttributeUpdateCheck(prop, result = {}) {500 return function onAfterUpdate({subLayer, spies}) {501 t.ok(502 result.color ? spies._onGetSublayerColor.called : !spies._onGetSublayerColor.called,503 `update ${prop} should ${result.color ? '' : 'not'} call _onGetSublayerColor`504 );505 t.ok(506 result.elevation507 ? spies._onGetSublayerElevation.called508 : !spies._onGetSublayerElevation.called,509 `update ${prop} should ${result.elevation ? '' : 'not'} call _onGetSublayerElevation`510 );511 };512 }513 testLayer({514 Layer: HexagonLayer,515 onError: t.notOk,516 spies: SPIES,517 testCases: [518 {519 // props to initialize layer with520 props: {521 data: data.points,522 radius: 400,523 getPosition: d => d.COORDINATES524 }525 },526 {527 updateProps: {528 radius: 800529 },530 onAfterUpdate: getSublayerAttributeUpdateCheck('radius', {color: true, elevation: true})531 },532 {533 updateProps: {534 opacity: 0.1535 },536 onAfterUpdate: getSublayerAttributeUpdateCheck('opacity', {color: false, elevation: false})537 },538 {539 updateProps: {540 coverage: 0.1541 },542 onAfterUpdate: getSublayerAttributeUpdateCheck('coverage', {color: false, elevation: false})543 },544 {545 updateProps: {546 extruded: true547 },548 onAfterUpdate: getSublayerAttributeUpdateCheck('extruded', {color: false, elevation: false})549 },550 {551 updateProps: {552 colorAggregation: 'MEAN'553 },554 onAfterUpdate: getSublayerAttributeUpdateCheck('colorAggregation', {555 color: true,556 elevation: false557 })558 },559 {560 updateProps: {561 getColorWeight: x => 2562 },563 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorWeight w/o triggers', {564 color: false,565 elevation: false566 })567 },568 {569 updateProps: {570 getColorWeight: x => 2,571 updateTriggers: {572 getColorWeight: 1573 }574 },575 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorWeight w triggers', {576 color: true,577 elevation: false578 })579 },580 {581 updateProps: {582 getColorWeight: x => 3583 },584 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorWeight w/o triggers', {585 color: false,586 elevation: false587 })588 },589 {590 updateProps: {591 getColorValue: x => 2592 },593 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue null to assigned ', {594 color: false,595 elevation: false596 })597 },598 {599 updateProps: {600 getColorValue: x => 3601 },602 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue w/o triggers', {603 color: false,604 elevation: false605 })606 },607 {608 updateProps: {609 getColorValue: x => 4,610 updateTriggers: {611 getColorValue: 1612 }613 },614 onAfterUpdate: getSublayerAttributeUpdateCheck('getColorValue w triggers', {615 color: true,616 elevation: false617 })618 },619 {620 updateProps: {621 upperPercentile: 90622 },623 onAfterUpdate: getSublayerAttributeUpdateCheck('upperPercentile', {624 color: true,625 elevation: false626 })627 },628 {629 updateProps: {630 lowerPercentile: 10631 },632 onAfterUpdate: getSublayerAttributeUpdateCheck('lowerPercentile', {633 color: true,634 elevation: false635 })636 },637 {638 updateProps: {639 colorDomain: [10, 20]640 },641 onAfterUpdate: getSublayerAttributeUpdateCheck('colorDomain', {642 color: true,643 elevation: false644 })645 },646 {647 updateProps: {648 colorRange: [[1, 2, 3], [2, 3, 4], [3, 4, 5]]649 },650 onAfterUpdate: getSublayerAttributeUpdateCheck('colorRange', {651 color: true,652 elevation: false653 })654 },655 {656 updateProps: {657 elevationAggregation: 'MEAN'658 },659 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationAggregation', {660 color: false,661 elevation: true662 })663 },664 {665 updateProps: {666 getElevationWeight: x => 2667 },668 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationWeight w/o triggers', {669 color: false,670 elevation: false671 })672 },673 {674 updateProps: {675 getElevationWeight: x => 2,676 updateTriggers: {677 getElevationWeight: 1,678 // persist color updateTriggers to avoid triggering color update679 getColorValue: 1680 }681 },682 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationWeight w triggers', {683 color: false,684 elevation: true685 })686 },687 {688 updateProps: {689 getElevationWeight: x => 3690 },691 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationWeight w/o triggers', {692 color: false,693 elevation: false694 })695 },696 {697 updateProps: {698 getElevationValue: x => 2699 },700 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationValue null to assigned', {701 color: false,702 elevation: false703 })704 },705 {706 updateProps: {707 getElevationValue: x => 3708 },709 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationValue w/o triggers', {710 color: false,711 elevation: false712 })713 },714 {715 updateProps: {716 getElevationValue: x => 4,717 updateTriggers: {718 getElevationValue: 1,719 // persist getColorValue update triggers720 getColorValue: 1721 }722 },723 onAfterUpdate: getSublayerAttributeUpdateCheck('getElevationValue w triggers', {724 color: false,725 elevation: true726 })727 },728 {729 updateProps: {730 elevationUpperPercentile: 90731 },732 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationUpperPercentile', {733 color: false,734 elevation: true735 })736 },737 {738 updateProps: {739 elevationLowerPercentile: 10740 },741 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationLowerPercentile', {742 color: false,743 elevation: true744 })745 },746 {747 updateProps: {748 elevationDomain: [10, 20]749 },750 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationDomain', {751 color: false,752 elevation: true753 })754 },755 {756 updateProps: {757 elevationRange: [2, 20]758 },759 onAfterUpdate: getSublayerAttributeUpdateCheck('elevationRange', {760 color: false,761 elevation: true762 })763 }764 ]765 });766 t.end();767});768test('HexagonLayer#constructor', t => {769 let layer = new HexagonLayer({770 id: 'emptyGeoJsonLayer',771 data: [],772 radius: 1,773 pickable: true774 });775 t.ok(layer instanceof HexagonLayer, 'Empty HexagonLayer created');776 layer = new HexagonLayer({777 data: data.points,778 pickable: true779 });780 t.ok(layer instanceof HexagonLayer, 'HexagonLayer created');781 t.equal(layer.props.radius, 1000, 'set to default radius if not specified');782 layer = new HexagonLayer({783 data: data.points,784 radius: 500,785 getPosition: d => d.COORDINATES,786 pickable: true787 });788 t.ok(layer instanceof HexagonLayer, 'HexagonLayer created');789 testInitializeLayer({layer, onError: t.notOk});790 t.doesNotThrow(791 () =>792 new HexagonLayer({793 id: 'nullHexagonLayer',794 data: null,795 pickable: true796 }),797 'Null HexagonLayer did not throw exception'798 );799 t.end();800});801test('HexagonLayer#renderSubLayer', t => {802 makeSpy(HexagonLayer.prototype, '_onGetSublayerColor');803 makeSpy(HexagonLayer.prototype, '_onGetSublayerElevation');804 const layer = new HexagonLayer({805 data: data.points,806 radius: 500,807 getPosition: d => d.COORDINATES,808 pickable: true809 });810 testInitializeLayer({layer, onError: t.notOk});811 // render sublayer812 const subLayer = layer.renderLayers();813 testInitializeLayer({layer: subLayer, onError: t.notOk});814 t.ok(subLayer instanceof ColumnLayer, 'ColumnLayer rendered');815 // should call attribute updater twice816 // because test util calls both initialize and update layer817 t.ok(818 HexagonLayer.prototype._onGetSublayerColor.called,819 'should call _onGetSublayerColor number of hexagons times 2'820 );821 t.ok(822 HexagonLayer.prototype._onGetSublayerElevation.called,823 'should call _onGetSublayerElevation number of hexagons times 2'824 );825 HexagonLayer.prototype._onGetSublayerColor.restore();826 HexagonLayer.prototype._onGetSublayerElevation.restore();827 t.end();...

Full Screen

Full Screen

sharedUpdateXML.js

Source:sharedUpdateXML.js Github

copy

Full Screen

1/* Any copyright is dedicated to the Public Domain.2 * http://creativecommons.org/publicdomain/zero/1.0/3 */4/**5 * Helper functions for creating xml strings used by application update tests.6 *7 * !IMPORTANT - This file contains everything needed (along with dependencies)8 * by the updates.sjs file used by the mochitest-chrome tests. Since xpcshell9 * used by the http server is launched with -v 170 this file must not use10 * features greater than JavaScript 1.7.11 */12/* eslint-disable no-undef */13const FILE_SIMPLE_MAR = "simple.mar";14const SIZE_SIMPLE_MAR = "1404";15const STATE_NONE = "null";16const STATE_DOWNLOADING = "downloading";17const STATE_PENDING = "pending";18const STATE_PENDING_SVC = "pending-service";19const STATE_APPLYING = "applying";20const STATE_APPLIED = "applied";21const STATE_APPLIED_SVC = "applied-service";22const STATE_SUCCEEDED = "succeeded";23const STATE_DOWNLOAD_FAILED = "download-failed";24const STATE_FAILED = "failed";25const LOADSOURCE_ERROR_WRONG_SIZE = 2;26const CRC_ERROR = 4;27const READ_ERROR = 6;28const WRITE_ERROR = 7;29const MAR_CHANNEL_MISMATCH_ERROR = 22;30const VERSION_DOWNGRADE_ERROR = 23;31const SERVICE_COULD_NOT_COPY_UPDATER = 49;32const SERVICE_INVALID_APPLYTO_DIR_STAGED_ERROR = 52;33const SERVICE_INVALID_APPLYTO_DIR_ERROR = 54;34const SERVICE_INVALID_INSTALL_DIR_PATH_ERROR = 55;35const SERVICE_INVALID_WORKING_DIR_PATH_ERROR = 56;36const INVALID_APPLYTO_DIR_STAGED_ERROR = 72;37const INVALID_APPLYTO_DIR_ERROR = 74;38const INVALID_INSTALL_DIR_PATH_ERROR = 75;39const INVALID_WORKING_DIR_PATH_ERROR = 76;40const INVALID_CALLBACK_PATH_ERROR = 77;41const INVALID_CALLBACK_DIR_ERROR = 78;42// Error codes 80 through 99 are reserved for nsUpdateService.js and are not43// defined in common/errors.h44const ERR_OLDER_VERSION_OR_SAME_BUILD = 90;45const ERR_UPDATE_STATE_NONE = 91;46const ERR_CHANNEL_CHANGE = 92;47const STATE_FAILED_DELIMETER = ": ";48const STATE_FAILED_LOADSOURCE_ERROR_WRONG_SIZE =49 STATE_FAILED + STATE_FAILED_DELIMETER + LOADSOURCE_ERROR_WRONG_SIZE;50const STATE_FAILED_CRC_ERROR =51 STATE_FAILED + STATE_FAILED_DELIMETER + CRC_ERROR;52const STATE_FAILED_READ_ERROR =53 STATE_FAILED + STATE_FAILED_DELIMETER + READ_ERROR;54const STATE_FAILED_WRITE_ERROR =55 STATE_FAILED + STATE_FAILED_DELIMETER + WRITE_ERROR;56const STATE_FAILED_MAR_CHANNEL_MISMATCH_ERROR =57 STATE_FAILED + STATE_FAILED_DELIMETER + MAR_CHANNEL_MISMATCH_ERROR;58const STATE_FAILED_VERSION_DOWNGRADE_ERROR =59 STATE_FAILED + STATE_FAILED_DELIMETER + VERSION_DOWNGRADE_ERROR;60const STATE_FAILED_SERVICE_COULD_NOT_COPY_UPDATER =61 STATE_FAILED + STATE_FAILED_DELIMETER + SERVICE_COULD_NOT_COPY_UPDATER;62const STATE_FAILED_SERVICE_INVALID_APPLYTO_DIR_STAGED_ERROR =63 STATE_FAILED + STATE_FAILED_DELIMETER + SERVICE_INVALID_APPLYTO_DIR_STAGED_ERROR;64const STATE_FAILED_SERVICE_INVALID_APPLYTO_DIR_ERROR =65 STATE_FAILED + STATE_FAILED_DELIMETER + SERVICE_INVALID_APPLYTO_DIR_ERROR;66const STATE_FAILED_SERVICE_INVALID_INSTALL_DIR_PATH_ERROR =67 STATE_FAILED + STATE_FAILED_DELIMETER + SERVICE_INVALID_INSTALL_DIR_PATH_ERROR;68const STATE_FAILED_SERVICE_INVALID_WORKING_DIR_PATH_ERROR =69 STATE_FAILED + STATE_FAILED_DELIMETER + SERVICE_INVALID_WORKING_DIR_PATH_ERROR;70const STATE_FAILED_INVALID_APPLYTO_DIR_STAGED_ERROR =71 STATE_FAILED + STATE_FAILED_DELIMETER + INVALID_APPLYTO_DIR_STAGED_ERROR;72const STATE_FAILED_INVALID_APPLYTO_DIR_ERROR =73 STATE_FAILED + STATE_FAILED_DELIMETER + INVALID_APPLYTO_DIR_ERROR;74const STATE_FAILED_INVALID_INSTALL_DIR_PATH_ERROR =75 STATE_FAILED + STATE_FAILED_DELIMETER + INVALID_INSTALL_DIR_PATH_ERROR;76const STATE_FAILED_INVALID_WORKING_DIR_PATH_ERROR =77 STATE_FAILED + STATE_FAILED_DELIMETER + INVALID_WORKING_DIR_PATH_ERROR;78const STATE_FAILED_INVALID_CALLBACK_PATH_ERROR =79 STATE_FAILED + STATE_FAILED_DELIMETER + INVALID_CALLBACK_PATH_ERROR;80const STATE_FAILED_INVALID_CALLBACK_DIR_ERROR =81 STATE_FAILED + STATE_FAILED_DELIMETER + INVALID_CALLBACK_DIR_ERROR;82const DEFAULT_UPDATE_VERSION = "999999.0";83/**84 * Constructs a string representing a remote update xml file.85 *86 * @param aUpdates87 * The string representing the update elements.88 * @return The string representing a remote update xml file.89 */90function getRemoteUpdatesXMLString(aUpdates) {91 return "<?xml version=\"1.0\"?>" +92 "<updates>" +93 aUpdates +94 "</updates>";95}96/**97 * Constructs a string representing an update element for a remote update xml98 * file. See getUpdateString for parameter information not provided below.99 *100 * @param aUpdateProps101 * An object containing non default test values for an nsIUpdate.102 * See updateProps names below for possible object names.103 * @param aPatches104 * String representing the application update patches.105 * @return The string representing an update element for an update xml file.106 */107function getRemoteUpdateString(aUpdateProps, aPatches) {108 const updateProps = {109 appVersion: DEFAULT_UPDATE_VERSION,110 buildID: "20080811053724",111 custom1: null,112 custom2: null,113 detailsURL: URL_HTTP_UPDATE_SJS + "?uiURL=DETAILS",114 displayVersion: null,115 name: "App Update Test",116 promptWaitTime: null,117 type: "major"118 };119 for (let name in aUpdateProps) {120 updateProps[name] = aUpdateProps[name];121 }122 return getUpdateString(updateProps) + ">" +123 aPatches +124 "</update>";125}126/**127 * Constructs a string representing a patch element for a remote update xml128 * file. See getPatchString for parameter information not provided below.129 *130 * @param aPatchProps (optional)131 * An object containing non default test values for an nsIUpdatePatch.132 * See patchProps below for possible object names.133 * @return The string representing a patch element for a remote update xml file.134 */135function getRemotePatchString(aPatchProps) {136 const patchProps = {137 type: "complete",138 _url: null,139 get url() {140 if (this._url) {141 return this._url;142 }143 if (gURLData) {144 return gURLData + FILE_SIMPLE_MAR;145 }146 return null;147 },148 set url(val) {149 this._url = val;150 },151 size: SIZE_SIMPLE_MAR152 };153 for (let name in aPatchProps) {154 patchProps[name] = aPatchProps[name];155 }156 return getPatchString(patchProps) + "/>";157}158/**159 * Constructs a string representing a local update xml file.160 *161 * @param aUpdates162 * The string representing the update elements.163 * @return The string representing a local update xml file.164 */165function getLocalUpdatesXMLString(aUpdates) {166 if (!aUpdates || aUpdates == "") {167 return "<updates xmlns=\"http://www.mozilla.org/2005/app-update\"/>";168 }169 return ("<updates xmlns=\"http://www.mozilla.org/2005/app-update\">" +170 aUpdates +171 "</updates>");172}173/**174 * Constructs a string representing an update element for a local update xml175 * file. See getUpdateString for parameter information not provided below.176 *177 * @param aUpdateProps178 * An object containing non default test values for an nsIUpdate.179 * See updateProps names below for possible object names.180 * @param aPatches181 * String representing the application update patches.182 * @return The string representing an update element for an update xml file.183 */184function getLocalUpdateString(aUpdateProps, aPatches) {185 const updateProps = {186 _appVersion: null,187 get appVersion() {188 if (this._appVersion) {189 return this._appVersion;190 }191 if (Services && Services.appinfo && Services.appinfo.version) {192 return Services.appinfo.version;193 }194 return DEFAULT_UPDATE_VERSION;195 },196 set appVersion(val) {197 this._appVersion = val;198 },199 buildID: "20080811053724",200 channel: gDefaultPrefBranch.getCharPref(PREF_APP_UPDATE_CHANNEL),201 custom1: null,202 custom2: null,203 detailsURL: URL_HTTP_UPDATE_SJS + "?uiURL=DETAILS",204 displayVersion: null,205 foregroundDownload: "true",206 installDate: "1238441400314",207 isCompleteUpdate: "true",208 name: "App Update Test",209 previousAppVersion: null,210 promptWaitTime: null,211 serviceURL: "http://test_service/",212 statusText: "Install Pending",213 type: "major"214 };215 for (let name in aUpdateProps) {216 updateProps[name] = aUpdateProps[name];217 }218 let channel = "channel=\"" + updateProps.channel + "\" ";219 let isCompleteUpdate =220 "isCompleteUpdate=\"" + updateProps.isCompleteUpdate + "\" ";221 let foregroundDownload = updateProps.foregroundDownload ?222 "foregroundDownload=\"" + updateProps.foregroundDownload + "\" " : "";223 let installDate = "installDate=\"" + updateProps.installDate + "\" ";224 let previousAppVersion = updateProps.previousAppVersion ?225 "previousAppVersion=\"" + updateProps.previousAppVersion + "\" " : "";226 let statusText = updateProps.statusText ?227 "statusText=\"" + updateProps.statusText + "\" " : "";228 let serviceURL = "serviceURL=\"" + updateProps.serviceURL + "\">";229 return getUpdateString(updateProps) +230 " " +231 channel +232 isCompleteUpdate +233 foregroundDownload +234 installDate +235 previousAppVersion +236 statusText +237 serviceURL +238 aPatches +239 "</update>";240}241/**242 * Constructs a string representing a patch element for a local update xml file.243 * See getPatchString for parameter information not provided below.244 *245 * @param aPatchProps (optional)246 * An object containing non default test values for an nsIUpdatePatch.247 * See patchProps below for possible object names.248 * @return The string representing a patch element for a local update xml file.249 */250function getLocalPatchString(aPatchProps) {251 const patchProps = {252 type: "complete",253 url: gURLData + FILE_SIMPLE_MAR,254 size: SIZE_SIMPLE_MAR,255 selected: "true",256 state: STATE_SUCCEEDED257 };258 for (let name in aPatchProps) {259 patchProps[name] = aPatchProps[name];260 }261 let selected = "selected=\"" + patchProps.selected + "\" ";262 let entityID = aPatchProps.entityID ?263 "entityID=\"" + aPatchProps.entityID + "\" " :264 "";265 let state = "state=\"" + patchProps.state + "\"/>";266 return getPatchString(patchProps) + " " +267 selected +268 entityID +269 state;270}271/**272 * Constructs a string representing an update element for a remote update xml273 * file.274 *275 * @param aUpdateProps (optional)276 * An object containing non default test values for an nsIUpdate.277 * See the aUpdateProps property names below for possible object names.278 * @return The string representing an update element for an update xml file.279 */280function getUpdateString(aUpdateProps) {281 let type = "type=\"" + aUpdateProps.type + "\" ";282 let name = "name=\"" + aUpdateProps.name + "\" ";283 let displayVersion = aUpdateProps.displayVersion ?284 "displayVersion=\"" + aUpdateProps.displayVersion + "\" " : "";285 let appVersion = "appVersion=\"" + aUpdateProps.appVersion + "\" ";286 // Not specifying a detailsURL will cause a leak due to bug 470244287 let detailsURL = "detailsURL=\"" + aUpdateProps.detailsURL + "\" ";288 let promptWaitTime = aUpdateProps.promptWaitTime ?289 "promptWaitTime=\"" + aUpdateProps.promptWaitTime + "\" " : "";290 let custom1 = aUpdateProps.custom1 ? aUpdateProps.custom1 + " " : "";291 let custom2 = aUpdateProps.custom2 ? aUpdateProps.custom2 + " " : "";292 let buildID = "buildID=\"" + aUpdateProps.buildID + "\"";293 return "<update " + type +294 name +295 displayVersion +296 appVersion +297 detailsURL +298 promptWaitTime +299 custom1 +300 custom2 +301 buildID;302}303/**304 * Constructs a string representing a patch element for an update xml file.305 *306 * @param aPatchProps (optional)307 * An object containing non default test values for an nsIUpdatePatch.308 * See the patchProps property names below for possible object names.309 * @return The string representing a patch element for an update xml file.310 */311function getPatchString(aPatchProps) {312 let type = "type=\"" + aPatchProps.type + "\" ";313 let url = "URL=\"" + aPatchProps.url + "\" ";314 let size = "size=\"" + aPatchProps.size + "\"";315 return "<patch " +316 type +317 url +318 size;...

Full Screen

Full Screen

passwords.jsm

Source:passwords.jsm Github

copy

Full Screen

1/* This Source Code Form is subject to the terms of the Mozilla Public2 * License, v. 2.0. If a copy of the MPL was not distributed with this3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */4 /* This is a JavaScript module (JSM) to be imported via5 * Components.utils.import() and acts as a singleton. Only the following6 * listed symbols will exposed on import, and only when and where imported.7 */8var EXPORTED_SYMBOLS = ["Password", "DumpPasswords"];9const {classes: Cc, interfaces: Ci, utils: Cu} = Components;10Cu.import("resource://gre/modules/Services.jsm");11Cu.import("resource://tps/logger.jsm");12var nsLoginInfo = new Components.Constructor(13 "@mozilla.org/login-manager/loginInfo;1",14 Ci.nsILoginInfo,15 "init");16var DumpPasswords = function TPS__Passwords__DumpPasswords() {17 let logins = Services.logins.getAllLogins();18 Logger.logInfo("\ndumping password list\n", true);19 for (var i = 0; i < logins.length; i++) {20 Logger.logInfo("* host=" + logins[i].hostname + ", submitURL=" + logins[i].formSubmitURL +21 ", realm=" + logins[i].httpRealm + ", password=" + logins[i].password +22 ", passwordField=" + logins[i].passwordField + ", username=" +23 logins[i].username + ", usernameField=" + logins[i].usernameField, true);24 }25 Logger.logInfo("\n\nend password list\n", true);26};27/**28 * PasswordProps object; holds password properties.29 */30function PasswordProps(props) {31 this.hostname = null;32 this.submitURL = null;33 this.realm = null;34 this.username = "";35 this.password = "";36 this.usernameField = "";37 this.passwordField = "";38 this.delete = false;39 for (var prop in props) {40 if (prop in this)41 this[prop] = props[prop];42 }43}44/**45 * Password class constructor. Initializes instance properties.46 */47function Password(props) {48 this.props = new PasswordProps(props);49 if ("changes" in props) {50 this.updateProps = new PasswordProps(props);51 for (var prop in props.changes)52 if (prop in this.updateProps)53 this.updateProps[prop] = props.changes[prop];54 }55 else {56 this.updateProps = null;57 }58}59/**60 * Password instance methods.61 */62Password.prototype = {63 /**64 * Create65 *66 * Adds a password entry to the login manager for the password67 * represented by this object's properties. Throws on error.68 *69 * @return the new login guid70 */71 Create: function() {72 let login = new nsLoginInfo(this.props.hostname, this.props.submitURL,73 this.props.realm, this.props.username,74 this.props.password,75 this.props.usernameField,76 this.props.passwordField);77 Services.logins.addLogin(login);78 login.QueryInterface(Ci.nsILoginMetaInfo);79 return login.guid;80 },81 /**82 * Find83 *84 * Finds a password entry in the login manager, for the password85 * represented by this object's properties.86 *87 * @return the guid of the password if found, otherwise -188 */89 Find: function() {90 let logins = Services.logins.findLogins({},91 this.props.hostname,92 this.props.submitURL,93 this.props.realm);94 for (var i = 0; i < logins.length; i++) {95 if (logins[i].username == this.props.username &&96 logins[i].password == this.props.password &&97 logins[i].usernameField == this.props.usernameField &&98 logins[i].passwordField == this.props.passwordField) {99 logins[i].QueryInterface(Ci.nsILoginMetaInfo);100 return logins[i].guid;101 }102 }103 return -1;104 },105 /**106 * Update107 *108 * Updates an existing password entry in the login manager with109 * new properties. Throws on error. The 'old' properties are this110 * object's properties, the 'new' properties are the properties in111 * this object's 'updateProps' object.112 *113 * @return nothing114 */115 Update: function() {116 let oldlogin = new nsLoginInfo(this.props.hostname,117 this.props.submitURL,118 this.props.realm,119 this.props.username,120 this.props.password,121 this.props.usernameField,122 this.props.passwordField);123 let newlogin = new nsLoginInfo(this.updateProps.hostname,124 this.updateProps.submitURL,125 this.updateProps.realm,126 this.updateProps.username,127 this.updateProps.password,128 this.updateProps.usernameField,129 this.updateProps.passwordField);130 Services.logins.modifyLogin(oldlogin, newlogin);131 },132 /**133 * Remove134 *135 * Removes an entry from the login manager for a password which136 * matches this object's properties. Throws on error.137 *138 * @return nothing139 */140 Remove: function() {141 let login = new nsLoginInfo(this.props.hostname,142 this.props.submitURL,143 this.props.realm,144 this.props.username,145 this.props.password,146 this.props.usernameField,147 this.props.passwordField);148 Services.logins.removeLogin(login);149 },...

Full Screen

Full Screen

scripts.js

Source:scripts.js Github

copy

Full Screen

...44 '--c-transZ',45 transforms.translateZ + 'vmin'46 );47}48updateProps();49gui.add(transforms, 'width', 0, 100, 1)50 .name('Width')51 .onChange(updateProps)52gui.add(transforms, 'height', 0, 100, 1)53 .name('Height')54 .onChange(updateProps)55gui.add(transforms, 'depth', 0, 50, 1)56 .name('Depth')57 .onChange(updateProps)58gui.add(transforms, 'rotate', -360, 360, 1)59 .name('Rotate')60 .onChange(updateProps)61gui.add(transforms, 'rotateX', -360, 360, 1)62 .name('Rotate X')...

Full Screen

Full Screen

slideshow.js

Source:slideshow.js Github

copy

Full Screen

...3function addKeydownListener({ children, updateProps, currentSlide }) {4 const slides = filterChildren(children, c => {5 return c.type.name && c.type.name.toLowerCase() === 'slide';6 });7 updateProps({8 numSlides: slides.length9 });10 document.onkeydown = (e) => {11 const slides = filterChildren(children, c => {12 return c.type.name && c.type.name.toLowerCase() === 'slide';13 });14 switch (e.keyCode) {15 case 37:16 if (currentSlide > 0) {17 e.preventDefault();18 updateProps({19 currentSlide: currentSlide - 120 });21 }22 break;23 case 38:24 break;25 case 39:26 if (currentSlide < slides.length - 1) {27 e.preventDefault();28 updateProps({29 currentSlide: currentSlide + 130 });31 }32 break;33 case 40:34 break;35 }36 };37}38export default function Slideshow(props) {39 const {40 children,41 currentSlide,42 noTransition,...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch({ headless: false });4 const page = await browser.newPage();5 await page.evaluate(() => {6 window.playwright.updateProps({ locale: 'en-GB' });7 });8 await page.reload();9 await browser.close();10})();11### `playwright.updateProps(props: Object)`12const { chromium } = require('playwright');13(async () => {14 const browser = await chromium.launch({ headless: false });

Full Screen

Using AI Code Generation

copy

Full Screen

1const { webkit } = require('playwright-webkit');2(async () => {3 const browser = await webkit.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 const element = await page.$('text=Get started');7 await element.updateProps({ disabled: true });8 await browser.close();9})();10const { webkit } = require('playwright-webkit');11(async () => {12 const browser = await webkit.launch();13 const context = await browser.newContext();14 const page = await context.newPage();15 const element = await page.$('text=Get started');16 await element.updateStyles({ 'font-weight': 'bold' });17 await browser.close();18})();19const { webkit } = require('playwright-webkit');20(async () => {21 const browser = await webkit.launch();22 const context = await browser.newContext();23 const page = await context.newPage();24 const developerName = await page.$('#developer-name');25 await developerName.fill('John Smith');26 await browser.close();27})();28const { webkit } = require('playwright-webkit');29(async () => {30 const browser = await webkit.launch();31 const context = await browser.newContext();32 const page = await context.newPage();33 const developerName = await page.$('#developer-name');34 await developerName.type('John Smith');35 await browser.close();36})();

Full Screen

Using AI Code Generation

copy

Full Screen

1const { Playwright } = require('playwright');2const playwright = new Playwright();3const browser = await playwright.chromium.launch();4const context = await browser.newContext();5const page = await context.newPage();6await page.updateProps({7});8await page.close();9await context.close();10await browser.close();11const { chromium } = require('playwright');12const browser = await chromium.launch();13const context = await browser.newContext();14const page = await context.newPage();15await page.updateProps({16});17await page.close();18await context.close();19await browser.close();20const { Playwright } = require('playwright');21const playwright = new Playwright();22const browser = await playwright.chromium.launch();23const context = await browser.newContext();24const page = await context.newPage();25await page.waitForEvent('foo');26await page.close();27await context.close();28await browser.close();29const { chromium } = require('playwright');30const browser = await chromium.launch();31const context = await browser.newContext();32const page = await context.newPage();33await page.waitForEvent('foo');34await page.close();35await context.close();36await browser.close();37const { Playwright } = require('playwright');38const playwright = new Playwright();39const browser = await playwright.chromium.launch();40const context = await browser.newContext();41const page = await context.newPage();42await page.waitForEventAndPromise('foo');43await page.close();44await context.close();45await browser.close();46const { chromium } = require('playwright');47const browser = await chromium.launch();48const context = await browser.newContext();49const page = await context.newPage();

Full Screen

Using AI Code Generation

copy

Full Screen

1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch({ headless: false });4 const page = await browser.newPage();5 const search = await page.$('header input');6 await search.evaluate(search => {7 search.updateProps({8 });9 });10 await browser.close();11})();12Please read [CONTRIBUTING.md](

Full Screen

Using AI Code Generation

copy

Full Screen

1const { updateProps } = require('@playwright/test/lib/server/traceViewer/ui/traceModel');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch({ headless: false });5 const context = await browser.newContext();6 const page = await context.newPage();7 await page.screenshot({ path: `example.png` });8 await browser.close();9 updateProps('recording.videoSize', { width: 500, height: 500 });10})();11const { updateProps } = require('@playwright/test/lib/server/traceViewer/ui/traceModel');12const { chromium } = require('playwright');13(async () => {14 const browser = await chromium.launch({ headless: false });15 const context = await browser.newContext();16 const page = await context.newPage();17 await page.screenshot({ path: `example.png` });18 await browser.close();19 updateProps('recording.videoSize', { width: 500, height: 500 });20})();

Full Screen

Using AI Code Generation

copy

Full Screen

1const { Playwright } = require('playwright-core');2const { chromium } = require('playwright-core');3(async () => {4 const browser = await chromium.launch();5 const page = await browser.newPage();6 const playwright = new Playwright(page);7 await playwright.updateProps({8 });9 await page.screenshot({ path: 'example.png' });10 await browser.close();11})();12const { TestCafe } = require('testcafe');13const { Role } = require('testcafe');14(async () => {15 const testcafe = new TestCafe('localhost', 1337, 1338);16 const runner = testcafe.createRunner();17 const playwright = new Playwright(testcafe);18 await playwright.updateProps({19 });20 .src('testcafe-test.js')21 .browsers('chrome')22 .run();23 await testcafe.close();24})();25const puppeteer = require('puppeteer');26(async () => {27 const browser = await puppeteer.launch();28 const page = await browser.newPage();29 const puppeteer = new Puppeteer(page);30 await puppeteer.updateProps({31 });32 await page.screenshot({ path

Full Screen

Using AI Code Generation

copy

Full Screen

1const page = await browser.newPage();2await page.updateProps({3 viewport: { width: 500, height: 500 },4 userAgent: 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/90.0.4413.0 Safari/537.36'5});6await page.screenshot({ path: 'example.png' });7- [PlaywrightInternal](#playwrightinternal)8 - [Parameters](#parameters)9 - [Examples](#examples)10- [Page](#page)11 - [Parameters](#parameters-1)12 - [Examples](#examples-1)13- [Browser](#browser)14 - [Parameters](#parameters-2)15 - [Examples](#examples-2)16- [BrowserContext](#browsercontext)17 - [Parameters](#parameters-3)18 - [Examples](#examples-3)19- [BrowserServer](#browserserver)20 - [Parameters](#parameters-4)21 - [Examples](#examples-4)22- [ElementHandle](#elementhandle)23 - [Parameters](#parameters-5)24 - [Examples](#examples-5)25- [Frame](#frame)26 - [Parameters](#parameters-6)27 - [Examples](#examples-6)28- [JSHandle](#jshandle)29 - [Parameters](#parameters-7)30 - [Examples](#examples-7)31- [Request](#request)32 - [Parameters](#parameters-8)33 - [Examples](#examples-8)34- [Response](#response)35 - [Parameters](#parameters-9)36 - [Examples](#examples-9)37- [WebSocket](#websocket)38 - [Parameters](#parameters-10)39 - [Examples](#examples-10)40- [Worker](#worker)41 - [Parameters](#parameters-11)

Full Screen

Using AI Code Generation

copy

Full Screen

1const { _electron } = require('playwright');2const app = await _electron.launch({ args: ['app'] });3const page = await app.firstWindow();4await page.updateProps({ width: 500, height: 500 });5await page.screenshot({ path: `screenshot.png` });6await app.close();

Full Screen

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:

  1. 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.
  2. 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.
  3. 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.
  4. 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.
  5. Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
  6. 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.
  7. 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.
  8. 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.
  9. 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.
  10. 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.
  11. 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.
  12. 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!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful