tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

db_smilCSSFromTo.js (21359B)

      1 /* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
      2 /* vim: set ts=2 sw=2 sts=2 et: */
      3 /* This Source Code Form is subject to the terms of the Mozilla Public
      4 * License, v. 2.0. If a copy of the MPL was not distributed with this
      5 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
      6 
      7 /* testcase data for simple "from-to" animations of CSS properties */
      8 
      9 // NOTE: This js file requires db_smilCSSPropertyList.js
     10 
     11 // NOTE: I'm Including 'inherit' and 'currentColor' as interpolatable values.
     12 // According to SVG Mobile 1.2 section 16.2.9, "keywords such as inherit which
     13 // yield a numeric computed value may be included in the values list for an
     14 // interpolated animation".
     15 
     16 // Path of test URL (stripping off final slash + filename), for use in
     17 // generating computed value of 'cursor' property
     18 var _testPath = document.URL.substring(0, document.URL.lastIndexOf("/"));
     19 
     20 // Lists of testcases for re-use across multiple properties of the same type
     21 var _fromToTestLists = {
     22  color: [
     23    new AnimTestcaseFromTo("rgb(100, 100, 100)", "rgb(200, 200, 200)", {
     24      midComp: "rgb(150, 150, 150)",
     25    }),
     26    new AnimTestcaseFromTo("#F02000", "#0080A0", {
     27      fromComp: "rgb(240, 32, 0)",
     28      midComp: "rgb(120, 80, 80)",
     29      toComp: "rgb(0, 128, 160)",
     30    }),
     31    new AnimTestcaseFromTo("crimson", "lawngreen", {
     32      fromComp: "rgb(220, 20, 60)",
     33      midComp: "rgb(172, 136, 30)",
     34      toComp: "rgb(124, 252, 0)",
     35    }),
     36    new AnimTestcaseFromTo("currentColor", "rgb(100, 100, 100)", {
     37      fromComp: "rgb(50, 50, 50)",
     38      midComp: "rgb(75, 75, 75)",
     39    }),
     40    new AnimTestcaseFromTo(
     41      "rgba(10, 20, 30, 0.2)",
     42      "rgba(50, 50, 50, 1)",
     43      // (rgb(10, 20, 30) * 0.2 * 0.5 + rgb(50, 50, 50) * 1.0 * 0.5) * (1 / 0.6)
     44      { midComp: "rgba(43, 45, 47, 0.6)", toComp: "rgb(50, 50, 50)" }
     45    ),
     46  ],
     47  colorFromInheritBlack: [
     48    new AnimTestcaseFromTo("inherit", "rgb(200, 200, 200)", {
     49      fromComp: "rgb(0, 0, 0)",
     50      midComp: "rgb(100, 100, 100)",
     51    }),
     52  ],
     53  colorFromInheritWhite: [
     54    new AnimTestcaseFromTo("inherit", "rgb(205, 205, 205)", {
     55      fromComp: "rgb(255, 255, 255)",
     56      midComp: "rgb(230, 230, 230)",
     57    }),
     58  ],
     59  paintServer: [
     60    new AnimTestcaseFromTo("none", "none"),
     61    new AnimTestcaseFromTo("none", "blue", { toComp: "rgb(0, 0, 255)" }),
     62    new AnimTestcaseFromTo("rgb(50, 50, 50)", "none"),
     63    new AnimTestcaseFromTo(
     64      "url(#gradA)",
     65      "url(#gradB) currentColor",
     66      {
     67        fromComp: 'url("' + document.URL + '#gradA") rgb(0, 0, 0)',
     68        toComp: 'url("' + document.URL + '#gradB") rgb(50, 50, 50)',
     69      },
     70      "need support for URI-based paints"
     71    ),
     72    new AnimTestcaseFromTo(
     73      "url(#gradA) orange",
     74      "url(#gradB)",
     75      {
     76        fromComp: 'url("' + document.URL + '#gradA") rgb(255, 165, 0)',
     77        toComp: 'url("' + document.URL + '#gradB") rgb(0, 0, 0)',
     78      },
     79      "need support for URI-based paints"
     80    ),
     81    new AnimTestcaseFromTo(
     82      "url(#no_grad)",
     83      "url(#gradB)",
     84      {
     85        fromComp: 'url("' + document.URL + '#no_grad") ' + "rgb(0, 0, 0)",
     86        toComp: 'url("' + document.URL + '#gradB") rgb(0, 0, 0)',
     87      },
     88      "need support for URI-based paints"
     89    ),
     90    new AnimTestcaseFromTo(
     91      "url(#no_grad) rgb(1,2,3)",
     92      "url(#gradB) blue",
     93      {
     94        fromComp: 'url("' + document.URL + '#no_grad") ' + "rgb(1, 2, 3)",
     95        toComp: 'url("' + document.URL + '#gradB") rgb(0, 0, 255)',
     96      },
     97      "need support for URI-based paints"
     98    ),
     99  ],
    100  lengthNoUnits: [
    101    new AnimTestcaseFromTo("0", "20", {
    102      fromComp: "0px",
    103      midComp: "10px",
    104      toComp: "20px",
    105    }),
    106    new AnimTestcaseFromTo("50", "0", {
    107      fromComp: "50px",
    108      midComp: "25px",
    109      toComp: "0px",
    110    }),
    111    new AnimTestcaseFromTo("30", "80", {
    112      fromComp: "30px",
    113      midComp: "55px",
    114      toComp: "80px",
    115    }),
    116  ],
    117  lengthPx: [
    118    new AnimTestcaseFromTo("0px", "12px", {
    119      fromComp: "0px",
    120      midComp: "6px",
    121      toComp: "12px",
    122    }),
    123    new AnimTestcaseFromTo("16px", "0px", {
    124      fromComp: "16px",
    125      midComp: "8px",
    126      toComp: "0px",
    127    }),
    128    new AnimTestcaseFromTo("10px", "20px", {
    129      fromComp: "10px",
    130      midComp: "15px",
    131      toComp: "20px",
    132    }),
    133    new AnimTestcaseFromTo("41px", "1px", {
    134      fromComp: "41px",
    135      midComp: "21px",
    136      toComp: "1px",
    137    }),
    138  ],
    139  lengthPctSVG: [new AnimTestcaseFromTo("20.5%", "0.5%", { midComp: "10.5%" })],
    140  lengthPxPctSVG: [
    141    new AnimTestcaseFromTo(
    142      "10px",
    143      "10%",
    144      { midComp: "15px" },
    145      "need support for interpolating between " + "px and percent values"
    146    ),
    147  ],
    148  lengthPxNoUnitsSVG: [
    149    new AnimTestcaseFromTo("10", "20px", {
    150      fromComp: "10px",
    151      midComp: "15px",
    152      toComp: "20px",
    153    }),
    154    new AnimTestcaseFromTo("10px", "20", {
    155      fromComp: "10px",
    156      midComp: "15px",
    157      toComp: "20px",
    158    }),
    159  ],
    160  opacity: [
    161    new AnimTestcaseFromTo("1", "0", { midComp: "0.5" }),
    162    new AnimTestcaseFromTo("0.2", "0.12", { midComp: "0.16" }),
    163    new AnimTestcaseFromTo("0.5", "0.7", { midComp: "0.6" }),
    164    new AnimTestcaseFromTo("0.5", "inherit", { midComp: "0.75", toComp: "1" }),
    165    // Make sure we don't clamp out-of-range values before interpolation
    166    new AnimTestcaseFromTo(
    167      "0.2",
    168      "1.2",
    169      { midComp: "0.7", toComp: "1" },
    170      "opacities with abs val >1 get clamped too early"
    171    ),
    172    new AnimTestcaseFromTo("-0.2", "0.6", { fromComp: "0", midComp: "0.2" }),
    173    new AnimTestcaseFromTo(
    174      "-1.2",
    175      "1.6",
    176      { fromComp: "0", midComp: "0.2", toComp: "1" },
    177      "opacities with abs val >1 get clamped too early"
    178    ),
    179    new AnimTestcaseFromTo(
    180      "-0.6",
    181      "1.4",
    182      { fromComp: "0", midComp: "0.4", toComp: "1" },
    183      "opacities with abs val >1 get clamped too early"
    184    ),
    185  ],
    186  URIsAndNone: [
    187    new AnimTestcaseFromTo("url(#idA)", "url(#idB)", {
    188      fromComp: 'url("#idA")',
    189      toComp: 'url("#idB")',
    190    }),
    191    new AnimTestcaseFromTo("none", "url(#idB)", { toComp: 'url("#idB")' }),
    192    new AnimTestcaseFromTo("url(#idB)", "inherit", {
    193      fromComp: 'url("#idB")',
    194      toComp: "none",
    195    }),
    196  ],
    197 };
    198 
    199 function _tweakForLetterSpacing(testcases) {
    200  return testcases.map(function (t) {
    201    let valMap = Object.assign({}, t.computedValMap);
    202    for (let prop of Object.keys(valMap)) {
    203      if (valMap[prop] == "0px") {
    204        valMap[prop] = "normal";
    205      }
    206    }
    207    return new AnimTestcaseFromTo(t.from, t.to, valMap);
    208  });
    209 }
    210 
    211 // List of attribute/testcase-list bundles to be tested
    212 var gFromToBundles = [
    213  new TestcaseBundle(gPropList.clip, [
    214    new AnimTestcaseFromTo(
    215      "rect(1px, 2px, 3px, 4px)",
    216      "rect(11px, 22px, 33px, 44px)",
    217      { midComp: "rect(6px, 12px, 18px, 24px)" }
    218    ),
    219    new AnimTestcaseFromTo(
    220      "rect(1px, auto, 3px, 4px)",
    221      "rect(11px, auto, 33px, 44px)",
    222      { midComp: "rect(6px, auto, 18px, 24px)" }
    223    ),
    224    new AnimTestcaseFromTo("auto", "auto"),
    225    new AnimTestcaseFromTo(
    226      "rect(auto, auto, auto, auto)",
    227      "rect(auto, auto, auto, auto)"
    228    ),
    229    // Interpolation not supported in these next cases (with auto --> px-value)
    230    new AnimTestcaseFromTo(
    231      "rect(1px, auto, 3px, auto)",
    232      "rect(11px, auto, 33px, 44px)"
    233    ),
    234    new AnimTestcaseFromTo(
    235      "rect(1px, 2px, 3px, 4px)",
    236      "rect(11px, auto, 33px, 44px)"
    237    ),
    238    new AnimTestcaseFromTo("rect(1px, 2px, 3px, 4px)", "auto"),
    239    new AnimTestcaseFromTo("auto", "rect(1px, 2px, 3px, 4px)"),
    240  ]),
    241  new TestcaseBundle(gPropList.clip_path, _fromToTestLists.URIsAndNone),
    242  new TestcaseBundle(gPropList.clip_rule, [
    243    new AnimTestcaseFromTo("nonzero", "evenodd"),
    244    new AnimTestcaseFromTo("evenodd", "inherit", { toComp: "nonzero" }),
    245  ]),
    246  new TestcaseBundle(
    247    gPropList.color,
    248    [].concat(_fromToTestLists.color, [
    249      // Note: inherited value is rgb(50, 50, 50) (set on <svg>)
    250      new AnimTestcaseFromTo("inherit", "rgb(200, 200, 200)", {
    251        fromComp: "rgb(50, 50, 50)",
    252        midComp: "rgb(125, 125, 125)",
    253      }),
    254    ])
    255  ),
    256  new TestcaseBundle(gPropList.color_interpolation, [
    257    new AnimTestcaseFromTo("sRGB", "auto", { fromComp: "srgb" }),
    258    new AnimTestcaseFromTo("inherit", "linearRGB", {
    259      fromComp: "srgb",
    260      toComp: "linearrgb",
    261    }),
    262  ]),
    263  new TestcaseBundle(gPropList.color_interpolation_filters, [
    264    new AnimTestcaseFromTo("sRGB", "auto", { fromComp: "srgb" }),
    265    new AnimTestcaseFromTo("auto", "inherit", { toComp: "linearrgb" }),
    266  ]),
    267  new TestcaseBundle(gPropList.cursor, [
    268    new AnimTestcaseFromTo("crosshair", "move"),
    269    new AnimTestcaseFromTo(
    270      "url('a.cur'), url('b.cur'), nw-resize",
    271      "sw-resize",
    272      {
    273        fromComp:
    274          'url("' +
    275          _testPath +
    276          '/a.cur"), ' +
    277          'url("' +
    278          _testPath +
    279          '/b.cur"), ' +
    280          "nw-resize",
    281      }
    282    ),
    283  ]),
    284  new TestcaseBundle(gPropList.direction, [
    285    new AnimTestcaseFromTo("ltr", "rtl"),
    286    new AnimTestcaseFromTo("rtl", "inherit"),
    287  ]),
    288  new TestcaseBundle(gPropList.display, [
    289    // I'm not testing the "inherit" value for "display", because part of
    290    // my test runs with "display: none" on everything, and so the
    291    // inherited value isn't always the same.  (i.e. the computed value
    292    // of 'inherit' will be different in different tests)
    293    new AnimTestcaseFromTo("block", "table-cell"),
    294    new AnimTestcaseFromTo("inline", "inline-table"),
    295    new AnimTestcaseFromTo("table-row", "none"),
    296  ]),
    297  new TestcaseBundle(gPropList.dominant_baseline, [
    298    new AnimTestcaseFromTo("alphabetic", "hanging"),
    299    new AnimTestcaseFromTo("mathematical", "central"),
    300    new AnimTestcaseFromTo("middle", "text-after-edge"),
    301    new AnimTestcaseFromTo("text-before-edge", "auto"),
    302    new AnimTestcaseFromTo("alphabetic", "inherit", { toComp: "auto" }),
    303  ]),
    304  // NOTE: Mozilla doesn't currently support "enable-background", but I'm
    305  // testing it here in case we ever add support for it, because it's
    306  // explicitly not animatable in the SVG spec.
    307  new TestcaseBundle(gPropList.enable_background, [
    308    new AnimTestcaseFromTo("new", "accumulate"),
    309  ]),
    310  new TestcaseBundle(
    311    gPropList.fill,
    312    [].concat(
    313      _fromToTestLists.color,
    314      _fromToTestLists.paintServer,
    315      _fromToTestLists.colorFromInheritBlack
    316    )
    317  ),
    318  new TestcaseBundle(gPropList.fill_opacity, _fromToTestLists.opacity),
    319  new TestcaseBundle(gPropList.fill_rule, [
    320    new AnimTestcaseFromTo("nonzero", "evenodd"),
    321    new AnimTestcaseFromTo("evenodd", "inherit", { toComp: "nonzero" }),
    322  ]),
    323  new TestcaseBundle(gPropList.filter, _fromToTestLists.URIsAndNone),
    324  new TestcaseBundle(
    325    gPropList.flood_color,
    326    [].concat(_fromToTestLists.color, _fromToTestLists.colorFromInheritBlack)
    327  ),
    328  new TestcaseBundle(gPropList.flood_opacity, _fromToTestLists.opacity),
    329  new TestcaseBundle(gPropList.font, [
    330    // NOTE: 'line-height' is hard-wired at 10px in test_smilCSSFromTo.xhtml
    331    // because if it's not explicitly set, its value varies across platforms.
    332    // NOTE: System font values can't be tested here, because their computed
    333    // values vary from platform to platform.  However, they are tested
    334    // visually, in the reftest "anim-css-font-1.svg"
    335    new AnimTestcaseFromTo("10px serif", "30px serif", {
    336      fromComp: "normal normal 400 10px / 10px serif",
    337      toComp: "normal normal 400 30px / 10px serif",
    338    }),
    339    new AnimTestcaseFromTo("10px serif", "30px sans-serif", {
    340      fromComp: "normal normal 400 10px / 10px serif",
    341      toComp: "normal normal 400 30px / 10px sans-serif",
    342    }),
    343    new AnimTestcaseFromTo("1px / 90px cursive", "100px monospace", {
    344      fromComp: "normal normal 400 1px / 10px cursive",
    345      toComp: "normal normal 400 100px / 10px monospace",
    346    }),
    347    new AnimTestcaseFromTo(
    348      "italic small-caps 200 1px cursive",
    349      "100px monospace",
    350      {
    351        fromComp: "italic small-caps 200 1px / 10px cursive",
    352        toComp: "normal normal 400 100px / 10px monospace",
    353      }
    354    ),
    355    new AnimTestcaseFromTo(
    356      "oblique normal 200 30px / 10px cursive",
    357      "normal small-caps 800 40px / 10px serif"
    358    ),
    359  ]),
    360  new TestcaseBundle(gPropList.font_family, [
    361    new AnimTestcaseFromTo("serif", "sans-serif"),
    362    new AnimTestcaseFromTo("cursive", "monospace"),
    363  ]),
    364  new TestcaseBundle(
    365    gPropList.font_size,
    366    [].concat(_fromToTestLists.lengthNoUnits, _fromToTestLists.lengthPx, [
    367      new AnimTestcaseFromTo("10px", "40%", {
    368        midComp: "15px",
    369        toComp: "20px",
    370      }),
    371      new AnimTestcaseFromTo("160%", "80%", {
    372        fromComp: "80px",
    373        midComp: "60px",
    374        toComp: "40px",
    375      }),
    376    ])
    377  ),
    378  new TestcaseBundle(gPropList.font_size_adjust, [
    379    new AnimTestcaseFromTo("0.9", "0.1", { midComp: "0.5" }),
    380    new AnimTestcaseFromTo("0.5", "0.6", { midComp: "0.55" }),
    381    new AnimTestcaseFromTo("none", "0.4"),
    382  ]),
    383  new TestcaseBundle(gPropList.font_stretch, [
    384    new AnimTestcaseFromTo(
    385      "normal",
    386      "wider",
    387      {},
    388      "need support for animating between " + "relative 'font-stretch' values"
    389    ),
    390    new AnimTestcaseFromTo(
    391      "narrower",
    392      "ultra-condensed",
    393      {},
    394      "need support for animating between " + "relative 'font-stretch' values"
    395    ),
    396    new AnimTestcaseFromTo("ultra-condensed", "condensed", {
    397      fromComp: "50%",
    398      midComp: "62.5%",
    399      toComp: "75%",
    400    }),
    401    new AnimTestcaseFromTo("semi-condensed", "semi-expanded", {
    402      fromComp: "87.5%",
    403      midComp: "100%",
    404      toComp: "112.5%",
    405    }),
    406    new AnimTestcaseFromTo("expanded", "ultra-expanded", {
    407      fromComp: "125%",
    408      midComp: "162.5%",
    409      toComp: "200%",
    410    }),
    411    new AnimTestcaseFromTo("ultra-expanded", "inherit", {
    412      fromComp: "200%",
    413      midComp: "150%",
    414      toComp: "100%",
    415    }),
    416  ]),
    417  new TestcaseBundle(gPropList.font_style, [
    418    new AnimTestcaseFromTo("italic", "inherit", { toComp: "normal" }),
    419    new AnimTestcaseFromTo("normal", "italic"),
    420    new AnimTestcaseFromTo("italic", "oblique"),
    421    new AnimTestcaseFromTo("oblique", "normal", { midComp: "oblique 7deg" }),
    422  ]),
    423  new TestcaseBundle(gPropList.font_variant, [
    424    new AnimTestcaseFromTo("inherit", "small-caps", { fromComp: "normal" }),
    425    new AnimTestcaseFromTo("small-caps", "normal"),
    426  ]),
    427  new TestcaseBundle(gPropList.font_weight, [
    428    new AnimTestcaseFromTo("100", "900", { midComp: "500" }),
    429    new AnimTestcaseFromTo("700", "100", { midComp: "400" }),
    430    new AnimTestcaseFromTo("inherit", "200", {
    431      fromComp: "400",
    432      midComp: "300",
    433    }),
    434    new AnimTestcaseFromTo("normal", "bold", {
    435      fromComp: "400",
    436      midComp: "550",
    437      toComp: "700",
    438    }),
    439    new AnimTestcaseFromTo(
    440      "lighter",
    441      "bolder",
    442      {},
    443      "need support for animating between " + "relative 'font-weight' values"
    444    ),
    445  ]),
    446  // NOTE: Mozilla doesn't currently support "glyph-orientation-horizontal" or
    447  // "glyph-orientation-vertical", but I'm testing them here in case we ever
    448  // add support for them, because they're explicitly not animatable in the SVG
    449  // spec.
    450  new TestcaseBundle(gPropList.glyph_orientation_horizontal, [
    451    new AnimTestcaseFromTo("45deg", "60deg"),
    452  ]),
    453  new TestcaseBundle(gPropList.glyph_orientation_vertical, [
    454    new AnimTestcaseFromTo("45deg", "60deg"),
    455  ]),
    456  new TestcaseBundle(gPropList.image_rendering, [
    457    new AnimTestcaseFromTo("auto", "optimizeQuality", {
    458      toComp: "optimizequality",
    459    }),
    460    new AnimTestcaseFromTo("optimizeQuality", "optimizeSpeed", {
    461      fromComp: "optimizequality",
    462      toComp: "optimizespeed",
    463    }),
    464  ]),
    465  new TestcaseBundle(
    466    gPropList.letter_spacing,
    467    _tweakForLetterSpacing(
    468      [].concat(_fromToTestLists.lengthNoUnits, _fromToTestLists.lengthPx)
    469    )
    470  ),
    471  new TestcaseBundle(
    472    gPropList.lighting_color,
    473    [].concat(_fromToTestLists.color, _fromToTestLists.colorFromInheritWhite)
    474  ),
    475  new TestcaseBundle(gPropList.marker, _fromToTestLists.URIsAndNone),
    476  new TestcaseBundle(gPropList.marker_end, _fromToTestLists.URIsAndNone),
    477  new TestcaseBundle(gPropList.marker_mid, _fromToTestLists.URIsAndNone),
    478  new TestcaseBundle(gPropList.marker_start, _fromToTestLists.URIsAndNone),
    479  new TestcaseBundle(gPropList.mask, _fromToTestLists.URIsAndNone),
    480  new TestcaseBundle(gPropList.opacity, _fromToTestLists.opacity),
    481  new TestcaseBundle(gPropList.overflow, [
    482    new AnimTestcaseFromTo("auto", "visible"),
    483    new AnimTestcaseFromTo("inherit", "visible", { fromComp: "hidden" }),
    484    new AnimTestcaseFromTo("scroll", "auto"),
    485  ]),
    486  new TestcaseBundle(gPropList.pointer_events, [
    487    new AnimTestcaseFromTo("visibleFill", "stroke", {
    488      fromComp: "visiblefill",
    489    }),
    490    new AnimTestcaseFromTo("none", "visibleStroke", {
    491      toComp: "visiblestroke",
    492    }),
    493  ]),
    494  new TestcaseBundle(gPropList.shape_rendering, [
    495    new AnimTestcaseFromTo("auto", "optimizeSpeed", {
    496      toComp: "optimizespeed",
    497    }),
    498    new AnimTestcaseFromTo("crispEdges", "geometricPrecision", {
    499      fromComp: "crispedges",
    500      toComp: "geometricprecision",
    501    }),
    502  ]),
    503  new TestcaseBundle(
    504    gPropList.stop_color,
    505    [].concat(_fromToTestLists.color, _fromToTestLists.colorFromInheritBlack)
    506  ),
    507  new TestcaseBundle(gPropList.stop_opacity, _fromToTestLists.opacity),
    508  new TestcaseBundle(
    509    gPropList.stroke,
    510    [].concat(_fromToTestLists.color, _fromToTestLists.paintServer, [
    511      // Note: inherited value is "none" (the default for "stroke" property)
    512      new AnimTestcaseFromTo("inherit", "rgb(200, 200, 200)", {
    513        fromComp: "none",
    514      }),
    515    ])
    516  ),
    517  new TestcaseBundle(
    518    gPropList.stroke_dasharray,
    519    [].concat(_fromToTestLists.lengthPctSVG, [
    520      new AnimTestcaseFromTo("inherit", "20", { fromComp: "none" }),
    521      new AnimTestcaseFromTo("1", "none"),
    522      new AnimTestcaseFromTo("10", "20", { midComp: "15" }),
    523      new AnimTestcaseFromTo("1", "2, 3", {
    524        fromComp: "1, 1",
    525        midComp: "1.5, 2",
    526      }),
    527      new AnimTestcaseFromTo("2, 8", "6", { midComp: "4, 7" }),
    528      new AnimTestcaseFromTo("1, 3", "1, 3, 5, 7, 9", {
    529        fromComp: "1, 3, 1, 3, 1, 3, 1, 3, 1, 3",
    530        midComp: "1, 3, 3, 5, 5, 2, 2, 4, 4, 6",
    531      }),
    532    ])
    533  ),
    534  new TestcaseBundle(
    535    gPropList.stroke_dashoffset,
    536    [].concat(
    537      _fromToTestLists.lengthNoUnits,
    538      _fromToTestLists.lengthPx,
    539      _fromToTestLists.lengthPxPctSVG,
    540      _fromToTestLists.lengthPctSVG,
    541      _fromToTestLists.lengthPxNoUnitsSVG
    542    )
    543  ),
    544  new TestcaseBundle(gPropList.stroke_linecap, [
    545    new AnimTestcaseFromTo("butt", "round"),
    546    new AnimTestcaseFromTo("round", "square"),
    547  ]),
    548  new TestcaseBundle(gPropList.stroke_linejoin, [
    549    new AnimTestcaseFromTo("miter", "round"),
    550    new AnimTestcaseFromTo("round", "bevel"),
    551  ]),
    552  new TestcaseBundle(gPropList.stroke_miterlimit, [
    553    new AnimTestcaseFromTo("1", "2", { midComp: "1.5" }),
    554    new AnimTestcaseFromTo("20.1", "10.1", { midComp: "15.1" }),
    555  ]),
    556  new TestcaseBundle(gPropList.stroke_opacity, _fromToTestLists.opacity),
    557  new TestcaseBundle(
    558    gPropList.stroke_width,
    559    [].concat(
    560      _fromToTestLists.lengthNoUnits,
    561      _fromToTestLists.lengthPx,
    562      _fromToTestLists.lengthPxPctSVG,
    563      _fromToTestLists.lengthPctSVG,
    564      _fromToTestLists.lengthPxNoUnitsSVG,
    565      [
    566        new AnimTestcaseFromTo("inherit", "7px", {
    567          fromComp: "1px",
    568          midComp: "4px",
    569          toComp: "7px",
    570        }),
    571      ]
    572    )
    573  ),
    574  new TestcaseBundle(gPropList.text_anchor, [
    575    new AnimTestcaseFromTo("start", "middle"),
    576    new AnimTestcaseFromTo("middle", "end"),
    577  ]),
    578  new TestcaseBundle(gPropList.text_decoration_line, [
    579    new AnimTestcaseFromTo("none", "underline"),
    580    new AnimTestcaseFromTo("overline", "line-through"),
    581    new AnimTestcaseFromTo("blink", "underline"),
    582  ]),
    583  new TestcaseBundle(gPropList.text_rendering, [
    584    new AnimTestcaseFromTo("auto", "optimizeSpeed", {
    585      toComp: "optimizespeed",
    586    }),
    587    new AnimTestcaseFromTo("optimizeSpeed", "geometricPrecision", {
    588      fromComp: "optimizespeed",
    589      toComp: "geometricprecision",
    590    }),
    591    new AnimTestcaseFromTo("geometricPrecision", "optimizeLegibility", {
    592      fromComp: "geometricprecision",
    593      toComp: "optimizelegibility",
    594    }),
    595  ]),
    596  new TestcaseBundle(gPropList.unicode_bidi, [
    597    new AnimTestcaseFromTo("embed", "bidi-override"),
    598  ]),
    599  new TestcaseBundle(gPropList.vector_effect, [
    600    new AnimTestcaseFromTo("none", "non-scaling-stroke"),
    601  ]),
    602  new TestcaseBundle(gPropList.visibility, [
    603    new AnimTestcaseFromTo("visible", "hidden"),
    604    new AnimTestcaseFromTo("hidden", "collapse"),
    605  ]),
    606  new TestcaseBundle(
    607    gPropList.word_spacing,
    608    [].concat(
    609      _fromToTestLists.lengthNoUnits,
    610      _fromToTestLists.lengthPx,
    611      _fromToTestLists.lengthPxPctSVG
    612    )
    613  ),
    614  new TestcaseBundle(
    615    gPropList.word_spacing,
    616    _fromToTestLists.lengthPctSVG,
    617    "pct->pct animations don't currently work for " + "*-spacing properties"
    618  ),
    619  // NOTE: Mozilla doesn't currently support "writing-mode", but I'm
    620  // testing it here in case we ever add support for it, because it's
    621  // explicitly not animatable in the SVG spec.
    622  new TestcaseBundle(gPropList.writing_mode, [
    623    new AnimTestcaseFromTo("lr", "rl"),
    624  ]),
    625 ];