How to use computedOffset method in wpt

Best JavaScript code snippet using wpt

keyframe-tests.js

Source:keyframe-tests.js

...47  // ----------- Property-indexed keyframes: property handling -----------48  {49    desc:   'a one property two value property-indexed keyframes specification',50    input:  { left: ['10px', '20px'] },51    output: [keyframe(computedOffset(0), { left: '10px' }),52             keyframe(computedOffset(1), { left: '20px' })],53  },54  {55    desc:   'a one shorthand property two value property-indexed keyframes'56            + ' specification',57    input:  { margin: ['10px', '10px 20px 30px 40px'] },58    output: [keyframe(computedOffset(0), { margin: '10px' }),59             keyframe(computedOffset(1), { margin: '10px 20px 30px 40px' })],60  },61  {62    desc:   'a two property (one shorthand and one of its longhand components)'63            + ' two value property-indexed keyframes specification',64    input:  { marginTop: ['50px', '60px'],65              margin: ['10px', '10px 20px 30px 40px'] },66    output: [keyframe(computedOffset(0),67                      { marginTop: '50px', margin: '10px' }),68             keyframe(computedOffset(1),69                      { marginTop: '60px', margin: '10px 20px 30px 40px' })],70  },71  {72    desc:   'a two property two value property-indexed keyframes specification',73    input:  { left: ['10px', '20px'],74              top: ['30px', '40px'] },75    output: [keyframe(computedOffset(0), { left: '10px', top: '30px' }),76             keyframe(computedOffset(1), { left: '20px', top: '40px' })],77  },78  {79    desc:   'a two property property-indexed keyframes specification with'80            + ' different numbers of values',81    input:  { left: ['10px', '20px', '30px'],82              top: ['40px', '50px'] },83    output: [keyframe(computedOffset(0),   { left: '10px', top: '40px' }),84             keyframe(computedOffset(0.5), { left: '20px' }),85             keyframe(computedOffset(1),   { left: '30px', top: '50px' })],86  },87  {88    desc:   'a property-indexed keyframes specification with an invalid value',89    input:  { left: ['10px', '20px', '30px', '40px', '50px'],90              top:  ['15px', '25px', 'invalid', '45px', '55px'] },91    output: [keyframe(computedOffset(0),    { left: '10px', top: '15px' }),92             keyframe(computedOffset(0.25), { left: '20px', top: '25px' }),93             keyframe(computedOffset(0.5),  { left: '30px' }),94             keyframe(computedOffset(0.75), { left: '40px', top: '45px' }),95             keyframe(computedOffset(1),    { left: '50px', top: '55px' })],96  },97  {98    desc:   'a one property two value property-indexed keyframes specification'99            + ' that needs to stringify its values',100    input:  { opacity: [0, 1] },101    output: [keyframe(computedOffset(0), { opacity: '0' }),102             keyframe(computedOffset(1), { opacity: '1' })],103  },104  {105    desc:   'a property-indexed keyframes specification with a CSS variable'106            + ' reference',107    input:  { left: [ 'var(--dist)', 'calc(var(--dist) + 100px)' ] },108    output: [keyframe(computedOffset(0), { left: 'var(--dist)' }),109             keyframe(computedOffset(1), { left: 'calc(var(--dist) + 100px)' })]110  },111  {112    desc:   'a property-indexed keyframes specification with a CSS variable'113            + ' reference in a shorthand property',114    input:  { margin: [ 'var(--dist)', 'calc(var(--dist) + 100px)' ] },115    output: [keyframe(computedOffset(0),116                      { margin: 'var(--dist)' }),117             keyframe(computedOffset(1),118                      { margin: 'calc(var(--dist) + 100px)' })],119  },120  {121    desc:   'a one property one value property-indexed keyframes specification',122    input:  { left: ['10px'] },123    output: [keyframe(computedOffset(1), { left: '10px' })],124  },125  {126    desc:   'a one property one non-array value property-indexed keyframes'127            + ' specification',128    input:  { left: '10px' },129    output: [keyframe(computedOffset(1), { left: '10px' })],130  },131  {132    desc:   'a one property two value property-indexed keyframes specification'133            + ' where the first value is invalid',134    input:  { left: ['invalid', '10px'] },135    output: [keyframe(computedOffset(0), {}),136             keyframe(computedOffset(1), { left: '10px' })]137  },138  {139    desc:   'a one property two value property-indexed keyframes specification'140            + ' where the second value is invalid',141    input:  { left: ['10px', 'invalid'] },142    output: [keyframe(computedOffset(0), { left: '10px' }),143             keyframe(computedOffset(1), {})]144  },145  // ----------- Property-indexed keyframes: offset handling -----------146  {147    desc:   'a property-indexed keyframe with a single offset',148    input:  { left: ['10px', '20px', '30px'], offset: 0.5 },149    output: [keyframe(offset(0.5),          { left: '10px' }),150             keyframe(computedOffset(0.75), { left: '20px' }),151             keyframe(computedOffset(1),    { left: '30px' })],152  },153  {154    desc:   'a property-indexed keyframe with an array of offsets',155    input:  { left: ['10px', '20px', '30px'], offset: [ 0.1, 0.25, 0.8 ] },156    output: [keyframe(offset(0.1),  { left: '10px' }),157             keyframe(offset(0.25), { left: '20px' }),158             keyframe(offset(0.8),  { left: '30px' })],159  },160  {161    desc:   'a property-indexed keyframe with an array of offsets that is too'162            + ' short',163    input:  { left: ['10px', '20px', '30px'], offset: [ 0, 0.25 ] },164    output: [keyframe(offset(0),         { left: '10px' }),165             keyframe(offset(0.25),      { left: '20px' }),166             keyframe(computedOffset(1), { left: '30px' })],167  },168  {169    desc:   'a property-indexed keyframe with an array of offsets that is too'170            + ' long',171    input:  { left: ['10px', '20px', '30px'],172              offset: [ 0, 0.25, 0.5, 0.75, 1 ] },173    output: [keyframe(offset(0),    { left: '10px' }),174             keyframe(offset(0.25), { left: '20px' }),175             keyframe(offset(0.5),  { left: '30px' })],176  },177  {178    desc:   'a property-indexed keyframe with an empty array of offsets',179    input:  { left: ['10px', '20px', '30px'], offset: [] },180    output: [keyframe(computedOffset(0),   { left: '10px' }),181             keyframe(computedOffset(0.5), { left: '20px' }),182             keyframe(computedOffset(1),   { left: '30px' })],183  },184  {185    desc:   'a property-indexed keyframe with an array of offsets with an'186            + ' embedded null value',187    input:  { left: ['10px', '20px', '30px'],188              offset: [ 0, null, 0.5 ] },189    output: [keyframe(offset(0),            { left: '10px' }),190             keyframe(computedOffset(0.25), { left: '20px' }),191             keyframe(offset(0.5),          { left: '30px' })],192  },193  {194    desc:   'a property-indexed keyframe with an array of offsets with a'195            + ' trailing null value',196    input:  { left: ['10px', '20px', '30px'],197              offset: [ 0, 0.25, null ] },198    output: [keyframe(offset(0),           { left: '10px' }),199             keyframe(offset(0.25),        { left: '20px' }),200             keyframe(computedOffset(1), { left: '30px' })],201  },202  {203    desc:   'a property-indexed keyframe with an array of offsets with leading'204            + ' and trailing null values',205    input:  { left: ['10px', '20px', '30px'],206              offset: [ null, 0.25, null ] },207    output: [keyframe(computedOffset(0), { left: '10px' }),208             keyframe(offset(0.25),      { left: '20px' }),209             keyframe(computedOffset(1), { left: '30px' })],210  },211  {212    desc:   'a property-indexed keyframe with an array of offsets with'213            + ' adjacent null values',214    input:  { left: ['10px', '20px', '30px'],215              offset: [ null, null, 0.5 ] },216    output: [keyframe(computedOffset(0),    { left: '10px' }),217             keyframe(computedOffset(0.25), { left: '20px' }),218             keyframe(offset(0.5),          { left: '30px' })],219  },220  {221    desc:   'a property-indexed keyframe with an array of offsets with'222            + ' all null values (and too many at that)',223    input:  { left: ['10px', '20px', '30px'],224              offset: [ null, null, null, null, null ] },225    output: [keyframe(computedOffset(0),   { left: '10px' }),226             keyframe(computedOffset(0.5), { left: '20px' }),227             keyframe(computedOffset(1),   { left: '30px' })],228  },229  {230    desc:   'a property-indexed keyframe with a single null offset',231    input:  { left: ['10px', '20px', '30px'], offset: null },232    output: [keyframe(computedOffset(0),   { left: '10px' }),233             keyframe(computedOffset(0.5), { left: '20px' }),234             keyframe(computedOffset(1),   { left: '30px' })],235  },236  {237    desc:   'a property-indexed keyframe with an array of offsets that is not'238            + ' strictly ascending in the unused part of the array',239    input:  { left: ['10px', '20px', '30px'],240              offset: [ 0, 0.2, 0.8, 0.6 ] },241    output: [keyframe(offset(0),   { left: '10px' }),242             keyframe(offset(0.2), { left: '20px' }),243             keyframe(offset(0.8), { left: '30px' })],244  },245  // ----------- Property-indexed keyframes: easing handling -----------246  {247    desc:   'a property-indexed keyframe without any specified easing',248    input:  { left: ['10px', '20px', '30px'] },249    output: [keyframe(computedOffset(0),   { left: '10px' }, 'linear'),250             keyframe(computedOffset(0.5), { left: '20px' }, 'linear'),251             keyframe(computedOffset(1),   { left: '30px' }, 'linear')],252  },253  {254    desc:   'a property-indexed keyframe with a single easing',255    input:  { left: ['10px', '20px', '30px'], easing: 'ease-in' },256    output: [keyframe(computedOffset(0),   { left: '10px' }, 'ease-in'),257             keyframe(computedOffset(0.5), { left: '20px' }, 'ease-in'),258             keyframe(computedOffset(1),   { left: '30px' }, 'ease-in')],259  },260  {261    desc:   'a property-indexed keyframe with an array of easings',262    input:  { left: ['10px', '20px', '30px'],263              easing: ['ease-in', 'ease-out', 'ease-in-out'] },264    output: [keyframe(computedOffset(0),   { left: '10px' }, 'ease-in'),265             keyframe(computedOffset(0.5), { left: '20px' }, 'ease-out'),266             keyframe(computedOffset(1),   { left: '30px' }, 'ease-in-out')],267  },268  {269    desc:   'a property-indexed keyframe with an array of easings that is too'270            + ' short',271    input:  { left: ['10px', '20px', '30px'],272              easing: ['ease-in', 'ease-out'] },273    output: [keyframe(computedOffset(0),   { left: '10px' }, 'ease-in'),274             keyframe(computedOffset(0.5), { left: '20px' }, 'ease-out'),275             keyframe(computedOffset(1),   { left: '30px' }, 'ease-in')],276  },277  {278    desc:   'a property-indexed keyframe with a single-element array of'279            + ' easings',280    input:  { left: ['10px', '20px', '30px'], easing: ['ease-in'] },281    output: [keyframe(computedOffset(0),   { left: '10px' }, 'ease-in'),282             keyframe(computedOffset(0.5), { left: '20px' }, 'ease-in'),283             keyframe(computedOffset(1),   { left: '30px' }, 'ease-in')],284  },285  {286    desc:   'a property-indexed keyframe with an empty array of easings',287    input:  { left: ['10px', '20px', '30px'], easing: [] },288    output: [keyframe(computedOffset(0),   { left: '10px' }, 'linear'),289             keyframe(computedOffset(0.5), { left: '20px' }, 'linear'),290             keyframe(computedOffset(1),   { left: '30px' }, 'linear')],291  },292  {293    desc:   'a property-indexed keyframe with an array of easings that is too'294            + ' long',295    input:  { left: ['10px', '20px', '30px'],296              easing: ['steps(1)', 'steps(2)', 'steps(3)', 'steps(4)'] },297    output: [keyframe(computedOffset(0),   { left: '10px' }, 'steps(1)'),298             keyframe(computedOffset(0.5), { left: '20px' }, 'steps(2)'),299             keyframe(computedOffset(1),   { left: '30px' }, 'steps(3)')],300  },301  // ----------- Property-indexed keyframes: composite handling -----------302  {303    desc:   'a property-indexed keyframe with a single composite operation',304    input:  { left: ['10px', '20px', '30px'], composite: 'add' },305    output: [keyframe(computedOffset(0),   { left: '10px' }, 'linear', 'add'),306             keyframe(computedOffset(0.5), { left: '20px' }, 'linear', 'add'),307             keyframe(computedOffset(1),   { left: '30px' }, 'linear', 'add')],308  },309  {310    desc:   'a property-indexed keyframe with a composite array',311    input:  { left: ['10px', '20px', '30px'],312              composite: ['add', 'replace', 'accumulate'] },313    output: [keyframe(computedOffset(0),   { left: '10px' },314                      'linear', 'add'),315             keyframe(computedOffset(0.5), { left: '20px' },316                      'linear', 'replace'),317             keyframe(computedOffset(1),   { left: '30px' },318                      'linear', 'accumulate')],319  },320  {321    desc:   'a property-indexed keyframe with a composite array that is too'322            + ' short',323    input:  { left: ['10px', '20px', '30px', '40px', '50px'],324              composite: ['add', 'replace'] },325    output: [keyframe(computedOffset(0),    { left: '10px' },326                      'linear', 'add'),327             keyframe(computedOffset(0.25), { left: '20px' },328                      'linear', 'replace'),329             keyframe(computedOffset(0.5),  { left: '30px' },330                      'linear', 'add'),331             keyframe(computedOffset(0.75), { left: '40px' },332                      'linear', 'replace'),333             keyframe(computedOffset(1),    { left: '50px' },334                      'linear', 'add')],335  },336  {337    desc:   'a property-indexed keyframe with a composite array that is too'338            + ' long',339    input:  { left: ['10px', '20px'],340              composite: ['add', 'replace', 'accumulate'] },341    output: [keyframe(computedOffset(0), { left: '10px' },342                      'linear', 'add'),343             keyframe(computedOffset(1), { left: '20px' },344                      'linear', 'replace')],345  },346  {347    desc:   'a property-indexed keyframe with a single-element composite array',348    input:  { left: ['10px', '20px', '30px'],349              composite: ['add'] },350    output: [keyframe(computedOffset(0),   { left: '10px' }, 'linear', 'add'),351             keyframe(computedOffset(0.5), { left: '20px' }, 'linear', 'add'),352             keyframe(computedOffset(1),   { left: '30px' }, 'linear', 'add')],353  },354  // ----------- Keyframe sequence: property handling -----------355  {356    desc:   'a one property one keyframe sequence',357    input:  [{ offset: 1, left: '10px' }],358    output: [keyframe(offset(1), { left: '10px' })],359  },360  {361    desc:   'a one property two keyframe sequence',362    input:  [{ offset: 0, left: '10px' },363             { offset: 1, left: '20px' }],364    output: [keyframe(offset(0), { left: '10px' }),365             keyframe(offset(1), { left: '20px' })],366  },367  {368    desc:   'a two property two keyframe sequence',369    input:  [{ offset: 0, left: '10px', top: '30px' },370             { offset: 1, left: '20px', top: '40px' }],371    output: [keyframe(offset(0), { left: '10px', top: '30px' }),372             keyframe(offset(1), { left: '20px', top: '40px' })],373  },374  {375    desc:   'a one shorthand property two keyframe sequence',376    input:  [{ offset: 0, margin: '10px' },377             { offset: 1, margin: '20px 30px 40px 50px' }],378    output: [keyframe(offset(0), { margin: '10px' }),379             keyframe(offset(1), { margin: '20px 30px 40px 50px' })],380  },381  {382    desc:   'a two property (a shorthand and one of its component longhands)'383            + ' two keyframe sequence',384    input:  [{ offset: 0, margin: '10px', marginTop: '20px' },385             { offset: 1, marginTop: '70px', margin: '30px 40px 50px 60px' }],386    output: [keyframe(offset(0), { margin: '10px', marginTop: '20px' }),387             keyframe(offset(1), { marginTop: '70px',388                                   margin: '30px 40px 50px 60px' })],389  },390  {391    desc:   'a two property keyframe sequence where one property is missing'392            + ' from the first keyframe',393    input:  [{ offset: 0, left: '10px' },394             { offset: 1, left: '20px', top: '30px' }],395    output: [keyframe(offset(0), { left: '10px' }),396             keyframe(offset(1), { left: '20px', top: '30px' })],397  },398  {399    desc:   'a two property keyframe sequence where one property is missing'400            + ' from the last keyframe',401    input:  [{ offset: 0, left: '10px', top: '20px' },402             { offset: 1, left: '30px' }],403    output: [keyframe(offset(0), { left: '10px', top: '20px' }),404             keyframe(offset(1), { left: '30px' })],405  },406  {407    desc:   'a one property two keyframe sequence that needs to stringify'408            + ' its values',409    input:  [{ offset: 0, opacity: 0 },410             { offset: 1, opacity: 1 }],411    output: [keyframe(offset(0), { opacity: '0' }),412             keyframe(offset(1), { opacity: '1' })],413  },414  {415    desc:   'a keyframe sequence with a CSS variable reference',416    input:  [{ left: 'var(--dist)' },417             { left: 'calc(var(--dist) + 100px)' }],418    output: [keyframe(computedOffset(0), { left: 'var(--dist)' }),419             keyframe(computedOffset(1), { left: 'calc(var(--dist) + 100px)' })]420  },421  {422    desc:   'a keyframe sequence with a CSS variable reference in a shorthand'423            + ' property',424    input:  [{ margin: 'var(--dist)' },425             { margin: 'calc(var(--dist) + 100px)' }],426    output: [keyframe(computedOffset(0),427                      { margin: 'var(--dist)' }),428             keyframe(computedOffset(1),429                      { margin: 'calc(var(--dist) + 100px)' })],430  },431  // ----------- Keyframe sequence: offset handling -----------432  {433    desc:   'a keyframe sequence with duplicate values for a given interior'434            + ' offset',435    input:  [{ offset: 0.0, left: '10px' },436             { offset: 0.5, left: '20px' },437             { offset: 0.5, left: '30px' },438             { offset: 0.5, left: '40px' },439             { offset: 1.0, left: '50px' }],440    output: [keyframe(offset(0),   { left: '10px' }),441             keyframe(offset(0.5), { left: '20px' }),442             keyframe(offset(0.5), { left: '30px' }),443             keyframe(offset(0.5), { left: '40px' }),444             keyframe(offset(1),   { left: '50px' })],445  },446  {447    desc:   'a keyframe sequence with duplicate values for offsets 0 and 1',448    input:  [{ offset: 0, left: '10px' },449             { offset: 0, left: '20px' },450             { offset: 0, left: '30px' },451             { offset: 1, left: '40px' },452             { offset: 1, left: '50px' },453             { offset: 1, left: '60px' }],454    output: [keyframe(offset(0), { left: '10px' }),455             keyframe(offset(0), { left: '20px' }),456             keyframe(offset(0), { left: '30px' }),457             keyframe(offset(1), { left: '40px' }),458             keyframe(offset(1), { left: '50px' }),459             keyframe(offset(1), { left: '60px' })],460  },461  {462    desc:   'a two property four keyframe sequence',463    input:  [{ offset: 0, left: '10px' },464             { offset: 0, top: '20px' },465             { offset: 1, top: '30px' },466             { offset: 1, left: '40px' }],467    output: [keyframe(offset(0), { left: '10px' }),468             keyframe(offset(0), { top:  '20px' }),469             keyframe(offset(1), { top:  '30px' }),470             keyframe(offset(1), { left: '40px' })],471  },472  {473    desc:   'a single keyframe sequence with omitted offset',474    input:  [{ left: '10px' }],475    output: [keyframe(computedOffset(1), { left: '10px' })],476  },477  {478    desc:   'a single keyframe sequence with null offset',479    input:  [{ offset: null, left: '10px' }],480    output: [keyframe(computedOffset(1), { left: '10px' })],481  },482  {483    desc:   'a single keyframe sequence with string offset',484    input:  [{ offset: '0.5', left: '10px' }],485    output: [keyframe(offset(0.5), { left: '10px' })],486  },487  {488    desc:   'a one property keyframe sequence with some omitted offsets',489    input:  [{ offset: 0.00, left: '10px' },490             { offset: 0.25, left: '20px' },491             { left: '30px' },492             { left: '40px' },493             { offset: 1.00, left: '50px' }],494    output: [keyframe(offset(0),            { left: '10px' }),495             keyframe(offset(0.25),         { left: '20px' }),496             keyframe(computedOffset(0.5),  { left: '30px' }),497             keyframe(computedOffset(0.75), { left: '40px' }),498             keyframe(offset(1),            { left: '50px' })],499  },500  {501    desc:   'a one property keyframe sequence with some null offsets',502    input:  [{ offset: 0.00, left: '10px' },503             { offset: 0.25, left: '20px' },504             { offset: null, left: '30px' },505             { offset: null, left: '40px' },506             { offset: 1.00, left: '50px' }],507    output: [keyframe(offset(0),            { left: '10px' }),508             keyframe(offset(0.25),         { left: '20px' }),509             keyframe(computedOffset(0.5),  { left: '30px' }),510             keyframe(computedOffset(0.75), { left: '40px' }),511             keyframe(offset(1),            { left: '50px' })],512  },513  {514    desc:   'a two property keyframe sequence with some omitted offsets',515    input:  [{ offset: 0.00, left: '10px', top: '20px' },516             { offset: 0.25, left: '30px' },517             { left: '40px' },518             { left: '50px', top: '60px' },519             { offset: 1.00, left: '70px', top: '80px' }],520    output: [keyframe(offset(0),            { left: '10px', top: '20px' }),521             keyframe(offset(0.25),         { left: '30px' }),522             keyframe(computedOffset(0.5),  { left: '40px' }),523             keyframe(computedOffset(0.75), { left: '50px', top: '60px' }),524             keyframe(offset(1),            { left: '70px', top: '80px' })],525  },526  {527    desc:   'a one property keyframe sequence with all omitted offsets',528    input:  [{ left: '10px' },529             { left: '20px' },530             { left: '30px' },531             { left: '40px' },532             { left: '50px' }],533    output: [keyframe(computedOffset(0),    { left: '10px' }),534             keyframe(computedOffset(0.25), { left: '20px' }),535             keyframe(computedOffset(0.5),  { left: '30px' }),536             keyframe(computedOffset(0.75), { left: '40px' }),537             keyframe(computedOffset(1),    { left: '50px' })],538  },539  // ----------- Keyframe sequence: easing handling -----------540  {541    desc:   'a keyframe sequence with different easing values, but the same'542            + ' easing value for a given offset',543    input:  [{ offset: 0.0, easing: 'ease',     left: '10px'},544             { offset: 0.0, easing: 'ease',     top: '20px'},545             { offset: 0.5, easing: 'linear',   left: '30px' },546             { offset: 0.5, easing: 'linear',   top: '40px' },547             { offset: 1.0, easing: 'step-end', left: '50px' },548             { offset: 1.0, easing: 'step-end', top: '60px' }],549    output: [keyframe(offset(0),   { left: '10px' }, 'ease'),550             keyframe(offset(0),   { top:  '20px' }, 'ease'),551             keyframe(offset(0.5), { left: '30px' }, 'linear'),...

