KaneAI - World’s First E2E Software Testing Agent.Book a Demo Join TestMu Conference

How to use createBoxPropertyGroup method in wpt

Best JavaScript code snippet using wpt

test-box-properties.js

Source:test-box-properties.js

1"use strict";2(function(exports) {3  const sheet = document.head.appendChild(document.createElement("style"));4  // Specify size for outer <div> to avoid unconstrained-size warnings5  // when writing-mode of the inner test <div> is vertical-*6  const wrapper = document.body.appendChild(document.createElement("div"));7  wrapper.style.cssText = "width:100px; height: 100px;";8  const testElement = wrapper.appendChild(document.createElement("div"));9  testElement.id = testElement.className = "test";10  // Values to use while testing11  const testValues = {12    "length": ["1px", "2px", "3px", "4px", "5px"],13    "color": ["rgb(1, 1, 1)", "rgb(2, 2, 2)", "rgb(3, 3, 3)", "rgb(4, 4, 4)", "rgb(5, 5, 5)"],14    "border-style": ["solid", "dashed", "dotted", "double", "groove"],15  };16  // Six unique overall writing modes for property-mapping purposes.17  const writingModes = [18    {19      styles: [20        {"writing-mode": "horizontal-tb", "direction": "ltr"},21      ],22      blockStart: "top", blockEnd: "bottom", inlineStart: "left", inlineEnd: "right",23      block: "vertical", inline: "horizontal" },24    {25      styles: [26        {"writing-mode": "horizontal-tb", "direction": "rtl"},27      ],28      blockStart: "top", blockEnd: "bottom", inlineStart: "right", inlineEnd: "left",29      block: "vertical", inline: "horizontal" },30    {31      styles: [32        {"writing-mode": "vertical-rl", "direction": "rtl"},33        {"writing-mode": "sideways-rl", "direction": "rtl"},34      ],35      blockStart: "right", blockEnd: "left", inlineStart: "bottom", inlineEnd: "top",36      block: "horizontal", inline: "vertical" },37    {38      styles: [39        {"writing-mode": "vertical-rl", "direction": "ltr"},40        {"writing-mode": "sideways-rl", "direction": "ltr"},41      ],42      blockStart: "right", blockEnd: "left", inlineStart: "top", inlineEnd: "bottom",43      block: "horizontal", inline: "vertical" },44    {45      styles: [46        {"writing-mode": "vertical-lr", "direction": "rtl"},47        {"writing-mode": "sideways-lr", "direction": "ltr"},48      ],49      blockStart: "left", blockEnd: "right", inlineStart: "bottom", inlineEnd: "top",50      block: "horizontal", inline: "vertical" },51    {52      styles: [53        {"writing-mode": "vertical-lr", "direction": "ltr"},54        {"writing-mode": "sideways-lr", "direction": "rtl"},55      ],56      blockStart: "left", blockEnd: "right", inlineStart: "top", inlineEnd: "bottom",57      block: "horizontal", inline: "vertical" },58  ];59  function testCSSValues(testName, style, expectedValues) {60    for (const [property, value] of expectedValues) {61      assert_equals(style.getPropertyValue(property), value, `${testName}, ${property}`);62    }63  }64  function testComputedValues(testName, rules, expectedValues) {65    sheet.textContent = rules;66    const cs = getComputedStyle(testElement);67    testCSSValues(testName, cs, expectedValues);68    sheet.textContent = "";69  }70  function makeDeclaration(object = {}, replacement = "*") {71    let decl = "";72    for (const [property, value] of Object.entries(object)) {73      decl += `${property.replace("*", replacement)}: ${value}; `;74    }75    return decl;76  }77  /**78   * Creates a group of physical and logical box properties, such as79   *80   * { physical: {81   *     left: "margin-left", right: "margin-right",82   *     top: "margin-top", bottom: "margin-bottom",83   *   }, logical: {84   *     inlineStart: "margin-inline-start", inlineEnd: "margin-inline-end",85   *     blockStart: "margin-block-start", blockEnd: "margin-block-end",86   *   }, type: "length", prerequisites: "...", property: "'margin-*'" }87   *88   * @param {string} property89   *        A string representing the property names, like "margin-*".90   * @param {Object} descriptor91   * @param {string} descriptor.type92   *        Describes the kind of values accepted by the property, like "length".93   *        Must be a key from the `testValues` object.94   * @param {Object={}} descriptor.prerequisites95   *        Represents property declarations that are needed by `property` to work.96   *        For example, border-width properties require a border style.97   */98  exports.createBoxPropertyGroup = function(property, descriptor) {99    const logical = {};100    const physical = {};101    for (const logicalSide of ["inline-start", "inline-end", "block-start", "block-end"]) {102      const camelCase = logicalSide.replace(/-(.)/g, (match, $1) => $1.toUpperCase());103      logical[camelCase] = property.replace("*", logicalSide);104    }105    const isInset = property === "inset-*";106    let prerequisites = "";107    for (const physicalSide of ["left", "right", "top", "bottom"]) {108      physical[physicalSide] = isInset ? physicalSide : property.replace("*", physicalSide);109      prerequisites += makeDeclaration(descriptor.prerequisites, physicalSide);110    }111    return {name, logical, physical, type: descriptor.type, prerequisites, property};112  };113  /**114   * Creates a group of physical and logical sizing properties.115   *116   * @param {string} prefix117   *        One of "", "max-" or "min-".118   */119  exports.createSizingPropertyGroup = function(prefix) {120    return {121      logical: {122        inline: `${prefix}inline-size`,123        block: `${prefix}block-size`,124      },125      physical: {126        horizontal: `${prefix}width`,127        vertical: `${prefix}height`,128      },129      type: "length",130      prerequisites: makeDeclaration({display: "block"}),131      property: (prefix ? prefix.slice(0, -1) + " " : "") + "sizing",132    };133  };134  /**135   * Tests a grup of logical and physical properties in different writing modes.136   *137   * @param {Object} group138   *        An object returned by createBoxPropertyGroup or createSizingPropertyGroup.139   */140  exports.runTests = function(group) {141    const values = testValues[group.type];142    const logicals = Object.values(group.logical);143    const physicals = Object.values(group.physical);144    test(function() {145      const expected = [];146      for (const [i, logicalProp] of logicals.entries()) {147        testElement.style.setProperty(logicalProp, values[i]);148        expected.push([logicalProp, values[i]]);149      }150      testCSSValues("logical properties in inline style", testElement.style, expected);151      testElement.style.cssText = "";152    }, `Test that logical ${group.property} properties are supported.`);153    for (const writingMode of writingModes) {154      for (const style of writingMode.styles) {155        const writingModeDecl = makeDeclaration(style);156        const associated = {};157        for (const [logicalSide, logicalProp] of Object.entries(group.logical)) {158          const physicalProp = group.physical[writingMode[logicalSide]];159          associated[logicalProp] = physicalProp;160          associated[physicalProp] = logicalProp;161        }162        // Test that logical properties are converted to their physical163        // equivalent correctly when all in the group are present on a single164        // declaration, with no overwriting of previous properties and165        // no physical properties present.  We put the writing mode properties166        // on a separate declaration to test that the computed values of these167        // properties are used, rather than those on the same declaration.168        test(function() {169          let decl = group.prerequisites;170          const expected = [];171          for (const [i, logicalProp] of logicals.entries()) {172            decl += `${logicalProp}: ${values[i]}; `;173            expected.push([logicalProp, values[i]]);174            expected.push([associated[logicalProp], values[i]]);175          }176          testComputedValues("logical properties on one declaration, writing " +177                             `mode properties on another, '${writingModeDecl}'`,178                             `.test { ${writingModeDecl} } .test { ${decl} }`,179                             expected);180        }, `Test that logical ${group.property} properties share computed values `181         + `with their physical associates, with '${writingModeDecl}'.`);182        // Test that logical and physical properties are cascaded together,183        // honoring their relative order on a single declaration184        // (a) with a single logical property after the physical ones185        // (b) with a single physical property after the logical ones186        test(function() {187          for (const lastIsLogical of [true, false]) {188            const lasts = lastIsLogical ? logicals : physicals;189            const others = lastIsLogical ? physicals : logicals;190            for (const lastProp of lasts) {191              let decl = writingModeDecl + group.prerequisites;192              const expected = [];193              for (const [i, prop] of others.entries()) {194                decl += `${prop}: ${values[i]}; `;195                const valueIdx = associated[prop] === lastProp ? others.length : i;196                expected.push([prop, values[valueIdx]]);197                expected.push([associated[prop], values[valueIdx]]);198              }199              decl += `${lastProp}: ${values[others.length]}; `;200              testComputedValues(`'${lastProp}' last on single declaration, '${writingModeDecl}'`,201                                 `.test { ${decl} }`,202                                 expected);203            }204          }205        }, `Test that ${group.property} properties honor order of appearance when both `206         + `logical and physical associates are declared, with '${writingModeDecl}'.`);207        // Test that logical and physical properties are cascaded properly when208        // on different declarations209        // (a) with a logical property in the high specificity rule210        // (b) with a physical property in the high specificity rule211        test(function() {212          for (const highIsLogical of [true, false]) {213            let lowDecl = writingModeDecl + group.prerequisites;214            const high = highIsLogical ? logicals : physicals;215            const others = highIsLogical ? physicals : logicals;216            for (const [i, prop] of others.entries()) {217              lowDecl += `${prop}: ${values[i]}; `;218            }219            for (const highProp of high) {220              const highDecl = `${highProp}: ${values[others.length]}; `;221              const expected = [];222              for (const [i, prop] of others.entries()) {223                const valueIdx = associated[prop] === highProp ? others.length : i;224                expected.push([prop, values[valueIdx]]);225                expected.push([associated[prop], values[valueIdx]]);226              }227              testComputedValues(`'${highProp}', two declarations, '${writingModeDecl}'`,228                                 `#test { ${highDecl} } .test { ${lowDecl} }`,229                                 expected);230            }231          }232        }, `Test that ${group.property} properties honor selector specificty when both `233         + `logical and physical associates are declared, with '${writingModeDecl}'.`);234      }235    }236  };...

Using AI Code Generation

1var docRef = app.documents.add();2var layerRef = docRef.layers.add();3var boxRef = layerRef.pathItems.rectangle(0, 0, 100, 100);4var propertyGroupRef = createBoxPropertyGroup(boxRef);5var propertyRef = propertyGroupRef.addProperty("testProperty");6propertyRef.value = "testValue";7docRef.saveAs(new File("~/Desktop/test.psd"));8function createBoxPropertyGroup(box) {9    var propertyGroupRef = box.propertyGroups.add();10    propertyGroupRef.name = "boxPropertyGroup";11    return propertyGroupRef;12}

Using AI Code Generation

1var boxPropertyGroup = wptools.createBoxPropertyGroup();2app.activeDocument.boxPropertyGroups.add(boxPropertyGroup);3boxPropertyGroup.name = "my box property group";4var boxProperty = boxPropertyGroup.boxProperties.add();5boxProperty.name = "my box property";6boxProperty.value = "my box property value";7boxProperty.key = "my box property key";8boxProperty.value = ["my box property value 1", "my box property value 2"];9boxProperty.key = ["my box property key 1", "my box property key 2"];10boxProperty.value = [["my box property key 1", "my box property value 1"], ["my box property key 2", "my box property value 2"]];11boxProperty.key = [["my box property key 1", "my box property value 1"], ["my box property key 2", "my box property value 2"]];12boxProperty.value = [["my box property key 1", "my box property value 1"], ["my box property key 2", "my box property value 2"]];13boxProperty.key = [["my box property key 1", "my box property value 1"], ["my box property key 2", "my box property value 2"]];

Using AI Code Generation

1var wptoolkit = require("wptoolkit"); 2var wp = new wptoolkit();3var box = wp.createBoxPropertyGroup("testBox");4box.position = [0,0,0];5box.size = [1,1,1];6box.color = [1,0,0];7var wptoolkit = require("wptoolkit"); 8var wp = new wptoolkit();9var box = wp.createBoxPropertyGroup("testBox");10box.position = [0,0,0];11box.size = [1,1,1];12box.color = [1,0,0];13var wptoolkit = require("wptoolkit"); 14var wp = new wptoolkit();15var box = wp.createBoxPropertyGroup("testBox");16box.position = [0,0,0];17box.size = [1,1,1];18box.color = [1,0,0];19var wptoolkit = require("wptoolkit"); 20var wp = new wptoolkit();21var box = wp.createBoxPropertyGroup("testBox");22box.position = [0,0,0];23box.size = [1,1,1];24box.color = [1,0,0];25var wptoolkit = require("wptoolkit"); 26var wp = new wptoolkit();27var box = wp.createBoxPropertyGroup("testBox");28box.position = [0,0,0];29box.size = [1,1,1];30box.color = [1,0,0];31var wptoolkit = require("wptoolkit"); 32var wp = new wptoolkit();33var box = wp.createBoxPropertyGroup("testBox");34box.position = [0,0,0];35box.size = [1,1,1];36box.color = [1,0,0];37var wptoolkit = require("wptoolkit"); 38var wp = new wptoolkit();39var box = wp.createBoxPropertyGroup("testBox");40box.position = [0,0,0];41box.size = [1,1,1];42box.color = [1,0,0];

Using AI Code Generation

1var wptools = require('wptools');2var wp = new wptools('India');3wp.createBoxPropertyGroup('India', 'box-India', function(err, res) {4	console.log(res);5});6var wptools = require('wptools');7var wp = new wptools('India');8wp.createBoxPropertyGroup('India', 'box-India', function(err, res) {9	console.log(res);10});

Using AI Code Generation

1var boxElement = new WPTB_ElementBox( 'test' );2var boxPropGroup = boxElement.createBoxPropertyGroup( 'left' );3console.log( boxPropGroup );4var boxElement = new WPTB_ElementBox( 'test' );5var boxPropGroup = boxElement.createBoxPropertyGroup( 'left' );6console.log( boxPropGroup );

Using AI Code Generation

1var wptk = require('wptk');2var doc = wptk.openDocument('test.docx');3var box = wptk.createBoxPropertyGroup('box', 'Box', 'Box property group');4doc.getPropertyGroups().add(box);5doc.save();6doc.close();7var wptk = require('wptk');8var doc = wptk.openDocument('test.docx');9var list = wptk.createListPropertyGroup('list', 'List', 'List property group');10doc.getPropertyGroups().add(list);11doc.save();12doc.close();13var wptk = require('wptk');14var doc = wptk.openDocument('test.docx');15var table = wptk.createTablePropertyGroup('table', 'Table', 'Table property group');16doc.getPropertyGroups().add(table);17doc.save();18doc.close();

Using AI Code Generation

1var wptools = require('wptools');2var wp = wptools('Test page');3wp.createBoxPropertyGroup('testgroup', 'This is a test group', 'Test Group')4.then(function() {5    return wp.save();6})7.then(function() {8    console.log('done');9})10.catch(function(err) {11    console.log(err);12});13var wptools = require('wptools');14var wp = wptools('Test page');15wp.createBoxPropertyGroup('testgroup', 'This is a test group', 'Test Group')16.then(function() {17    return wp.createBoxProperty('testgroup', 'testproperty', 'This is a test property', 'This is a test property', 'Test Property');18})19.then(function() {20    return wp.save();21})22.then(function() {23    console.log('done');24})25.catch(function(err) {26    console.log(err);27});28var wptools = require('wptools');29var wp = wptools('Test page');30wp.createBoxPropertyGroup('testgroup', 'This is a test group', 'Test Group')31.then(function() {32    return wp.createBoxProperty('testgroup

Automation Testing Tutorials

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