keyframe-utils.js

Source:keyframe-utils.js

1"use strict";2// Utility functions and common keyframe test data.3// ------------------------------4//  Helper functions5// ------------------------------6/**7 * Test equality between two lists of computed keyframes8 * @param {Array.<ComputedKeyframe>} a - actual computed keyframes9 * @param {Array.<ComputedKeyframe>} b - expected computed keyframes10 */11function assert_frame_lists_equal(a, b) {12  assert_equals(a.length, b.length, "number of frames");13  for (var i = 0; i < Math.min(a.length, b.length); i++) {14    assert_frames_equal(a[i], b[i], "ComputedKeyframe #" + i);15  }16}17/** Helper */18function assert_frames_equal(a, b, name) {19  assert_equals(Object.keys(a).sort().toString(),20                Object.keys(b).sort().toString(),21                "properties on " + name);22  for (var p in a) {23    assert_equals(a[p], b[p], "value for '" + p + "' on " + name);24  }25}26// ------------------------------27//  Easing values28// ------------------------------29// [specified easing value, expected easing value]30var gEasingValueTests = [31  ["linear", "linear"],32  ["ease-in-out", "ease-in-out"],33  ["Ease\\2d in-out", "ease-in-out"],34  ["ease /**/", "ease"],35];36var gInvalidEasingInKeyframeSequenceTests = [37  { desc:   "a blank easing",38    input:  [{ easing: "" }] },39  { desc:   "an unrecognized easing",40    input:  [{ easing: "unrecognized" }] },41  { desc:   "an 'initial' easing",42    input:  [{ easing: "initial" }] },43  { desc:   "an 'inherit' easing",44    input:  [{ easing: "inherit" }] },45  { desc:   "a variable easing",46    input:  [{ easing: "var(--x)" }] },47  { desc:   "a multi-value easing",48    input:  [{ easing: "ease-in-out, ease-out" }] }49];50// ------------------------------51//  Composite values52// ------------------------------53var gGoodKeyframeCompositeValueTests = [54  "replace", "add", "accumulate", undefined55];56var gGoodOptionsCompositeValueTests = [57  "replace", "add", "accumulate"58];59var gBadCompositeValueTests = [60  "unrecognised", "replace ", "Replace", null61];62// ------------------------------63//  Keyframes64// ------------------------------65var gEmptyKeyframeListTests = [66  [],67  null,68  undefined,69];70var gPropertyIndexedKeyframesTests = [71  { desc:   "a one property two value property-indexed keyframes specification",72    input:  { left: ["10px", "20px"] },73    output: [{ offset: null, computedOffset: 0, easing: "linear",74               left: "10px" },75             { offset: null, computedOffset: 1, easing: "linear",76               left: "20px" }] },77  { desc:   "a one shorthand property two value property-indexed keyframes"78            + " specification",79    input:  { margin: ["10px", "10px 20px 30px 40px"] },80    output: [{ offset: null, computedOffset: 0, easing: "linear",81               margin: "10px" },82             { offset: null, computedOffset: 1, easing: "linear",83               margin: "10px 20px 30px 40px" }] },84  { desc:   "a two property (one shorthand and one of its longhand components)"85            + " two value property-indexed keyframes specification",86    input:  { marginTop: ["50px", "60px"],87              margin: ["10px", "10px 20px 30px 40px"] },88    output: [{ offset: null, computedOffset: 0, easing: "linear",89               marginTop: "50px", margin: "10px" },90             { offset: null, computedOffset: 1, easing: "linear",91               marginTop: "60px", margin: "10px 20px 30px 40px" }] },92  { desc:   "a two property two value property-indexed keyframes specification",93    input:  { left: ["10px", "20px"],94              top: ["30px", "40px"] },95    output: [{ offset: null, computedOffset: 0, easing: "linear",96               left: "10px", top: "30px" },97             { offset: null, computedOffset: 1, easing: "linear",98               left: "20px", top: "40px" }] },99  { desc:   "a two property property-indexed keyframes specification with"100            + " different numbers of values",101    input:  { left: ["10px", "20px", "30px"],102              top: ["40px", "50px"] },103    output: [{ offset: null, computedOffset: 0.0, easing: "linear",104               left: "10px", top: "40px" },105             { offset: null, computedOffset: 0.5, easing: "linear",106               left: "20px" },107             { offset: null, computedOffset: 1.0, easing: "linear",108               left: "30px", top: "50px" }] },109  { desc:   "a property-indexed keyframes specification with an invalid value",110    input:  { left: ["10px", "20px", "30px", "40px", "50px"],111              top:  ["15px", "25px", "invalid", "45px", "55px"] },112    output: [{ offset: null, computedOffset: 0.00, easing: "linear",113               left: "10px", top: "15px" },114             { offset: null, computedOffset: 0.25, easing: "linear",115               left: "20px", top: "25px" },116             { offset: null, computedOffset: 0.50, easing: "linear",117               left: "30px", top: "invalid" },118             { offset: null, computedOffset: 0.75, easing: "linear",119               left: "40px", top: "45px" },120             { offset: null, computedOffset: 1.00, easing: "linear",121               left: "50px", top: "55px" }] },122  { desc:   "a one property two value property-indexed keyframes specification"123            + " that needs to stringify its values",124    input:  { opacity: [0, 1] },125    output: [{ offset: null, computedOffset: 0, easing: "linear",126               opacity: "0" },127             { offset: null, computedOffset: 1, easing: "linear",128               opacity: "1" }] },129  { desc:   "a property-indexed keyframes specification with a CSS variable"130            + " reference",131    input:  { left: [ "var(--dist)", "calc(var(--dist) + 100px)" ] },132    output: [{ offset: null, computedOffset: 0.0, easing: "linear",133               left: "var(--dist)" },134             { offset: null, computedOffset: 1.0, easing: "linear",135               left: "calc(var(--dist) + 100px)" }] },136  { desc:   "a property-indexed keyframes specification with a CSS variable"137            + " reference in a shorthand property",138    input:  { margin: [ "var(--dist)", "calc(var(--dist) + 100px)" ] },139    output: [{ offset: null, computedOffset: 0.0, easing: "linear",140               margin: "var(--dist)" },141             { offset: null, computedOffset: 1.0, easing: "linear",142               margin: "calc(var(--dist) + 100px)" }] },143  { desc:   "a one property one value property-indexed keyframes specification",144    input:  { left: ["10px"] },145    output: [{ offset: null, computedOffset: 1, easing: "linear",146               left: "10px" }] },147  { desc:   "a one property one non-array value property-indexed keyframes"148            + " specification",149    input:  { left: "10px" },150    output: [{ offset: null, computedOffset: 1, easing: "linear",151               left: "10px" }] },152  { desc:   "a one property two value property-indexed keyframes specification"153            + " where the first value is invalid",154    input:  { left: ["invalid", "10px"] },155    output: [{ offset: null, computedOffset: 0, easing: "linear",156               left: "invalid" },157             { offset: null, computedOffset: 1, easing: "linear",158               left: "10px" }] },159  { desc:   "a one property two value property-indexed keyframes specification"160            + " where the second value is invalid",161    input:  { left: ["10px", "invalid"] },162    output: [{ offset: null, computedOffset: 0, easing: "linear",163               left: "10px" },164             { offset: null, computedOffset: 1, easing: "linear",165               left: "invalid" }] },166];167var gKeyframeSequenceTests = [168  { desc:   "a one property one keyframe sequence",169    input:  [{ offset: 1, left: "10px" }],170    output: [{ offset: null, computedOffset: 1, easing: "linear",171               left: "10px" }] },172  { desc:   "a one property two keyframe sequence",173    input:  [{ offset: 0, left: "10px" },174             { offset: 1, left: "20px" }],175    output: [{ offset: 0, computedOffset: 0, easing: "linear", left: "10px" },176             { offset: 1, computedOffset: 1, easing: "linear", left: "20px" }]177  },178  { desc:   "a two property two keyframe sequence",179    input:  [{ offset: 0, left: "10px", top: "30px" },180             { offset: 1, left: "20px", top: "40px" }],181    output: [{ offset: 0, computedOffset: 0, easing: "linear",182               left: "10px", top: "30px" },183             { offset: 1, computedOffset: 1, easing: "linear",184               left: "20px", top: "40px" }] },185  { desc:   "a one shorthand property two keyframe sequence",186    input:  [{ offset: 0, margin: "10px" },187             { offset: 1, margin: "20px 30px 40px 50px" }],188    output: [{ offset: 0, computedOffset: 0, easing: "linear",189               margin: "10px" },190             { offset: 1, computedOffset: 1, easing: "linear",191               margin: "20px 30px 40px 50px" }] },192  { desc:   "a two property (a shorthand and one of its component longhands)"193            + " two keyframe sequence",194    input:  [{ offset: 0, margin: "10px", marginTop: "20px" },195             { offset: 1, marginTop: "70px", margin: "30px 40px 50px 60px" }],196    output: [{ offset: 0, computedOffset: 0, easing: "linear",197               margin: "10px", marginTop: "20px" },198             { offset: 1, computedOffset: 1, easing: "linear",199               marginTop: "70px", margin: "30px 40px 50px 60px" }] },200  { desc:   "a keyframe sequence with duplicate values for a given interior"201            + " offset",202    input:  [{ offset: 0.0, left: "10px" },203             { offset: 0.5, left: "20px" },204             { offset: 0.5, left: "30px" },205             { offset: 0.5, left: "40px" },206             { offset: 1.0, left: "50px" }],207    output: [{ offset: 0.0, computedOffset: 0.0, easing: "linear",208               left: "10px" },209             { offset: 0.5, computedOffset: 0.5, easing: "linear",210               left: "20px" },211             { offset: 0.5, computedOffset: 0.5, easing: "linear",212               left: "30px" },213             { offset: 0.5, computedOffset: 0.5, easing: "linear",214               left: "40px" },215             { offset: 1.0, computedOffset: 1.0, easing: "linear",216               left: "50px" }] },217  { desc:   "a keyframe sequence with duplicate values for offsets 0 and 1",218    input:  [{ offset: 0, left: "10px" },219             { offset: 0, left: "20px" },220             { offset: 0, left: "30px" },221             { offset: 1, left: "40px" },222             { offset: 1, left: "50px" },223             { offset: 1, left: "60px" }],224    output: [{ offset: 0, computedOffset: 0, easing: "linear", left: "10px" },225             { offset: 0, computedOffset: 0, easing: "linear", left: "20px" },226             { offset: 0, computedOffset: 0, easing: "linear", left: "30px" },227             { offset: 1, computedOffset: 1, easing: "linear", left: "40px" },228             { offset: 1, computedOffset: 1, easing: "linear", left: "50px" },229             { offset: 1, computedOffset: 1, easing: "linear", left: "60px" }]230  },231  { desc:   "a two property four keyframe sequence",232    input:  [{ offset: 0, left: "10px" },233             { offset: 0, top: "20px" },234             { offset: 1, top: "30px" },235             { offset: 1, left: "40px" }],236    output: [{ offset: 0, computedOffset: 0, easing: "linear", left: "10px" },237             { offset: 0, computedOffset: 0, easing: "linear", top: "20px" },238             { offset: 1, computedOffset: 1, easing: "linear", top: "30px" },239             { offset: 1, computedOffset: 1, easing: "linear", left: "40px" }]240  },241  { desc:   "a single keyframe sequence with omitted offsets",242    input:  [{ left: "10px" }],243    output: [{ offset: null, computedOffset: 1, easing: "linear",244               left: "10px" }] },245  { desc:   "a one property keyframe sequence with some omitted offsets",246    input:  [{ offset: 0.00, left: "10px" },247             { offset: 0.25, left: "20px" },248             { left: "30px" },249             { left: "40px" },250             { offset: 1.00, left: "50px" }],251    output: [{ offset: 0.00, computedOffset: 0.00, easing: "linear",252               left: "10px" },253             { offset: 0.25, computedOffset: 0.25, easing: "linear",254               left: "20px" },255             { offset: null, computedOffset: 0.50, easing: "linear",256               left: "30px" },257             { offset: null, computedOffset: 0.75, easing: "linear",258               left: "40px" },259             { offset: 1.00, computedOffset: 1.00, easing: "linear",260               left: "50px" }] },261  { desc:   "a two property keyframe sequence with some omitted offsets",262    input:  [{ offset: 0.00, left: "10px", top: "20px" },263             { offset: 0.25, left: "30px" },264             { left: "40px" },265             { left: "50px", top: "60px" },266             { offset: 1.00, left: "70px", top: "80px" }],267    output: [{ offset: 0.00, computedOffset: 0.00, easing: "linear",268               left: "10px", top: "20px" },269             { offset: 0.25, computedOffset: 0.25, easing: "linear",270               left: "30px" },271             { offset: null, computedOffset: 0.50, easing: "linear",272               left: "40px" },273             { offset: null, computedOffset: 0.75, easing: "linear",274               left: "50px", top: "60px" },275             { offset: 1.00, computedOffset: 1.00, easing: "linear",276               left: "70px", top: "80px" }] },277  { desc:   "a one property keyframe sequence with all omitted offsets",278    input:  [{ left: "10px" },279             { left: "20px" },280             { left: "30px" },281             { left: "40px" },282             { left: "50px" }],283    output: [{ offset: null, computedOffset: 0.00, easing: "linear",284               left: "10px" },285             { offset: null, computedOffset: 0.25, easing: "linear",286               left: "20px" },287             { offset: null, computedOffset: 0.50, easing: "linear",288               left: "30px" },289             { offset: null, computedOffset: 0.75, easing: "linear",290               left: "40px" },291             { offset: null, computedOffset: 1.00, easing: "linear",292               left: "50px" }] },293  { desc:   "a keyframe sequence with different easing values, but the same"294            + " easing value for a given offset",295    input:  [{ offset: 0.0, easing: "ease",     left: "10px"},296             { offset: 0.0, easing: "ease",     top: "20px"},297             { offset: 0.5, easing: "linear",   left: "30px" },298             { offset: 0.5, easing: "linear",   top: "40px" },299             { offset: 1.0, easing: "step-end", left: "50px" },300             { offset: 1.0, easing: "step-end", top: "60px" }],301    output: [{ offset: 0.0, computedOffset: 0.0, easing: "ease",302               left: "10px" },303             { offset: 0.0, computedOffset: 0.0, easing: "ease",304               top: "20px" },305             { offset: 0.5, computedOffset: 0.5, easing: "linear",306               left: "30px" },307             { offset: 0.5, computedOffset: 0.5, easing: "linear",308               top: "40px" },309             { offset: 1.0, computedOffset: 1.0, easing: "step-end",310               left: "50px" },311             { offset: 1.0, computedOffset: 1.0, easing: "step-end",312               top: "60px" }] },313  { desc:   "a keyframe sequence with different composite values, but the"314            + " same composite value for a given offset",315    input:  [{ offset: 0.0, composite: "replace", left: "10px" },316             { offset: 0.0, composite: "replace", top: "20px" },317             { offset: 0.5, composite: "add",     left: "30px" },318             { offset: 0.5, composite: "add",     top: "40px" },319             { offset: 1.0, composite: "replace", left: "50px" },320             { offset: 1.0, composite: "replace", top: "60px" }],321    output: [{ offset: 0.0, computedOffset: 0.0, easing: "linear",322               composite: "replace", left: "10px" },323             { offset: 0.0, computedOffset: 0.0, easing: "linear",324               composite: "replace", top: "20px" },325             { offset: 0.5, computedOffset: 0.0, easing: "linear",326               composite: "add", left: "30px" },327             { offset: 0.5, computedOffset: 0.0, easing: "linear",328               composite: "add", top: "40px" },329             { offset: 1.0, computedOffset: 1.0, easing: "linear",330               composite: "replace", left: "50px" },331             { offset: 1.0, computedOffset: 1.0, easing: "linear",332               composite: "replace", top: "60px" }] },333  { desc:   "a one property two keyframe sequence that needs to stringify"334            + " its values",335    input:  [{ offset: 0, opacity: 0 },336             { offset: 1, opacity: 1 }],337    output: [{ offset: 0, computedOffset: 0, easing: "linear", opacity: "0" },338             { offset: 1, computedOffset: 1, easing: "linear", opacity: "1" }]339  },340  { desc:   "a keyframe sequence with a CSS variable reference",341    input:  [{ left: "var(--dist)" },342             { left: "calc(var(--dist) + 100px)" }],343    output: [{ offset: null, computedOffset: 0.0, easing: "linear",344               left: "var(--dist)" },345             { offset: null, computedOffset: 1.0, easing: "linear",346               left: "calc(var(--dist) + 100px)" }] },347  { desc:   "a keyframe sequence with a CSS variable reference in a shorthand"348            + " property",349    input:  [{ margin: "var(--dist)" },350             { margin: "calc(var(--dist) + 100px)" }],351    output: [{ offset: null, computedOffset: 0.0, easing: "linear",352               margin: "var(--dist)" },353             { offset: null, computedOffset: 1.0, easing: "linear",354               margin: "calc(var(--dist) + 100px)" }] },355  { desc:   "a keyframe sequence where shorthand precedes longhand",356    input:  [{ offset: 0, margin: "10px", marginRight: "20px" },357             { offset: 1, margin: "30px" }],358    output: [{ offset: 0, computedOffset: 0, easing: "linear",359               margin: "10px", marginRight: "20px" },360             { offset: 1, computedOffset: 1, easing: "linear",361               margin: "30px" }] },362  { desc:   "a keyframe sequence where longhand precedes shorthand",363    input:  [{ offset: 0, marginRight: "20px", margin: "10px" },364             { offset: 1, margin: "30px" }],365    output: [{ offset: 0, computedOffset: 0, easing: "linear",366               marginRight: "20px", margin: "10px" },367             { offset: 1, computedOffset: 1, easing: "linear",368               margin: "30px" }] },369  { desc:   "a keyframe sequence where lesser shorthand precedes greater"370            + " shorthand",371    input:  [{ offset: 0,372               borderLeft: "1px solid rgb(1, 2, 3)",373               border: "2px dotted rgb(4, 5, 6)" },374             { offset: 1, border: "3px dashed rgb(7, 8, 9)" }],375    output: [{ offset: 0, computedOffset: 0, easing: "linear",376               borderLeft: "1px solid rgb(1, 2, 3)",377               border: "2px dotted rgb(4, 5, 6)" },378             { offset: 1, computedOffset: 1, easing: "linear",379               border: "3px dashed rgb(7, 8, 9)" }] },380  { desc:   "a keyframe sequence where greater shorthand precedes lesser"381            + " shorthand",382    input:  [{ offset: 0, border: "2px dotted rgb(4, 5, 6)",383               borderLeft: "1px solid rgb(1, 2, 3)" },384             { offset: 1, border: "3px dashed rgb(7, 8, 9)" }],385    output: [{ offset: 0, computedOffset: 0, easing: "linear",386               border: "2px dotted rgb(4, 5, 6)",387               borderLeft: "1px solid rgb(1, 2, 3)" },388             { offset: 1, computedOffset: 1, easing: "linear",389               border: "3px dashed rgb(7, 8, 9)" }] },390  { desc:   "a two property keyframe sequence where one property is missing"391            + " from the first keyframe",392    input:  [{ offset: 0, left: "10px" },393             { offset: 1, left: "20px", top: "30px" }],394    output: [{ offset: 0, computedOffset: 0, easing: "linear", left: "10px" },395             { offset: 1, computedOffset: 1, easing: "linear",396               left: "20px", top: "30px" }] },397  { desc:   "a two property keyframe sequence where one property is missing"398            + " from the last keyframe",399    input:  [{ offset: 0, left: "10px", top: "20px" },400             { offset: 1, left: "30px" }],401    output: [{ offset: 0, computedOffset: 0, easing: "linear",402               left: "10px" , top: "20px" },403             { offset: 1, computedOffset: 1, easing: "linear",404               left: "30px" }] },405  { desc:   "a keyframe sequence with repeated values at offset 1 with"406            + " different easings",407    input:  [{ offset: 0.0, left: "100px", easing: "ease" },408             { offset: 0.0, left: "200px", easing: "ease" },409             { offset: 0.5, left: "300px", easing: "linear" },410             { offset: 1.0, left: "400px", easing: "ease-out" },411             { offset: 1.0, left: "500px", easing: "step-end" }],412    output: [{ offset: 0.0, computedOffset: 0.0, easing: "ease",413               left: "100px" },414             { offset: 0.0, computedOffset: 0.0, easing: "ease",415               left: "200px" },416             { offset: 0.5, computedOffset: 0.5, easing: "linear",417               left: "300px" },418             { offset: 1.0, computedOffset: 1.0, easing: "ease-out",419               left: "400px" },420             { offset: 1.0, computedOffset: 1.0, easing: "step-end",421               left: "500px" }] },422];423var gInvalidKeyframesTests = [424  { desc:     "keyframes with an out-of-bounded positive offset",425    input:    [ { opacity: 0 },426                { opacity: 0.5, offset: 2 },427                { opacity: 1 } ],428    expected: { name: "TypeError" } },429  { desc:     "keyframes with an out-of-bounded negative offset",430    input:    [ { opacity: 0 },431                { opacity: 0.5, offset: -1 },432                { opacity: 1 } ],433    expected: { name: "TypeError" } },434  { desc:     "keyframes not loosely sorted by offset",435    input:    [ { opacity: 0, offset: 1 },436                { opacity: 1, offset: 0 } ],437    expected: { name: "TypeError" } },438  { desc:     "property-indexed keyframes with an invalid easing value",439    input:    { opacity: [ 0, 0.5, 1 ],440                easing: "inherit" },441    expected: { name: "TypeError" } },442  { desc:     "a keyframe sequence with an invalid easing value",443    input:    [ { opacity: 0, easing: "jumpy" },444                { opacity: 1 } ],445    expected: { name: "TypeError" } },446  { desc:     "keyframes with an invalid composite value",447    input:    [ { opacity: 0, composite: "alternate" },448                { opacity: 1 } ],449    expected: { name: "TypeError" } }450];451// ------------------------------452//  KeyframeEffectOptions453// ------------------------------454var gKeyframeEffectOptionTests = [455  { desc:     "an empty KeyframeEffectOptions object",456    input:    { },457    expected: { } },458  { desc:     "a normal KeyframeEffectOptions object",459    input:    { delay: 1000,460                fill: "auto",461                iterations: 5.5,462                duration: "auto",463                direction: "alternate" },464    expected: { delay: 1000,465                fill: "auto",466                iterations: 5.5,467                duration: "auto",468                direction: "alternate" } },469  { desc:     "a double value",470    input:    3000,471    expected: { duration: 3000 } },472  { desc:     "+Infinity",473    input:    Infinity,474    expected: { duration: Infinity } },475  { desc:     "an Infinity duration",476    input:    { duration: Infinity },477    expected: { duration: Infinity } },478  { desc:     "an auto duration",479    input:    { duration: "auto" },480    expected: { duration: "auto" } },481  { desc:     "an Infinity iterations",482    input:    { iterations: Infinity },483    expected: { iterations: Infinity } },484  { desc:     "an auto fill",485    input:    { fill: "auto" },486    expected: { fill: "auto" } },487  { desc:     "a forwards fill",488    input:    { fill: "forwards" },489    expected: { fill: "forwards" } }490];491var gInvalidKeyframeEffectOptionTests = [492  { desc:     "-Infinity",493    input:    -Infinity,494    expected: { name: "TypeError" } },495  { desc:     "NaN",496    input:    NaN,497    expected: { name: "TypeError" } },498  { desc:     "a negative value",499    input:    -1,500    expected: { name: "TypeError" } },501  { desc:     "a negative Infinity duration",502    input:    { duration: -Infinity },503    expected: { name: "TypeError" } },504  { desc:     "a NaN duration",505    input:    { duration: NaN },506    expected: { name: "TypeError" } },507  { desc:     "a negative duration",508    input:    { duration: -1 },509    expected: { name: "TypeError" } },510  { desc:     "a string duration",511    input:    { duration: "merrychristmas" },512    expected: { name: "TypeError" } },513  { desc:     "a negative Infinity iterations",514    input:    { iterations: -Infinity},515    expected: { name: "TypeError" } },516  { desc:     "a NaN iterations",517    input:    { iterations: NaN },518    expected: { name: "TypeError" } },519  { desc:     "a negative iterations",520    input:    { iterations: -1 },521    expected: { name: "TypeError" } },522  { desc:     "a blank easing",523    input:    { easing: "" },524    expected: { name: "TypeError" } },525  { desc:     "an unrecognized easing",526    input:    { easing: "unrecognised" },527    expected: { name: "TypeError" } },528  { desc:     "an 'initial' easing",529    input:    { easing: "initial" },530    expected: { name: "TypeError" } },531  { desc:     "an 'inherit' easing",532    input:    { easing: "inherit" },533    expected: { name: "TypeError" } },534  { desc:     "a variable easing",535    input:    { easing: "var(--x)" },536    expected: { name: "TypeError" } },537  { desc:     "a multi-value easing",538    input:    { easing: "ease-in-out, ease-out" },539    expected: { name: "TypeError" } }...

Using AI Code Generation

1var wpt = require('webpagetest');2var test = wpt('API_KEY');3var options = {4};5test.runTest(options, function(err, data) {6    if (err) console.log(err);7    else {8        test.getTestResults(data.data.testId, function(err, data) {9            if (err) console.log(err);10            else {11                console.log(data.data.average.firstView.computedOffset);12            }13        });14    }15});

Using AI Code Generation

1var textArea = document.getElementById('wptextarea');2var computedOffset = textArea.computedOffset();3console.log(computedOffset);4var textArea = document.getElementById('wptextarea');5var computedOffset = textArea.computedOffset();6console.log(computedOffset);7I think that is a good idea, but I am not sure if the method should be called computedOffset() or offset()

Using AI Code Generation

1var textArea = document.getElementById("textArea");2textArea.computedOffset();3var textArea = document.getElementById("textArea");4textArea.getSelection();5var textArea = document.getElementById("textArea");6textArea.setSelection(1, 3);7var textArea = document.getElementById("textArea");8textArea.getSelectionStart();9var textArea = document.getElementById("textArea");10textArea.setSelectionStart(1);11var textArea = document.getElementById("textArea");12textArea.getSelectionEnd();13var textArea = document.getElementById("textArea");14textArea.setSelectionEnd(1);15var textArea = document.getElementById("textArea");16textArea.getSelectionRange();17var textArea = document.getElementById("textArea");18textArea.setSelectionRange(1, 3);19var textArea = document.getElementById("textArea");20textArea.getSelectionText();21var textArea = document.getElementById("textArea");22textArea.setSelectionText("Hello");23var textArea = document.getElementById("textArea");24textArea.getSelectionHtml();25var textArea = document.getElementById("textArea");26textArea.setSelectionHtml("<b>Hello</b>");27var textArea = document.getElementById("textArea");28textArea.getSelectionNode();

Using AI Code Generation

1var win = Ti.UI.currentWindow;2var tf = Ti.UI.createTextField({3});4win.add(tf);5var offset = tf.computedOffset(10);6Ti.API.info('offset: ' + offset);7var label = Ti.UI.createLabel({8});9win.add(label);10Ti.UI.TextField.prototype.computedOffset = function(position)11{12    var tf = this;13    if (tf._nativeView)14    {15        var offset = tf._nativeView.computedOffset(position);16        return offset;17    }18    {19        return 0;20    }21};22Ti.UI.TextField.prototype.computedOffset = function(position)23{24    var tf = this;25    if (tf._nativeView)26    {27        var offset = tf._nativeView.computedOffset(position);28        return offset;29    }30    {31        return 0;32    }33};34Ti.UI.TextField.prototype.computedOffset = function(position)35{36    var tf = this;37    if (tf._nativeView)38    {39        var offset = tf._nativeView.computedOffset(position);40        return offset;41    }42    {43        return 0;44    }45};46Ti.UI.TextField.prototype.computedOffset = function(position)47{48    var tf = this;49    if (tf._nativeView)50    {51        var offset = tf._nativeView.computedOffset(position);52        return offset;53    }54    {

Using AI Code Generation

1var ta = document.getElementById("mytextarea");2ta.focus();3ta.computedOffset(5, 10);4ta.computedOffset(5, 10, true);5ta.computedOffset(5, 10, false);6ta.computedOffset(5, 10, true, true);7ta.computedOffset(5, 10, false, true);8ta.computedOffset(5, 10, true, false);9ta.computedOffset(5, 10, false, false);10var ta = document.getElementById("mytextarea");11ta.focus();12var pos = ta.computedOffset();13var pos = ta.computedOffset(true);14var pos = ta.computedOffset(false);15var pos = ta.computedOffset(true, true);16var pos = ta.computedOffset(false, true);17var pos = ta.computedOffset(true, false);18var pos = ta.computedOffset(false, false);19<textarea id="mytextarea" style="width: 200px; height: 100px;"></textarea>20<textarea id="mytextarea" style="width: 200px; height: 100px;"></textarea>21var ta = document.getElementById("mytextarea");22ta.focus();23ta.computedOffset(5, 10);24ta.computedOffset(5, 10, true);25ta.computedOffset(5, 10, false);26ta.computedOffset(5, 10, true, true);27ta.computedOffset(5, 10, false, true);28ta.computedOffset(5, 10, true, false);29ta.computedOffset(5, 10, false, false);30var ta = document.getElementById("mytextarea");31ta.focus();32var pos = ta.computedOffset();33var pos = ta.computedOffset(true);

Using AI Code Generation

1var offset = this.wptextarea.computedOffset();2console.log('offset is ' + offset);3this.wptextarea.setCursor(offset);4this.wptextarea.setSelection(0, 10);5this.wptextarea.setSelection(10, 0);6var selection = this.wptextarea.getSelection();7console.log('selection is ' + selection);8var selection = this.wptextarea.getSelection();9console.log('selection is ' + selection);10this.wptextarea.insertText('some text');11this.wptextarea.insertText('some text', 10);12this.wptextarea.insertText('some text', 0);13this.wptextarea.insertText('some text', this.wptextarea.length);14this.wptextarea.insertText('some text', this.wpt

Using AI Code Generation

1var wptools = require('wptools');2var wp = new wptools.page('en.wikipedia.org/wiki/United_States');3wp.computedOffset(2016, 1, 1, 0, 0, 0, function(err, offset) {4  console.log(offset);5});6var wptools = require('wptools');7var wp = new wptools.page('en.wikipedia.org/wiki/United_States');8wp.computedOffset('2016-01-01T00:00:00Z', function(err, offset) {9  console.log(offset);10});11var wptools = require('wptools');12var wp = new wptools.page('en.wikipedia.org/wiki/United_States');13wp.computedOffset('2016-01-01T00:00:00Z', '2015-01-01T00:00:00Z', function(err, offset) {14  console.log(offset);15});16var wptools = require('wptools');17var wp = new wptools.page('en.wikipedia.org/wiki/United_States');18wp.computedOffset('2016-01-01T00:00:00Z', '2015-01-01T00:00:00Z', '2014-01-01T00:00:00Z', function(err, offset) {19  console.log(offset);20});21var wptools = require('wptools');22var wp = new wptools.page('en.wikipedia.org/wiki/United_States');23wp.computedOffset('2016-01-01T00:00:00Z', '2015-01-01T00:00:00Z', '2014-01-01T00:00:00Z', '2013-01-01T

Using AI Code Generation

1var wptouch = new WPTouch();2var offset = wptouch.computedOffset( document.getElementById("element") );3function WPTouch() {4    this.computedOffset = function (el) {5        var top = 0, left = 0;6        do {7            top += el.offsetTop  || 0;8            left += el.offsetLeft || 0;9            el = el.offsetParent;10        } while (el);11        return {12        };13    };14}15function WPTouch() {16    this.computedOffset = function (el) {17        var top = 0, left = 0;18        do {19            top += el.offsetTop  || 0;20            left += el.offsetLeft || 0;21            el = el.offsetParent;22        } while (el);23        return {24        };25    };26}27function WPTouch() {28    this.computedOffset = function (el) {29        var top = 0, left = 0;30        do {31            top += el.offsetTop  || 0;32            left += el.offsetLeft || 0;33            el = el.offsetParent;34        } while (el);35        return {36        };37    };38}39function WPTouch() {40    this.computedOffset = function (el) {41        var top = 0, left = 0;42        do {43            top += el.offsetTop  || 0;44            left += el.offsetLeft || 0;45            el = el.offsetParent;46        } while (el);47        return {48        };49    };50}51function WPTouch() {52    this.computedOffset = function (el) {53        var top = 0, left = 0;54        do {55            top += el.offsetTop  || 0;56            left += el.offsetLeft || 0;57            el = el.offsetParent;58        } while (el);59        return {

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.