# automatically generated by tools/mkcaniuse
+{
-date => "2025-05-05T06:29:35",
agents => {
and_chr => {
abbr => "And.",
browser => "Chrome for Android (former Android Browser)",
current_version => 135,
long_name => "Google Chrome for Android",
prefix => "webkit",
type => "mobile",
version_list => {
"135" => { global_usage => 44.6783, release_date => 1743379200 },
"2.1" => { global_usage => 0, release_date => 1256515200 },
"2.2" => { global_usage => 0, release_date => 1274313600 },
"2.3" => { global_usage => 0, release_date => 1291593600 },
"3" => { global_usage => 0, release_date => 1298332800 },
"4" => { global_usage => 0, release_date => 1318896000 },
"4.1" => { global_usage => 0, release_date => 1341792000 },
"4.2-4.3" => { global_usage => 0.000262095, release_date => 1374624000 },
"4.4" => { global_usage => 0, release_date => 1386547200 },
"4.4.3-4.4.4" => { global_usage => 0.000961014, release_date => 1401667200 },
},
versions => [2.1, 2.2, 2.3, 3, 4, 4.1, "4.2-4.3", 4.4, "4.4.3-4.4.4", 135],
},
and_ff => {
abbr => "FF/And.",
browser => "Firefox for Android",
current_version => 137,
long_name => "Mozilla Firefox for Android",
prefix => "moz",
type => "mobile",
version_list => { 137 => { global_usage => 0.350735, release_date => 1743465600 } },
versions => [137],
},
and_qq => {
abbr => "QQ",
browser => "QQ Browser",
current_version => 14.9,
long_name => "QQ Browser for Android",
prefix => "webkit",
type => "mobile",
version_list => {
"14.9" => { global_usage => 0.229572, release_date => 1710288000 },
},
versions => [14.9],
},
and_uc => {
abbr => "UC",
browser => "UC Browser for Android",
current_version => 15.5,
long_name => "UC Browser for Android",
prefix => "webkit",
type => "mobile",
version_list => {
"15.5" => {
global_usage => 0.848141,
prefix => "webkit",
release_date => 1710115200,
},
},
versions => [15.5],
},
baidu => {
abbr => "baidu",
browser => "Baidu Browser",
current_version => 13.52,
long_name => "Baidu Browser for Android",
prefix => "webkit",
type => "mobile",
version_list => { "13.52" => { global_usage => 0, release_date => 1710201600 } },
versions => [13.52],
},
bb => {
abbr => "BB",
browser => "Blackberry Browser",
current_version => 10,
long_name => "",
prefix => "webkit",
type => "mobile",
version_list => {
7 => { global_usage => 0, release_date => 1325376000 },
10 => { global_usage => 0, release_date => 1359504000 },
},
versions => [7, 10],
},
chrome => {
abbr => "Chr.",
browser => "Chrome",
current_version => 136,
long_name => "Google Chrome",
prefix => "webkit",
type => "desktop",
version_list => {
4 => { global_usage => 0, release_date => 1264377600 },
5 => { global_usage => 0, release_date => 1274745600 },
6 => { global_usage => 0, release_date => 1283385600 },
7 => { global_usage => 0, release_date => 1287619200 },
8 => { global_usage => 0, release_date => 1291248000 },
9 => { global_usage => 0, release_date => 1296777600 },
10 => { global_usage => 0, release_date => 1299542400 },
11 => { global_usage => 0, release_date => 1303862400 },
12 => { global_usage => 0, release_date => 1307404800 },
13 => { global_usage => 0, release_date => 1312243200 },
14 => { global_usage => 0, release_date => 1316131200 },
15 => { global_usage => 0, release_date => 1316131200 },
16 => { global_usage => 0, release_date => 1319500800 },
17 => { global_usage => 0, release_date => 1323734400 },
18 => { global_usage => 0, release_date => 1328659200 },
19 => { global_usage => 0, release_date => 1332892800 },
20 => { global_usage => 0, release_date => 1337040000 },
21 => { global_usage => 0, release_date => 1340668800 },
22 => { global_usage => 0, release_date => 1343692800 },
23 => { global_usage => 0, release_date => 1348531200 },
24 => { global_usage => 0, release_date => 1352246400 },
25 => { global_usage => 0, release_date => 1357862400 },
26 => { global_usage => 0, release_date => 1361404800 },
27 => { global_usage => 0, release_date => 1364428800 },
28 => { global_usage => 0, release_date => 1369094400 },
29 => { global_usage => 0, release_date => 1374105600 },
30 => { global_usage => 0, release_date => 1376956800 },
31 => { global_usage => 0, release_date => 1384214400 },
32 => { global_usage => 0, release_date => 1389657600 },
33 => { global_usage => 0, release_date => 1392940800 },
34 => { global_usage => 0, release_date => 1397001600 },
35 => { global_usage => 0, release_date => 1400544000 },
36 => { global_usage => 0, release_date => 1405468800 },
37 => { global_usage => 0, release_date => 1409011200 },
38 => { global_usage => 0.003623, release_date => 1412640000 },
39 => { global_usage => 0.007246, release_date => 1416268800 },
40 => { global_usage => 0.003623, release_date => 1421798400 },
41 => { global_usage => 0.007246, release_date => 1425513600 },
42 => { global_usage => 0.007246, release_date => 1429401600 },
43 => { global_usage => 0.007246, release_date => 1432080000 },
44 => { global_usage => 0.007246, release_date => 1437523200 },
45 => { global_usage => 0.007246, release_date => 1441152000 },
46 => { global_usage => 0.003623, release_date => 1444780800 },
47 => { global_usage => 0.007246, release_date => 1449014400 },
48 => { global_usage => 0.018115, release_date => 1453248000 },
49 => { global_usage => 0.018115, release_date => 1456963200 },
50 => { global_usage => 0.007246, release_date => 1460592000 },
51 => { global_usage => 0.007246, release_date => 1464134400 },
52 => { global_usage => 0.010869, release_date => 1469059200 },
53 => { global_usage => 0.007246, release_date => 1472601600 },
54 => { global_usage => 0.007246, release_date => 1476230400 },
55 => { global_usage => 0.007246, release_date => 1480550400 },
56 => { global_usage => 0.014492, release_date => 1485302400 },
57 => { global_usage => 0.007246, release_date => 1489017600 },
58 => { global_usage => 0.010869, release_date => 1492560000 },
59 => { global_usage => 0.007246, release_date => 1496707200 },
60 => { global_usage => 0.007246, release_date => 1500940800 },
61 => { global_usage => 0, release_date => 1504569600 },
62 => { global_usage => 0, release_date => 1508198400 },
63 => { global_usage => 0, release_date => 1512518400 },
64 => { global_usage => 0, release_date => 1516752000 },
65 => { global_usage => 0, release_date => 1520294400 },
66 => { global_usage => 0.021738, release_date => 1523923200 },
67 => { global_usage => 0, release_date => 1527552000 },
68 => { global_usage => 0, release_date => 1532390400 },
69 => { global_usage => 0.010869, release_date => 1536019200 },
70 => { global_usage => 0.010869, release_date => 1539648000 },
71 => { global_usage => 0, release_date => 1543968000 },
72 => { global_usage => 0, release_date => 1548720000 },
73 => { global_usage => 0.007246, release_date => 1552348800 },
74 => { global_usage => 0.003623, release_date => 1555977600 },
75 => { global_usage => 0.007246, release_date => 1559606400 },
76 => { global_usage => 0.003623, release_date => 1564444800 },
77 => { global_usage => 0.014492, release_date => 1568073600 },
78 => { global_usage => 0.010869, release_date => 1571702400 },
79 => { global_usage => 0.068837, release_date => 1575936000 },
80 => { global_usage => 0.010869, release_date => 1580860800 },
81 => { global_usage => 0.014492, release_date => 1586304000 },
83 => { global_usage => 0.028984, release_date => 1589846400 },
84 => { global_usage => 0.003623, release_date => 1594684800 },
85 => { global_usage => 0.010869, release_date => 1598313600 },
86 => { global_usage => 0.014492, release_date => 1601942400 },
87 => { global_usage => 0.057968, release_date => 1605571200 },
88 => { global_usage => 0.014492, release_date => 1611014400 },
89 => { global_usage => 0.003623, release_date => 1614556800 },
90 => { global_usage => 0.007246, release_date => 1618272000 },
91 => { global_usage => 0.03623, release_date => 1621987200 },
92 => { global_usage => 0.010869, release_date => 1626739200 },
93 => { global_usage => 0.014492, release_date => 1630368000 },
94 => { global_usage => 0.028984, release_date => 1632268800 },
95 => { global_usage => 0.007246, release_date => 1634601600 },
96 => { global_usage => 0.007246, release_date => 1637020800 },
97 => { global_usage => 0.018115, release_date => 1641340800 },
98 => { global_usage => 0.03623, release_date => 1643673600 },
99 => { global_usage => 0.010869, release_date => 1646092800 },
100 => { global_usage => 0.028984, release_date => 1648512000 },
101 => { global_usage => 0.014492, release_date => 1650931200 },
102 => { global_usage => 0.014492, release_date => 1653350400 },
103 => { global_usage => 0.076083, release_date => 1655769600 },
104 => { global_usage => 0.050722, release_date => 1659398400 },
105 => { global_usage => 0.010869, release_date => 1661817600 },
106 => { global_usage => 0.021738, release_date => 1664236800 },
107 => { global_usage => 0.025361, release_date => 1666656000 },
108 => { global_usage => 0.039853, release_date => 1669680000 },
109 => { global_usage => 0.912996, release_date => 1673308800 },
110 => { global_usage => 0.018115, release_date => 1675728000 },
111 => { global_usage => 0.03623, release_date => 1678147200 },
112 => { global_usage => 0.03623, release_date => 1680566400 },
113 => { global_usage => 0.10869, release_date => 1682985600 },
114 => { global_usage => 0.054345, release_date => 1685404800 },
115 => { global_usage => 0.032607, release_date => 1689724800 },
116 => { global_usage => 0.101444, release_date => 1692057600 },
117 => { global_usage => 0.094198, release_date => 1694476800 },
118 => { global_usage => 0.057968, release_date => 1696896000 },
119 => { global_usage => 0.03623, release_date => 1698710400 },
120 => { global_usage => 0.086952, release_date => 1701993600 },
121 => { global_usage => 0.094198, release_date => 1705968000 },
122 => { global_usage => 0.076083, release_date => 1708387200 },
123 => { global_usage => 0.086952, release_date => 1710806400 },
124 => { global_usage => 0.123182, release_date => 1713225600 },
125 => { global_usage => 0.344185, release_date => 1715644800 },
126 => { global_usage => 0.152166, release_date => 1718064000 },
127 => { global_usage => 0.101444, release_date => 1721174400 },
128 => { global_usage => 0.130428, release_date => 1724112000 },
129 => { global_usage => 0.101444, release_date => 1726531200 },
130 => { global_usage => 0.152166, release_date => 1728950400 },
131 => { global_usage => 1.17747, release_date => 1731369600 },
132 => { global_usage => 0.815175, release_date => 1736812800 },
133 => { global_usage => 5.89462, release_date => 1738627200 },
134 => { global_usage => 9.91615, release_date => 1741046400 },
135 => { global_usage => 0.021738, release_date => 1743465600 },
136 => { global_usage => 0.014492, release_date => 1745884800 },
137 => { global_usage => 0, release_date => undef },
138 => { global_usage => 0, release_date => undef },
139 => { global_usage => 0, release_date => undef },
},
versions => [4 .. 81, 83 .. 139],
},
edge => {
abbr => "Edge",
browser => "Edge (former IE)",
current_version => 135,
long_name => "Microsoft Edge",
prefix => "webkit",
type => "desktop",
version_list => {
"5.5" => { global_usage => 0, prefix => "ms", release_date => 962323200 },
"6" => { global_usage => 0, prefix => "ms", release_date => 998870400 },
"7" => { global_usage => 0, prefix => "ms", release_date => 1161129600 },
"8" => { global_usage => 0, prefix => "ms", release_date => 1237420800 },
"9" => { global_usage => 0.0324821, prefix => "ms", release_date => 1300060800 },
"10" => { global_usage => 0, prefix => "ms", release_date => 1346716800 },
"11" => { global_usage => 0.438508, prefix => "ms", release_date => 1381968000 },
"12" => { global_usage => 0, prefix => "ms", release_date => 1438128000 },
"13" => { global_usage => 0, prefix => "ms", release_date => 1447286400 },
"14" => { global_usage => 0, prefix => "ms", release_date => 1470096000 },
"15" => { global_usage => 0, prefix => "ms", release_date => 1491868800 },
"16" => { global_usage => 0, prefix => "ms", release_date => 1508198400 },
"17" => { global_usage => 0, prefix => "ms", release_date => 1525046400 },
"18" => { global_usage => 0.097821, prefix => "ms", release_date => 1542067200 },
"79" => { global_usage => 0, release_date => 1579046400 },
"80" => { global_usage => 0, release_date => 1581033600 },
"81" => { global_usage => 0, release_date => 1586736000 },
"83" => { global_usage => 0, release_date => 1590019200 },
"84" => { global_usage => 0, release_date => 1594857600 },
"85" => { global_usage => 0, release_date => 1598486400 },
"86" => { global_usage => 0, release_date => 1602201600 },
"87" => { global_usage => 0, release_date => 1605830400 },
"88" => { global_usage => 0, release_date => 1611360000 },
"89" => { global_usage => 0, release_date => 1614816000 },
"90" => { global_usage => 0, release_date => 1618358400 },
"91" => { global_usage => 0, release_date => 1622073600 },
"92" => { global_usage => 0.010869, release_date => 1626912000 },
"93" => { global_usage => 0, release_date => 1630627200 },
"94" => { global_usage => 0, release_date => 1632441600 },
"95" => { global_usage => 0, release_date => 1634774400 },
"96" => { global_usage => 0, release_date => 1637539200 },
"97" => { global_usage => 0, release_date => 1641427200 },
"98" => { global_usage => 0, release_date => 1643932800 },
"99" => { global_usage => 0, release_date => 1646265600 },
"100" => { global_usage => 0, release_date => 1649635200 },
"101" => { global_usage => 0, release_date => 1651190400 },
"102" => { global_usage => 0, release_date => 1653955200 },
"103" => { global_usage => 0, release_date => 1655942400 },
"104" => { global_usage => 0, release_date => 1659657600 },
"105" => { global_usage => 0, release_date => 1661990400 },
"106" => { global_usage => 0, release_date => 1664755200 },
"107" => { global_usage => 0, release_date => 1666915200 },
"108" => { global_usage => 0.003623, release_date => 1670198400 },
"109" => { global_usage => 0.047099, release_date => 1673481600 },
"110" => { global_usage => 0, release_date => 1675900800 },
"111" => { global_usage => 0, release_date => 1678665600 },
"112" => { global_usage => 0, release_date => 1680825600 },
"113" => { global_usage => 0.007246, release_date => 1683158400 },
"114" => { global_usage => 0.014492, release_date => 1685664000 },
"115" => { global_usage => 0.007246, release_date => 1689897600 },
"116" => { global_usage => 0, release_date => 1692576000 },
"117" => { global_usage => 0.003623, release_date => 1694649600 },
"118" => { global_usage => 0.003623, release_date => 1697155200 },
"119" => { global_usage => 0.003623, release_date => 1698969600 },
"120" => { global_usage => 0.03623, release_date => 1701993600 },
"121" => { global_usage => 0.007246, release_date => 1706227200 },
"122" => { global_usage => 0.014492, release_date => 1708732800 },
"123" => { global_usage => 0.007246, release_date => 1711152000 },
"124" => { global_usage => 0.007246, release_date => 1713398400 },
"125" => { global_usage => 0.007246, release_date => 1715990400 },
"126" => { global_usage => 0.021738, release_date => 1718841600 },
"127" => { global_usage => 0.014492, release_date => 1721865600 },
"128" => { global_usage => 0.014492, release_date => 1724371200 },
"129" => { global_usage => 0.014492, release_date => 1726704000 },
"130" => { global_usage => 0.025361, release_date => 1729123200 },
"131" => { global_usage => 0.065214, release_date => 1731542400 },
"132" => { global_usage => 0.079706, release_date => 1737417600 },
"133" => { global_usage => 1.34051, release_date => 1740614400 },
"134" => { global_usage => 3.0252, release_date => 1741219200 },
"135" => { global_usage => 0, release_date => 1743984000 },
"136" => { global_usage => 0, release_date => undef },
},
versions => [5.5, 6 .. 18, 79, 80, 81, 83 .. 136],
},
firefox => {
abbr => "FF",
browser => "Firefox",
current_version => 138,
long_name => "Mozilla Firefox",
prefix => "moz",
type => "desktop",
version_list => {
"2" => { global_usage => 0.007246, release_date => 1161648000 },
"3" => { global_usage => 0, release_date => 1213660800 },
"3.5" => { global_usage => 0, release_date => 1246320000 },
"3.6" => { global_usage => 0, release_date => 1264032000 },
"4" => { global_usage => 0, release_date => 1300752000 },
"5" => { global_usage => 0, release_date => 1308614400 },
"6" => { global_usage => 0, release_date => 1313452800 },
"7" => { global_usage => 0, release_date => 1317081600 },
"8" => { global_usage => 0, release_date => 1317081600 },
"9" => { global_usage => 0, release_date => 1320710400 },
"10" => { global_usage => 0, release_date => 1324339200 },
"11" => { global_usage => 0.025361, release_date => 1327968000 },
"12" => { global_usage => 0, release_date => 1331596800 },
"13" => { global_usage => 0, release_date => 1335225600 },
"14" => { global_usage => 0, release_date => 1338854400 },
"15" => { global_usage => 0, release_date => 1342483200 },
"16" => { global_usage => 0, release_date => 1346112000 },
"17" => { global_usage => 0, release_date => 1349740800 },
"18" => { global_usage => 0, release_date => 1353628800 },
"19" => { global_usage => 0, release_date => 1357603200 },
"20" => { global_usage => 0, release_date => 1361232000 },
"21" => { global_usage => 0, release_date => 1364860800 },
"22" => { global_usage => 0, release_date => 1368489600 },
"23" => { global_usage => 0, release_date => 1372118400 },
"24" => { global_usage => 0, release_date => 1375747200 },
"25" => { global_usage => 0, release_date => 1379376000 },
"26" => { global_usage => 0, release_date => 1386633600 },
"27" => { global_usage => 0, release_date => 1391472000 },
"28" => { global_usage => 0, release_date => 1395100800 },
"29" => { global_usage => 0, release_date => 1398729600 },
"30" => { global_usage => 0, release_date => 1402358400 },
"31" => { global_usage => 0, release_date => 1405987200 },
"32" => { global_usage => 0, release_date => 1409616000 },
"33" => { global_usage => 0, release_date => 1413244800 },
"34" => { global_usage => 0, release_date => 1417392000 },
"35" => { global_usage => 0, release_date => 1421107200 },
"36" => { global_usage => 0, release_date => 1424736000 },
"37" => { global_usage => 0, release_date => 1428278400 },
"38" => { global_usage => 0, release_date => 1431475200 },
"39" => { global_usage => 0, release_date => 1435881600 },
"40" => { global_usage => 0, release_date => 1439251200 },
"41" => { global_usage => 0, release_date => 1442880000 },
"42" => { global_usage => 0, release_date => 1446508800 },
"43" => { global_usage => 0, release_date => 1450137600 },
"44" => { global_usage => 0.003623, release_date => 1453852800 },
"45" => { global_usage => 0, release_date => 1457395200 },
"46" => { global_usage => 0, release_date => 1461628800 },
"47" => { global_usage => 0, release_date => 1465257600 },
"48" => { global_usage => 0, release_date => 1470096000 },
"49" => { global_usage => 0, release_date => 1474329600 },
"50" => { global_usage => 0, release_date => 1479168000 },
"51" => { global_usage => 0, release_date => 1485216000 },
"52" => { global_usage => 0.028984, release_date => 1488844800 },
"53" => { global_usage => 0.014492, release_date => 1492560000 },
"54" => { global_usage => 0, release_date => 1497312000 },
"55" => { global_usage => 0.007246, release_date => 1502150400 },
"56" => { global_usage => 0.007246, release_date => 1506556800 },
"57" => { global_usage => 0, release_date => 1510617600 },
"58" => { global_usage => 0, release_date => 1516665600 },
"59" => { global_usage => 0.007246, release_date => 1520985600 },
"60" => { global_usage => 0, release_date => 1525824000 },
"61" => { global_usage => 0, release_date => 1529971200 },
"62" => { global_usage => 0, release_date => 1536105600 },
"63" => { global_usage => 0, release_date => 1540252800 },
"64" => { global_usage => 0, release_date => 1544486400 },
"65" => { global_usage => 0, release_date => 1548720000 },
"66" => { global_usage => 0, release_date => 1552953600 },
"67" => { global_usage => 0, release_date => 1558396800 },
"68" => { global_usage => 0, release_date => 1562630400 },
"69" => { global_usage => 0, release_date => 1567468800 },
"70" => { global_usage => 0, release_date => 1571788800 },
"71" => { global_usage => 0, release_date => 1575331200 },
"72" => { global_usage => 0.003623, release_date => 1578355200 },
"73" => { global_usage => 0, release_date => 1581379200 },
"74" => { global_usage => 0, release_date => 1583798400 },
"75" => { global_usage => 0, release_date => 1586304000 },
"76" => { global_usage => 0, release_date => 1588636800 },
"77" => { global_usage => 0, release_date => 1591056000 },
"78" => { global_usage => 0.010869, release_date => 1593475200 },
"79" => { global_usage => 0, release_date => 1595894400 },
"80" => { global_usage => 0, release_date => 1598313600 },
"81" => { global_usage => 0, release_date => 1600732800 },
"82" => { global_usage => 0, release_date => 1603152000 },
"83" => { global_usage => 0, release_date => 1605571200 },
"84" => { global_usage => 0, release_date => 1607990400 },
"85" => { global_usage => 0, release_date => 1611619200 },
"86" => { global_usage => 0, release_date => 1614038400 },
"87" => { global_usage => 0, release_date => 1616457600 },
"88" => { global_usage => 0.007246, release_date => 1618790400 },
"89" => { global_usage => 0, release_date => 1622505600 },
"90" => { global_usage => 0, release_date => 1626134400 },
"91" => { global_usage => 0, release_date => 1628553600 },
"92" => { global_usage => 0, release_date => 1630972800 },
"93" => { global_usage => 0, release_date => 1633392000 },
"94" => { global_usage => 0.003623, release_date => 1635811200 },
"95" => { global_usage => 0, release_date => 1638835200 },
"96" => { global_usage => 0, release_date => 1641859200 },
"97" => { global_usage => 0, release_date => 1644364800 },
"98" => { global_usage => 0, release_date => 1646697600 },
"99" => { global_usage => 0, release_date => 1649116800 },
"100" => { global_usage => 0, release_date => 1651536000 },
"101" => { global_usage => 0, release_date => 1653955200 },
"102" => { global_usage => 0, release_date => 1656374400 },
"103" => { global_usage => 0, release_date => 1658793600 },
"104" => { global_usage => 0, release_date => 1661212800 },
"105" => { global_usage => 0, release_date => 1663632000 },
"106" => { global_usage => 0, release_date => 1666051200 },
"107" => { global_usage => 0, release_date => 1668470400 },
"108" => { global_usage => 0, release_date => 1670889600 },
"109" => { global_usage => 0.003623, release_date => 1673913600 },
"110" => { global_usage => 0, release_date => 1676332800 },
"111" => { global_usage => 0, release_date => 1678752000 },
"112" => { global_usage => 0, release_date => 1681171200 },
"113" => { global_usage => 0.003623, release_date => 1683590400 },
"114" => { global_usage => 0, release_date => 1686009600 },
"115" => { global_usage => 0.213757, release_date => 1688428800 },
"116" => { global_usage => 0, release_date => 1690848000 },
"117" => { global_usage => 0, release_date => 1693267200 },
"118" => { global_usage => 0.094198, release_date => 1695686400 },
"119" => { global_usage => 0, release_date => 1698105600 },
"120" => { global_usage => 0.003623, release_date => 1700524800 },
"121" => { global_usage => 0, release_date => 1702944000 },
"122" => { global_usage => 0, release_date => 1705968000 },
"123" => { global_usage => 0, release_date => 1708387200 },
"124" => { global_usage => 0, release_date => 1710806400 },
"125" => { global_usage => 0.014492, release_date => 1713225600 },
"126" => { global_usage => 0, release_date => 1715644800 },
"127" => { global_usage => 0.007246, release_date => 1718064000 },
"128" => { global_usage => 0.083329, release_date => 1720483200 },
"129" => { global_usage => 0, release_date => 1722902400 },
"130" => { global_usage => 0, release_date => 1725321600 },
"131" => { global_usage => 0.003623, release_date => 1727740800 },
"132" => { global_usage => 0.007246, release_date => 1730160000 },
"133" => { global_usage => 0.018115, release_date => 1732579200 },
"134" => { global_usage => 0.025361, release_date => 1736208000 },
"135" => { global_usage => 0.347808, release_date => 1738627200 },
"136" => { global_usage => 1.11951, release_date => 1741046400 },
"137" => { global_usage => 0.007246, release_date => 1743465600 },
"138" => { global_usage => 0, release_date => 1745884800 },
"139" => { global_usage => 0, release_date => undef },
"140" => { global_usage => 0, release_date => undef },
"141" => { global_usage => 0, release_date => undef },
},
versions => [2, 3, 3.5, 3.6, 4 .. 141],
},
ie_mob => {
abbr => "IE.Mob",
browser => "IE Mobile",
current_version => 11,
long_name => "",
prefix => "ms",
type => "mobile",
version_list => {
10 => { global_usage => 0, release_date => 1340150400 },
11 => { global_usage => 0, release_date => 1353456000 },
},
versions => [10, 11],
},
ios_saf => {
abbr => "iOS",
browser => "Safari on iOS",
current_version => 18.4,
long_name => "Safari on iOS",
prefix => "webkit",
type => "mobile",
version_list => {
"10.0-10.2" => { global_usage => 0.00144949, release_date => 1473724800 },
"10.3" => { global_usage => 0.0333383, release_date => 1490572800 },
"11.0-11.2" => { global_usage => 0.153646, release_date => 1505779200 },
"11.3-11.4" => { global_usage => 0.0101464, release_date => 1522281600 },
"12.0-12.1" => { global_usage => 0.00579797, release_date => 1537142400 },
"12.2-12.5" => { global_usage => 0.14205, release_date => 1553472000 },
"13.0-13.1" => { global_usage => 0.00289898, release_date => 1568851200 },
"13.2" => { global_usage => 0.00579797, release_date => 1572220800 },
"13.3" => { global_usage => 0.00579797, release_date => 1580169600 },
"13.4-13.7" => { global_usage => 0.0202929, release_date => 1585008000 },
"14.0-14.4" => { global_usage => 0.124656, release_date => 1600214400 },
"14.5-14.8" => { global_usage => 0.0608787, release_date => 1619395200 },
"15.0-15.1" => { global_usage => 0.0333383, release_date => 1632096000 },
"15.2-15.3" => { global_usage => 0.0333383, release_date => 1639353600 },
"15.4" => { global_usage => 0.0405858, release_date => 1647216000 },
"15.5" => { global_usage => 0.0463837, release_date => 1652659200 },
"15.6-15.8" => { global_usage => 0.568201, release_date => 1658275200 },
"16.0" => { global_usage => 0.0797221, release_date => 1662940800 },
"16.1" => { global_usage => 0.165242, release_date => 1666569600 },
"16.2" => { global_usage => 0.08552, release_date => 1670889600 },
"16.3" => { global_usage => 0.150747, release_date => 1674432000 },
"16.4" => { global_usage => 0.0333383, release_date => 1679875200 },
"16.5" => { global_usage => 0.0623282, release_date => 1684368000 },
"16.6-16.7" => { global_usage => 0.672564, release_date => 1690156800 },
"17.0" => { global_usage => 0.0405858, release_date => 1694995200 },
"17.1" => { global_usage => 0.0724746, release_date => 1698192000 },
"17.2" => { global_usage => 0.0550807, release_date => 1702252800 },
"17.3" => { global_usage => 0.0768231, release_date => 1705881600 },
"17.4" => { global_usage => 0.153646, release_date => 1709596800 },
"17.5" => { global_usage => 0.340631, release_date => 1715558400 },
"17.6-17.7" => { global_usage => 0.988554, release_date => 1722211200 },
"18.0" => { global_usage => 0.276853, release_date => 1726444800 },
"18.1" => { global_usage => 0.905933, release_date => 1730073600 },
"18.2" => { global_usage => 0.405858, release_date => 1733875200 },
"18.3" => { global_usage => 8.46503, release_date => 1737936000 },
"18.4" => { global_usage => 0.126106, release_date => 1743379200 },
"18.5" => { global_usage => 0, release_date => undef },
"3.2" => { global_usage => 0, release_date => 1270252800 },
"4.0-4.1" => { global_usage => 0, release_date => 1283904000 },
"4.2-4.3" => { global_usage => 0.00289898, release_date => 1299628800 },
"5.0-5.1" => { global_usage => 0, release_date => 1331078400 },
"6.0-6.1" => { global_usage => 0.00869695, release_date => 1359331200 },
"7.0-7.1" => { global_usage => 0.00724746, release_date => 1394409600 },
"8" => { global_usage => 0, release_date => 1410912000 },
"8.1-8.4" => { global_usage => 0, release_date => 1413763200 },
"9.0-9.2" => { global_usage => 0.00434848, release_date => 1442361600 },
"9.3" => { global_usage => 0.0202929, release_date => 1458518400 },
},
versions => [
3.2,
"4.0-4.1",
"4.2-4.3",
"5.0-5.1",
"6.0-6.1",
"7.0-7.1",
8,
"8.1-8.4",
"9.0-9.2",
9.3,
"10.0-10.2",
10.3,
"11.0-11.2",
"11.3-11.4",
"12.0-12.1",
"12.2-12.5",
"13.0-13.1",
13.2,
13.3,
"13.4-13.7",
"14.0-14.4",
"14.5-14.8",
"15.0-15.1",
"15.2-15.3",
15.4,
15.5,
"15.6-15.8",
"16.0",
16.1,
16.2,
16.3,
16.4,
16.5,
"16.6-16.7",
"17.0",
17.1,
17.2,
17.3,
17.4,
17.5,
"17.6-17.7",
"18.0",
18.1,
18.2,
18.3,
18.4,
18.5,
],
},
kaios => {
abbr => "Kai",
browser => "KaiOS Browser",
current_version => "3.0-3.1",
long_name => "KaiOS Browser",
prefix => "moz",
type => "mobile",
version_list => {
"2.5" => { global_usage => 0.012754, release_date => 1527811200 },
"3.0-3.1" => { global_usage => 0, release_date => 1631664000 },
},
versions => [2.5, "3.0-3.1"],
},
op_mini => {
abbr => "O.Mini",
browser => "Opera Mini",
current_version => "all",
long_name => "Opera Mini",
prefix => "o",
type => "mobile",
version_list => { all => { global_usage => 0.05, release_date => 1426464000 } },
versions => ["all"],
},
op_mob => {
abbr => "O.Mob",
browser => "Opera Mobile",
current_version => 80,
long_name => "Opera for Android",
prefix => "o",
type => "mobile",
version_list => {
"10" => { global_usage => 0, release_date => 1287100800 },
"11" => { global_usage => 0, release_date => 1300752000 },
"11.1" => { global_usage => 0, release_date => 1314835200 },
"11.5" => { global_usage => 0, release_date => 1318291200 },
"12" => { global_usage => 0, release_date => 1330300800 },
"12.1" => { global_usage => 0, release_date => 1349740800 },
"80" => { global_usage => 1.04047, prefix => "webkit", release_date => 1709769600 },
},
versions => [10, 11, 11.1, 11.5, 12, 12.1, 80],
},
opera => {
abbr => "Op.",
browser => "Opera",
current_version => 117,
long_name => "Opera",
prefix => "webkit",
type => "desktop",
version_list => {
"10.0-10.1" => { global_usage => 0, prefix => "o", release_date => 1251763200 },
"10.5" => { global_usage => 0, prefix => "o", release_date => 1267488000 },
"10.6" => { global_usage => 0, prefix => "o", release_date => 1277942400 },
"100" => { global_usage => 0, release_date => 1687219200 },
"101" => { global_usage => 0, release_date => 1690329600 },
"102" => { global_usage => 0.018115, release_date => 1692748800 },
"103" => { global_usage => 0, release_date => 1696204800 },
"104" => { global_usage => 0, release_date => 1699920000 },
"105" => { global_usage => 0, release_date => 1699920000 },
"106" => { global_usage => 0, release_date => 1702944000 },
"107" => { global_usage => 0, release_date => 1707264000 },
"108" => { global_usage => 0, release_date => 1710115200 },
"109" => { global_usage => 0, release_date => 1711497600 },
"11" => { global_usage => 0, prefix => "o", release_date => 1292457600 },
"11.1" => { global_usage => 0, prefix => "o", release_date => 1302566400 },
"11.5" => { global_usage => 0, prefix => "o", release_date => 1309219200 },
"11.6" => { global_usage => 0, prefix => "o", release_date => 1323129600 },
"110" => { global_usage => 0, release_date => 1716336000 },
"111" => { global_usage => 0, release_date => 1719273600 },
"112" => { global_usage => 0, release_date => 1721088000 },
"113" => { global_usage => 0, release_date => 1724284800 },
"114" => { global_usage => 0.003623, release_date => 1727222400 },
"115" => { global_usage => 0, release_date => 1732665600 },
"116" => { global_usage => 0.202888, release_date => 1736294400 },
"117" => { global_usage => 0.684747, release_date => 1739404800 },
"12" => { global_usage => 0, prefix => "o", release_date => 1323129600 },
"12.1" => { global_usage => 0, prefix => "o", release_date => 1352073600 },
"15" => { global_usage => 0, release_date => 1372723200 },
"16" => { global_usage => 0, release_date => 1377561600 },
"17" => { global_usage => 0, release_date => 1381104000 },
"18" => { global_usage => 0, release_date => 1386288000 },
"19" => { global_usage => 0, release_date => 1390867200 },
"20" => { global_usage => 0, release_date => 1393891200 },
"21" => { global_usage => 0, release_date => 1399334400 },
"22" => { global_usage => 0, release_date => 1401753600 },
"23" => { global_usage => 0, release_date => 1405987200 },
"24" => { global_usage => 0, release_date => 1409616000 },
"25" => { global_usage => 0, release_date => 1413331200 },
"26" => { global_usage => 0, release_date => 1417132800 },
"27" => { global_usage => 0, release_date => 1422316800 },
"28" => { global_usage => 0, release_date => 1425945600 },
"29" => { global_usage => 0, release_date => 1430179200 },
"30" => { global_usage => 0, release_date => 1433808000 },
"31" => { global_usage => 0, release_date => 1438646400 },
"32" => { global_usage => 0, release_date => 1442448000 },
"33" => { global_usage => 0, release_date => 1445904000 },
"34" => { global_usage => 0, release_date => 1449100800 },
"35" => { global_usage => 0, release_date => 1454371200 },
"36" => { global_usage => 0, release_date => 1457308800 },
"37" => { global_usage => 0, release_date => 1462320000 },
"38" => { global_usage => 0, release_date => 1465344000 },
"39" => { global_usage => 0, release_date => 1470096000 },
"40" => { global_usage => 0.003623, release_date => 1474329600 },
"41" => { global_usage => 0, release_date => 1477267200 },
"42" => { global_usage => 0, release_date => 1481587200 },
"43" => { global_usage => 0, release_date => 1486425600 },
"44" => { global_usage => 0, release_date => 1490054400 },
"45" => { global_usage => 0, release_date => 1494374400 },
"46" => { global_usage => 0.010869, release_date => 1498003200 },
"47" => { global_usage => 0, release_date => 1502236800 },
"48" => { global_usage => 0, release_date => 1506470400 },
"49" => { global_usage => 0, release_date => 1510099200 },
"50" => { global_usage => 0, release_date => 1515024000 },
"51" => { global_usage => 0, release_date => 1517961600 },
"52" => { global_usage => 0, release_date => 1521676800 },
"53" => { global_usage => 0, release_date => 1525910400 },
"54" => { global_usage => 0, release_date => 1530144000 },
"55" => { global_usage => 0, release_date => 1534982400 },
"56" => { global_usage => 0, release_date => 1537833600 },
"57" => { global_usage => 0, release_date => 1543363200 },
"58" => { global_usage => 0, release_date => 1548201600 },
"60" => { global_usage => 0, release_date => 1554768000 },
"62" => { global_usage => 0, release_date => 1561593600 },
"63" => { global_usage => 0, release_date => 1566259200 },
"64" => { global_usage => 0, release_date => 1570406400 },
"65" => { global_usage => 0, release_date => 1573689600 },
"66" => { global_usage => 0, release_date => 1578441600 },
"67" => { global_usage => 0, release_date => 1583971200 },
"68" => { global_usage => 0, release_date => 1587513600 },
"69" => { global_usage => 0, release_date => 1592956800 },
"70" => { global_usage => 0, release_date => 1595894400 },
"71" => { global_usage => 0, release_date => 1600128000 },
"72" => { global_usage => 0, release_date => 1603238400 },
"73" => { global_usage => 0, release_date => 1613520000 },
"74" => { global_usage => 0, release_date => 1612224000 },
"75" => { global_usage => 0, release_date => 1616544000 },
"76" => { global_usage => 0, release_date => 1619568000 },
"77" => { global_usage => 0, release_date => 1623715200 },
"78" => { global_usage => 0, release_date => 1627948800 },
"79" => { global_usage => 0, release_date => 1631577600 },
"80" => { global_usage => 0, release_date => 1633392000 },
"81" => { global_usage => 0, release_date => 1635984000 },
"82" => { global_usage => 0, release_date => 1638403200 },
"83" => { global_usage => 0, release_date => 1642550400 },
"84" => { global_usage => 0, release_date => 1644969600 },
"85" => { global_usage => 0, release_date => 1647993600 },
"86" => { global_usage => 0, release_date => 1650412800 },
"87" => { global_usage => 0.025361, release_date => 1652745600 },
"88" => { global_usage => 0.007246, release_date => 1654646400 },
"89" => { global_usage => 0, release_date => 1657152000 },
"9" => { global_usage => 0, prefix => "o", release_date => 1150761600 },
"9.5-9.6" => { global_usage => 0, prefix => "o", release_date => 1223424000 },
"90" => { global_usage => 0, release_date => 1660780800 },
"91" => { global_usage => 0, release_date => 1663113600 },
"92" => { global_usage => 0, release_date => 1668816000 },
"93" => { global_usage => 0, release_date => 1668643200 },
"94" => { global_usage => 0, release_date => 1671062400 },
"95" => { global_usage => 0.032607, release_date => 1675209600 },
"96" => { global_usage => 0, release_date => 1677024000 },
"97" => { global_usage => 0, release_date => 1679529600 },
"98" => { global_usage => 0, release_date => 1681948800 },
"99" => { global_usage => 0, release_date => 1684195200 },
},
versions => [
9,
"9.5-9.6",
"10.0-10.1",
10.5,
10.6,
11,
11.1,
11.5,
11.6,
12,
12.1,
15 .. 58,
60,
62 .. 117,
],
},
safari => {
abbr => "Saf.",
browser => "Safari",
current_version => 18.4,
long_name => "Safari",
prefix => "webkit",
type => "desktop",
version_list => {
"10" => { global_usage => 0, release_date => 1474329600 },
"10.1" => { global_usage => 0, release_date => 1490572800 },
"11" => { global_usage => 0, release_date => 1505779200 },
"11.1" => { global_usage => 0.007246, release_date => 1522281600 },
"12" => { global_usage => 0, release_date => 1537142400 },
"12.1" => { global_usage => 0.007246, release_date => 1553472000 },
"13" => { global_usage => 0, release_date => 1568851200 },
"13.1" => { global_usage => 0.032607, release_date => 1585008000 },
"14" => { global_usage => 0.014492, release_date => 1600214400 },
"14.1" => { global_usage => 0.043476, release_date => 1619395200 },
"15" => { global_usage => 0.003623, release_date => 1632096000 },
"15.1" => { global_usage => 0.014492, release_date => 1635292800 },
"15.2-15.3" => { global_usage => 0.003623, release_date => 1639353600 },
"15.4" => { global_usage => 0.010869, release_date => 1647216000 },
"15.5" => { global_usage => 0.014492, release_date => 1652745600 },
"15.6" => { global_usage => 0.148543, release_date => 1658275200 },
"16.0" => { global_usage => 0.032607, release_date => 1662940800 },
"16.1" => { global_usage => 0.021738, release_date => 1666569600 },
"16.2" => { global_usage => 0.018115, release_date => 1670889600 },
"16.3" => { global_usage => 0.039853, release_date => 1674432000 },
"16.4" => { global_usage => 0.014492, release_date => 1679875200 },
"16.5" => { global_usage => 0.025361, release_date => 1684368000 },
"16.6" => { global_usage => 0.199265, release_date => 1690156800 },
"17.0" => { global_usage => 0.010869, release_date => 1695686400 },
"17.1" => { global_usage => 0.123182, release_date => 1698192000 },
"17.2" => { global_usage => 0.018115, release_date => 1702252800 },
"17.3" => { global_usage => 0.021738, release_date => 1705881600 },
"17.4" => { global_usage => 0.050722, release_date => 1709596800 },
"17.5" => { global_usage => 0.086952, release_date => 1715558400 },
"17.6" => { global_usage => 0.264479, release_date => 1722211200 },
"18.0" => { global_usage => 0.03623, release_date => 1726444800 },
"18.1" => { global_usage => 0.115936, release_date => 1730073600 },
"18.2" => { global_usage => 0.057968, release_date => 1733875200 },
"18.3" => { global_usage => 1.4021, release_date => 1737936000 },
"18.4" => { global_usage => 0.018115, release_date => 1743379200 },
"18.5" => { global_usage => 0, release_date => undef },
"3.1" => { global_usage => 0, release_date => 1205798400 },
"3.2" => { global_usage => 0, release_date => 1226534400 },
"4" => { global_usage => 0, release_date => 1244419200 },
"5" => { global_usage => 0, release_date => 1275868800 },
"5.1" => { global_usage => 0, release_date => 1311120000 },
"6" => { global_usage => 0, release_date => 1343174400 },
"6.1" => { global_usage => 0, release_date => 1382400000 },
"7" => { global_usage => 0, release_date => 1382400000 },
"7.1" => { global_usage => 0, release_date => 1410998400 },
"8" => { global_usage => 0, release_date => 1413417600 },
"9" => { global_usage => 0, release_date => 1443657600 },
"9.1" => { global_usage => 0, release_date => 1458518400 },
"TP" => { global_usage => 0, release_date => undef },
},
versions => [
3.1,
3.2,
4,
5,
5.1,
6,
6.1,
7,
7.1,
8,
9,
9.1,
10,
10.1,
11,
11.1,
12,
12.1,
13,
13.1,
14,
14.1,
15,
15.1,
"15.2-15.3",
15.4,
15.5,
15.6,
"16.0",
16.1,
16.2,
16.3,
16.4,
16.5,
16.6,
"17.0",
17.1,
17.2,
17.3,
17.4,
17.5,
17.6,
"18.0",
18.1,
18.2,
18.3,
18.4,
18.5,
"TP",
],
},
samsung => {
abbr => "SS",
browser => "Samsung Internet",
current_version => 27,
long_name => "Samsung Internet Browser",
prefix => "webkit",
type => "mobile",
version_list => {
"10.1" => { global_usage => 0, release_date => 1567900800 },
"11.1-11.2" => { global_usage => 0, release_date => 1582588800 },
"12.0" => { global_usage => 0, release_date => 1593475200 },
"13.0" => { global_usage => 0, release_date => 1605657600 },
"14.0" => { global_usage => 0, release_date => 1618531200 },
"15.0" => { global_usage => 0, release_date => 1629072000 },
"16.0" => { global_usage => 0, release_date => 1640736000 },
"17.0" => { global_usage => 0.0109672, release_date => 1651708800 },
"18.0" => { global_usage => 0, release_date => 1659657600 },
"19.0" => { global_usage => 0, release_date => 1667260800 },
"20" => { global_usage => 0, release_date => 1677369600 },
"21" => { global_usage => 0.0219344, release_date => 1684454400 },
"22" => { global_usage => 0.0219344, release_date => 1689292800 },
"23" => { global_usage => 0.0329016, release_date => 1697587200 },
"24" => { global_usage => 0.0438688, release_date => 1711497600 },
"25" => { global_usage => 0.0438688, release_date => 1715126400 },
"26" => { global_usage => 0.0877377, release_date => 1717718400 },
"27" => { global_usage => 1.96313, release_date => 1725667200 },
"4" => { global_usage => 0.0329016, release_date => 1461024000 },
"5.0-5.4" => { global_usage => 0, release_date => 1481846400 },
"6.2-6.4" => { global_usage => 0, release_date => 1509408000 },
"7.2-7.4" => { global_usage => 0.0109672, release_date => 1528329600 },
"8.2" => { global_usage => 0, release_date => 1546128000 },
"9.2" => { global_usage => 0, release_date => 1554163200 },
},
versions => [
4,
"5.0-5.4",
"6.2-6.4",
"7.2-7.4",
8.2,
9.2,
10.1,
"11.1-11.2",
"12.0",
"13.0",
"14.0",
"15.0",
"16.0",
"17.0",
"18.0",
"19.0",
20 .. 27,
],
},
},
cats => {
"CSS" => ["CSS", "CSS2", "CSS3"],
"HTML5" => ["Canvas", "HTML5"],
"JS" => ["JS"],
"JS API" => ["JS API"],
"Other" => ["Other", "DOM", "PNG"],
"Security" => ["Security"],
"SVG" => ["SVG"],
},
data => {
"aac" => {
categories => ["Other"],
description => "Advanced Audio Coding format, designed to be the successor format to MP3, with generally better sound quality.",
keywords => "audio/aac",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Advanced_Audio_Coding",
},
],
notes => "Support refers to this format's use in the `audio` element, not other conditions.",
notes_by_num => {
1 => "Partial support in Firefox refers to only supporting AAC in an MP4 container and only when the operating system already has the codecs installed.",
},
parent => "audio",
spec => "http://www.digitalpreservation.gov/formats/fdd/fdd000114.shtml",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "a #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 10 => "u", 12 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 22 => "a #1" },
ie_mob => { 10 => "y", 11 => "n" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "AAC audio file format",
ucprefix => 0,
},
"abortcontroller" => {
categories => ["JS API"],
chrome_id => 5631483679080448,
description => "Controller object that allows you to abort one or more DOM requests made with the Fetch API.",
keywords => "abort api",
links => [
{
title => "Abortable Fetch - Google Developers article",
url => "https://developers.google.com/web/updates/2017/09/abortable-fetch",
},
{
title => "AbortController - MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/API/AbortController",
},
{
title => "AbortSignal - MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal",
},
],
notes_by_num => {
1 => "Safari has window.AbortController defined in the DOM but it's just a stub, it does not abort requests at all. The same issue also affects Chrome on IOS and Firefox on IOS because they use the same WebKit rendering engine as Safari.",
},
parent => "fetch",
spec => "https://dom.spec.whatwg.org/#abortsignal",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 66 => "y" },
edge => { "5.5" => "n", "16" => "y" },
firefox => { 2 => "n", 57 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 53 => "y" },
safari => { "3.1" => "n", "11.1" => "n #1", "12.1" => "y" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "ls",
title => "AbortController & AbortSignal",
ucprefix => 0,
},
"accelerometer" => {
categories => ["JS API"],
chrome_id => 5698781827825664,
description => "Defines `Accelerometer`, `LinearAccelerationSensor` and `GravitySensor` interfaces for obtaining information about acceleration applied to the X, Y and Z axis of a device that hosts the sensor.",
links => [
{
title => "Demo",
url => "https://intel.github.io/generic-sensor-demos/punchmeter/",
},
{
title => "Article",
url => "https://developers.google.com/web/updates/2017/09/sensors-for-the-web#acceleration-and-linear-accelerometer-sensor",
},
],
notes_by_num => {
1 => "Available by enabling the \"Generic Sensor\" experimental flag in `about:flags`",
},
spec => "https://www.w3.org/TR/accelerometer/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #1", 67 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "Accelerometer",
ucprefix => 0,
},
"addeventlistener" => {
categories => ["DOM"],
description => "The modern standard API for adding DOM event handlers. Introduced in the DOM Level 2 Events spec. Also implies support for `removeEventListener`, the [capture phase](https://dom.spec.whatwg.org/#dom-event-capturing_phase) of DOM event dispatch, as well as the `stopPropagation()` and `preventDefault()` event methods.",
keywords => "event,target,add,remove,listener,capture,capturing,phase",
links => [
{
title => "MDN Web Docs - addEventListener",
url => "https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener",
},
{
title => "Financial Times IE8 polyfill",
url => "https://github.com/Financial-Times/polyfill-service/blob/master/polyfills/Event/polyfill.js",
},
{
title => "WebReflection ie8 polyfill",
url => "https://github.com/WebReflection/ie8",
},
],
notes_by_num => {
1 => "IE<=8 instead only supports the [proprietary `.attachEvent()` method](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener). It also does not support the [capture phase](https://www.w3.org/TR/DOM-Level-3-Events/#event-flow) of DOM event dispatch; it only supports event bubbling.",
2 => "The `useCapture` parameter is non-optional and must be provided. Future versions made it optional, with a default value of `false`.",
},
spec => "https://dom.spec.whatwg.org/#dom-eventtarget-addeventlistener",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n #1", "9" => "y" },
firefox => { 2 => "y #2", 7 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "EventTarget.addEventListener()",
ucprefix => 0,
},
"ambient-light" => {
categories => ["JS API"],
chrome_id => 5298357018820608,
description => "Defines a concrete sensor interface to monitor the ambient light level or illuminance of the device\x{2019}s environment.",
links => [
{
title => "Demo",
url => "https://intel.github.io/generic-sensor-demos/ambient-map/build/bundled/",
},
{
title => "Article",
url => "https://developers.google.com/web/updates/2017/09/sensors-for-the-web",
},
{
title => "MDN Web Docs - Ambient Light Sensor",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Ambient_Light_Sensor_API",
},
],
notes_by_num => {
1 => "Implements an [outdated version of the spec](https://www.w3.org/TR/2015/WD-ambient-light-20150903/).",
2 => "Available by enabling the \"Generic Sensor Extra Classes\" experimental flag in `about:flags`",
},
spec => "https://www.w3.org/TR/ambient-light/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #2" },
edge => { "5.5" => "n", "14" => "a #1", "79" => "n d #2" },
firefox => { 2 => "n", 22 => "a #1", 60 => "n d #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 73 => "n d #2" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "Ambient Light Sensor",
ucprefix => 0,
},
"apng" => {
categories => ["PNG"],
chrome_id => 6691520493125632,
description => "Like animated GIFs, but allowing 24-bit colors and alpha transparency",
links => [
{ title => "Wikipedia", url => "https://en.wikipedia.org/wiki/APNG" },
{
title => "Polyfill using canvas",
url => "https://github.com/davidmz/apng-canvas",
},
{
title => "Chrome extension providing support",
url => "https://chrome.google.com/webstore/detail/ehkepjiconegkhpodgoaeamnpckdbblp",
},
{
title => "Chromium issue (fixed)",
url => "https://code.google.com/p/chromium/issues/detail?id=437662",
},
],
notes => "Where support for APNG is missing, only the first frame is displayed",
notes_by_num => {},
spec => "https://www.w3.org/TR/png",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 59 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 3 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "15" => "n", "46" => "y", "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "8" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "cr",
title => "Animated PNG (APNG)",
ucprefix => 0,
},
"array-find" => {
categories => ["JS"],
description => "The `find()` method returns the value of the first item in the array based on the result of the provided testing function.",
keywords => "array.find",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-array",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-array.prototype.find",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "u" },
chrome => { 4 => "n", 45 => "y" },
edge => { "5.5" => "n", "12" => "u", "15" => "y" },
firefox => { 2 => "n", 25 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 32 => "y" },
safari => { "3.1" => "n", "7.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Array.prototype.find",
ucprefix => 0,
},
"array-find-index" => {
categories => ["JS"],
chrome_id => 6732923508097024,
description => "The `findIndex()` method returns the index of the first element in the array that satisfies the provided testing function.",
keywords => "array.findIndex",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-array",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-array.prototype.findindex",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "u" },
chrome => { 4 => "n", 45 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 25 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 32 => "y" },
safari => { "3.1" => "n", "7.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Array.prototype.findIndex",
ucprefix => 0,
},
"array-flat" => {
categories => ["JS"],
chrome_id => 6629507075145728,
description => "Methods to flatten any sub-arrays found in an array by concatenating their elements.",
keywords => "array.prototype.flat,array.prototype.flatmap",
links => [
{
title => "MDN article on Array.prototype.flat",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat",
},
{
title => "MDN article on Array.prototype.flatMap",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flatMap",
},
{
title => "Article on the history of the `flat` methods",
url => "https://developers.google.com/web/updates/2018/03/smooshgate",
},
{
title => "Polyfill for flat & flatMap",
url => "https://github.com/jonathantneal/array-flat-polyfill",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-array",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-array.prototype.flat",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 69 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 62 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 56 => "y" },
safari => { "3.1" => "n", "12" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "other",
title => "flat & flatMap array methods",
ucprefix => 0,
},
"array-includes" => {
categories => ["JS"],
chrome_id => 5964420647747584,
description => "Determines whether or not an array includes the given value, returning a boolean value (unlike `indexOf`).",
keywords => "array.includes",
links => [
{
title => "MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes#Browser_compatibility",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-array",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-array.prototype.includes",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 47 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 43 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 34 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Array.prototype.includes",
ucprefix => 0,
},
"arrow-functions" => {
categories => ["JS"],
chrome_id => 5047308127305728,
description => "Function shorthand using `=>` syntax and lexical `this` binding.",
keywords => "ES6,JavaScript,fat,arrow,function,lexical,this,()=>",
links => [
{
title => "ECMAScript 6 features: Arrows",
url => "https://github.com/lukehoban/es6features#arrows",
},
{
title => "MDN Web Docs - Arrow functions",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions",
},
],
notes_by_num => {},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-arrow-function-definitions",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 45 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 22 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 32 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Arrow functions",
ucprefix => 0,
},
"asmjs" => {
categories => ["JS", "JS API", "Other"],
chrome_id => 5053365658583040,
description => "An extraordinarily optimizable, low-level subset of JavaScript, intended to be a compile target from languages like C++.",
keywords => "asm,asm.js,asmjs,WebAssembly",
links => [
{ title => "Homepage", url => "http://asmjs.org/" },
{
title => "Source for spec and tools",
url => "https://github.com/dherman/asm.js/",
},
{
title => "Bringing Asm.js to Chakra and Microsoft Edge",
url => "https://blogs.windows.com/msedgedev/2015/05/07/bringing-asm-js-to-chakra-microsoft-edge/",
},
{
title => "Microsoft Edge support announcement",
url => "https://dev.modern.ie/platform/changelog/10532-pc/",
},
{
title => "MDN article about asm.js",
url => "https://developer.mozilla.org/en-US/docs/Games/Tools/asm.js",
},
{
title => "Wikipedia article about asm.js",
url => "https://en.wikipedia.org/wiki/Asm.js",
},
],
notes => "asm.js is [mostly rendered obsolete](https://en.wikipedia.org/wiki/Asm.js#Deprecation) with the introduction of [WebAssembly](/wasm) and is therefore [no longer recommended](https://developer.mozilla.org/en-US/docs/Games/Tools/asm.js)",
notes_by_num => {
1 => "Chromium does not support ahead-of-time compilation but performance doubled in Chrome 28: [https://en.wikipedia.org/wiki/Asm.js#Implementations](https://en.wikipedia.org/wiki/Asm.js#Implementations)",
2 => "Supported in MS Edge under the \"Enable experimental JavaScript features\" flag.",
},
spec => "http://asmjs.org/spec/latest/",
stats => {
and_chr => { "2.1" => "n", "135" => "a #1" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "a #1" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 28 => "a #1" },
edge => { "5.5" => "n", "12" => "n d #2", "13" => "y", "79" => "a #1" },
firefox => { 2 => "n", 22 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 15 => "a #1" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "a #1" },
},
status => "other",
title => "asm.js",
ucprefix => 0,
},
"async-clipboard" => {
categories => ["JS API"],
chrome_id => 5861289330999296,
description => "A modern, asynchronous Clipboard API based on Promises",
keywords => "clipboard,async,cut,copy,paste,clipboarddata,clipboardevent",
links => [
{
title => "MDN Web Docs - Clipboard API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API",
},
{
title => "W3C Async Clipboard Explainer",
url => "https://github.com/w3c/clipboard-apis/blob/master/explainer.adoc",
},
{
title => "Unlocking Clipboard Access",
url => "https://web.dev/async-clipboard/",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1619251",
},
],
notes => "Browsers differ on how they handle the security considerations for clipboard operations:\r\n\r\nChromium browsers require the `clipboard-write` permission to be granted before allowing clipboard reading & writing.\r\n\r\nSafari browsers will display a \"Paste\" option for users to select first before reading the clipboard.",
notes_by_num => {
1 => "Partial support refers to only supporting the \"writeText\" method.",
2 => "Supports writing to clipboard but not reading.",
},
spec => "https://www.w3.org/TR/clipboard-apis/#async-clipboard-api",
stats => {
and_chr => { "2.1" => "n", "135" => "a #2" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 66 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 63 => "a #1", 125 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.0-14.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 53 => "y" },
safari => { "3.1" => "n", "13.1" => "y" },
samsung => { "4" => "n", "9.2" => "a #2", "25" => "y" },
},
status => "wd",
title => "Asynchronous Clipboard API",
ucprefix => 0,
},
"async-functions" => {
categories => ["JS"],
chrome_id => 5643236399906816,
description => "Async functions make it possible to treat functions returning Promise objects as if they were synchronous.",
keywords => "ES2017,JavaScript,function,async,await,promises,asynchronous",
links => [
{
title => "MDN Web Docs - Async functions",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function",
},
{
title => "Async functions - making promises friendly",
url => "https://developers.google.com/web/fundamentals/getting-started/primers/async-functions",
},
],
notes_by_num => {
1 => "Since build 14342 - disabled by default; can be enabled through about:flags",
2 => "Async arrow functions are [unsupported](https://github.com/kangax/compat-table/pull/1420).",
},
spec => "https://tc39.es/ecma262/#sec-async-function-definitions",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 55 => "y" },
edge => { "5.5" => "n", "14" => "n d #1", "15" => "y" },
firefox => { 2 => "n", 52 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "n #2", "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 42 => "y" },
safari => { "3.1" => "n", "10.1" => "n #2", "11" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "other",
title => "Async functions",
ucprefix => 0,
},
"atob-btoa" => {
categories => ["JS API"],
description => "Utility functions for encoding and decoding strings to and from base 64: window.atob() and window.btoa().",
keywords => "atob,btoa",
links => [
{
title => "MDN Web Docs - btoa()",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Window.btoa",
},
{
title => "MDN Web Docs - atob()",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Window.atob",
},
{
title => "Polyfill",
url => "https://github.com/davidchambers/Base64.js",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/webappapis.html#atob",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "u", 11 => "y" },
opera => { "9" => "n", "10.5" => "u", "10.6" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Base64 encoding and decoding",
ucprefix => 0,
},
"audio" => {
categories => ["HTML5"],
description => "Method of playing sound on webpages (without requiring a plug-in). Includes support for the following media properties: `currentSrc`, `currentTime`, `paused`, `playbackRate`, `buffered`, `duration`, `played`, `seekable`, `ended`, `autoplay`, `loop`, `controls`, `volume` & `muted`",
keywords => "<audio>",
links => [
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/native-audio-in-the-browser/",
},
{
title => "Detailed article on video/audio elements",
url => "https://dev.opera.com/articles/everything-you-need-to-know-html5-video-audio/",
},
{
title => "Demos of audio player that uses the audio element",
url => "https://www.jplayer.org/latest/demos/",
},
{
title => "Detailed article on support",
url => "https://24ways.org/2010/the-state-of-html5-audio",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/audio.js#audio",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/audio",
},
{
title => "The State of HTML5 Audio",
url => "https://www.phoboslab.org/log/2011/03/the-state-of-html5-audio",
},
],
notes_by_num => {
1 => "Old Firefox versions were missing support for some properties: `loop` was added in v11, `played` in v15, `playbackRate` in v20.",
2 => "iOS volume is read-only.",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#the-audio-element",
stats => {
and_chr => { "2.1" => "n", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.5" => "a #1", "20" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "10.5" => "y", "9" => "n", "9.5-9.6" => "a" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Audio element",
ucprefix => 0,
},
"audio-api" => {
categories => ["JS API"],
chrome_id => 6261718720184320,
description => "High-level JavaScript API for processing and synthesizing audio",
keywords => "web-audio,webaudio,AudioContext,AudioBuffer,AudioNode",
links => [
{
title => "Polyfill to support Web Audio API in Firefox",
url => "https://github.com/corbanbrook/audionode.js",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/webaudio",
},
{
title => "Polyfill to enable Web Audio API through Firefox Audio Data api or flash",
url => "https://github.com/g200kg/WAAPISim",
},
{
title => "MDN Web Docs - Web Audio API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API",
},
],
notes => "Not all browsers with support for the Audio API also support media streams (e.g. microphone input). See the [getUserMedia/Streams API](/#feat=stream) data for support for that feature.\r\n\r\nFirefox versions < 25 support an alternative, deprecated audio API.\r\n\r\nChrome support [went through some changes](https://developers.google.com/web/updates/2014/07/Web-Audio-Changes-in-m36) as of version 36.",
notes_by_num => {},
spec => "https://www.w3.org/TR/webaudio/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 14 => "y x", 34 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 25 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "y", "3.2" => "n", "6.0-6.1" => "y x" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 22 => "y" },
safari => { "3.1" => "n", "6" => "y x", "14.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "Web Audio API",
ucprefix => 0,
},
"audiotracks" => {
categories => ["HTML5"],
chrome_id => 5748496434987008,
description => "Method of specifying and selecting between multiple audio tracks. Useful for providing audio descriptions, director's commentary, additional languages, alternative takes, etc.",
keywords => "AudioTrack,AudioTrackList,media,multiple,selection",
links => [
{
title => "MDN Web Docs - HTMLMediaElement.audioTracks",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/audioTracks",
},
],
notes_by_num => {
1 => "Supported in Firefox by enabling \"media.track.enabled\" in about:config",
2 => "Supported in Chrome and Opera by enabling \"enable-experimental-web-platform-features\" in chrome:flags",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#audiotracklist-and-videotracklist-objects",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n d #2" },
and_uc => { "15.5" => "n d #2" },
baidu => { "13.52" => "n d #2" },
bb => { 7 => "n" },
chrome => { 4 => "n", 45 => "n d #2" },
edge => { "5.5" => "n", "10" => "y", "79" => "n d #2" },
firefox => { 2 => "n", 33 => "n d #1" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "n d #2" },
opera => { 9 => "n", 32 => "n d #2" },
safari => { "3.1" => "n", "6.1" => "y" },
samsung => { 4 => "n" },
},
status => "ls",
title => "Audio Tracks",
ucprefix => 0,
},
"autofocus" => {
categories => ["HTML5"],
description => "Allows a form field to be immediately focused on page load.",
links => [
{
title => "Article on autofocus",
url => "https://davidwalsh.name/autofocus",
},
{
title => "MDN Web Docs - autofocus attribute",
url => "https://developer.mozilla.org/en/docs/Web/HTML/Element/input#attr-autofocus",
},
],
notes => "While not supported in iOS Safari, it does work in iOS WebViews.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/forms.html#autofocusing-a-form-control:-the-autofocus-attribute",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 5 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Autofocus attribute",
ucprefix => 0,
},
"auxclick" => {
categories => ["DOM", "JS API"],
chrome_id => 5663174342737920,
description => "The click event for non-primary buttons of input devices",
keywords => "click,auxclick,non-primary button,middle click",
links => [
{
title => "MDN Web Docs - auxclick",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/auxclick",
},
{
title => "Firefox implementation",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1304044",
},
{
title => "WebKit bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=22382",
},
{
title => "Original Proposal",
url => "https://wicg.github.io/auxclick/",
},
],
notes => "With introduction of this feature there will be no longer click event fired for non-primary buttons",
notes_by_num => {
1 => "As a compatibility measure, Firefox continues to fire the click event for document and window level event handlers.",
},
spec => "https://w3c.github.io/uievents/#event-type-auxclick",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 55 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 53 => "y #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "18.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 42 => "y" },
safari => { "3.1" => "n", "18.2" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "Auxclick",
ucprefix => 0,
},
"av1" => {
categories => ["Other"],
chrome_id => 5729898442260480,
description => "AV1 (AOMedia Video 1) is a royalty-free video format by the Alliance for Open Media, meant to succeed its predecessor VP9 and compete with the [HEVC/H.265](/hevc) format.",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/AV1",
},
{
title => "Sample video from Bitmovin",
url => "https://bitmovin.com/demos/av1",
},
{
title => "Sample video from Facebook",
url => "https://www.facebook.com/330716120785217/videos/330723190784510/",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1452683",
},
{
title => "Safari implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=207547",
},
],
notes => "Edge has stopped supporting AV1 completely at some point prior to version 116 (additional information required).",
notes_by_num => {
1 => "Can be enabled in Edge on Windows 10 or later by installing the [AV1 Video Extension from the Microsoft Store](https://www.microsoft.com/store/productId/9MVZQVXJBQ9V)",
2 => "Firefox 65 only supported AV1 on Windows 64-bit",
3 => "Firefox 66 only supported AV1 on Windows and macOS",
4 => "Supported only on devices with hardware decoder, e.g. iPhone 15 Pro, M3 MacBook Pro, etc.",
},
parent => "video",
spec => "https://github.com/AOMediaCodec/av1-spec",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 67 => "n d", 70 => "y" },
edge => { "5.5" => "n", "18" => "n d #1", "116" => "n", "121" => "y" },
firefox => { 2 => "n", 55 => "n d", 65 => "a #2", 66 => "a #3", 67 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.0" => "a #4" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 57 => "y" },
safari => { "3.1" => "n", "17.0" => "a #4" },
samsung => { "4" => "n", "12.0" => "y" },
},
status => "other",
title => "AV1 video format",
ucprefix => 0,
},
"avif" => {
categories => ["Other"],
chrome_id => 4905307790639104,
description => "A modern image format based on the [AV1 video format](/av1). AVIF generally has better compression than [WebP](/webp), JPEG, PNG and GIF and is designed to supersede them. AVIF competes with [JPEG XL](/jpegxl) which has similar compression quality and is generally seen as more feature-rich than AVIF.",
links => [
{ title => "Polyfill", url => "https://github.com/Kagami/avif.js" },
{
title => "AVIF for Next-Generation Image Coding - blog post",
url => "https://netflixtechblog.com/avif-for-next-generation-image-coding-b1d75675fe4",
},
{
title => "Safari support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=207750",
},
{
title => "Firefox support bug for image sequence and animation",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1686338",
},
],
notes_by_num => {
1 => "Can be enabled in Firefox via the `image.avif.enabled` pref in `about:config`.",
2 => "Supports still images. Animated image sequences are not supported.",
3 => "Only available on macOS 13 Ventura or later.",
4 => "Does not support images with noise synthesis.",
5 => "Supports only still images by default. Animated image sequences can be enabled via the `image.avif.sequence.enabled` pref in `about:config`.",
6 => "Can be enabled via the `--enable-features=msEdgeAVIF` runtime flag in insider channels.",
},
spec => "https://aomediacodec.github.io/av1-avif/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 85 => "y" },
edge => { "5.5" => "n", "114" => "n d #6", "118" => "n", "121" => "y" },
firefox => { 2 => "n", 77 => "n d #1", 93 => "y #2", 111 => "y #5", 113 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y #2 #4", "16.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 71 => "y" },
safari => { "3.1" => "n", "16.1" => "a #2 #3 #4", "16.4" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "other",
title => "AVIF image format",
ucprefix => 0,
},
"background-attachment" => {
categories => ["CSS"],
description => "Method of defining how a background image is attached to a scrollable element. Values include `scroll` (default), `fixed` and `local`.",
links => [
{
title => "MDN Web Docs - background-attachment",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/background-attachment",
},
],
notes => "Most mobile devices have a delay in updating the background position after scrolling a page with `fixed` backgrounds.",
notes_by_num => {
1 => "Partial support refers to supporting `fixed` but not `local`",
2 => "Partial support refers to supporting `local` but not `fixed`",
3 => "Only supports `local` when `-webkit-overflow-scrolling: touch` is _not_ used",
4 => "Does not support `fixed`, and due [to a bug](https://bugs.chromium.org/p/chromium/issues/detail?id=627037) only supports `local` if a `border-radius` is set on the element.",
5 => "Broken support of `fixed` and `local` when scrolling an outer scroll container. Related [to a bug](https://bugs.webkit.org/show_bug.cgi?id=219324).",
},
spec => "https://www.w3.org/TR/css3-background/#the-background-attachment",
stats => {
and_chr => { "2.1" => "n", "4.1" => "a #1", "4.4" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #2" },
chrome => { 4 => "y" },
edge => { "5.5" => "a #1", "9" => "y" },
firefox => { 2 => "a #1", 25 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "13.0-13.1" => "n #5", "15.4" => "y", "3.2" => "n", "5.0-5.1" => "a #2 #3" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "a #1", 11 => "y" },
opera => { "9" => "a #1", "10.5" => "y" },
safari => { "3.1" => "a #1", "5" => "y", "13" => "a #1", "14" => "n #5", "15.4" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a #4" },
},
status => "cr",
title => "CSS background-attachment",
ucprefix => 0,
},
"background-clip-text" => {
categories => ["CSS"],
description => "Clipping a background image to the foreground text.",
keywords => "background-clip,text,clip",
links => [
{
title => "[css-backgrounds] Standardize 'background-clip: text'",
url => "https://lists.w3.org/Archives/Public/www-style/2016Mar/0283.html",
},
{
title => "CSS Backgrounds and Borders Module Level 4",
url => "https://drafts.csswg.org/css-backgrounds-4/#background-clip",
},
{
title => "MDN Web Docs - background-clip",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/background-clip",
},
],
notes => "Firefox and legacy Edge also support this property with the `-webkit-` prefix.",
notes_by_num => {
1 => "Doesn't work with a stacking context (e.g. `position: relative`), see [Chromium bug](https://crbug.com/1500148)",
2 => "Doesn't work with flex/grid container, see [WebKit bug](https://bugs.webkit.org/show_bug.cgi?id=169125)",
},
parent => "background-img-opts",
spec => "https://drafts.csswg.org/css-backgrounds-4/#background-clip",
stats => {
and_chr => { "2.1" => "u", "4" => "y x #1", "135" => "y #1" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y x #1" },
and_uc => { "15.5" => "y x #1" },
baidu => { "13.52" => "y x #1" },
bb => { 7 => "y x #1" },
chrome => { 4 => "y x #1", 120 => "y #1" },
edge => { "5.5" => "n", "12" => "y x", "15" => "y", "79" => "y x #1", "120" => "y #1" },
firefox => { 2 => "n", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "a #1 #2", "15.5" => "y #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "u", 80 => "y #1" },
opera => { 9 => "n", 15 => "y x #1", 106 => "y #1" },
safari => { "3.1" => "n", "3.2" => "a x #1 #2", "5" => "a #1 #2", "15.5" => "y #1" },
samsung => { 4 => "y x #1", 25 => "y" },
},
status => "unoff",
title => "Background-clip: text",
ucprefix => 0,
},
"background-img-opts" => {
categories => ["CSS3"],
description => "New properties to affect background images, including background-clip, background-origin and background-size",
links => [
{
title => "Detailed compatibility tables and demos",
url => "http://www.standardista.com/css3/css3-background-properties",
},
{
title => "Polyfill for IE7-8",
url => "https://github.com/louisremi/background-size-polyfill",
},
{
title => "MDN Web Docs - background-image",
url => "https://developer.mozilla.org/en/docs/Web/CSS/background-image",
},
],
notes => "Firefox, Chrome and Safari support the unofficial `-webkit-background-clip: text` (only with prefix). Safari does not support `-webkit-background-clip: text;` for `<button>` elements. But you can put `<span>` inside `<button>` to get the same result.",
notes_by_num => {
1 => "Partial support in Opera Mini refers to not supporting background sizing or background attachments. However Opera Mini 7.5 supports background sizing (including cover and contain values).",
2 => "Partial support in Safari 6 refers to not supporting background sizing offset from edges syntax.",
3 => "Does not support `background-size` values in the `background` shorthand",
},
spec => "https://www.w3.org/TR/css3-background/#backgrounds",
stats => {
and_chr => { "2.1" => "a x", "2.2" => "a x #3", "3" => "a #3", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "a #3", 15 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.6" => "a x", "4" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a", "5.0-5.1" => "a #3", "6.0-6.1" => "a", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "a x", "10.5" => "y", "9" => "n" },
safari => { "3.1" => "a #2 #3", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 Background-image options",
ucprefix => 0,
},
"background-position-x-y" => {
categories => ["CSS"],
description => "CSS longhand properties to define x or y positions separately.",
links => [
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=550426",
},
{
title => "Blog post on background-position-x & y properties",
url => "https://snook.ca/archives/html_and_css/background-position-x-y",
},
{
title => "MDN Web Docs - background-position-x",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/background-position-x",
},
{
title => "MDN Web Docs - background-position-y",
url => "https://developer.mozilla.org/en/docs/Web/CSS/background-position-y",
},
],
notes => "A workaround for the lack of support in Firefox 31 - Firefox 48 is to use [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables). See [this Stack Overflow answer](https://stackoverflow.com/a/29282573/94197) for an example.",
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-backgrounds-4/#background-position-longhands",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "y" },
firefox => { 2 => "n", 49 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "background-position-x & background-position-y",
ucprefix => 0,
},
"background-repeat-round-space" => {
categories => ["CSS3"],
description => "Allows CSS background images to be repeated without clipping.",
keywords => "4 value syntax,background-repeat: round,background-repeat: space",
links => [
{
title => "MDN Web Docs - background-repeat",
url => "https://developer.mozilla.org//docs/Web/CSS/background-repeat",
},
{
title => "CSS-Tricks article on background-repeat",
url => "https://css-tricks.com/almanac/properties/b/background-repeat/",
},
],
notes_by_num => {
1 => "IE9 does not appear to render \"background-repeat: round\" correctly.",
},
spec => "https://www.w3.org/TR/css3-background/#the-background-repeat",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 32 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "10" => "y" },
firefox => { 2 => "n", 49 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y", "15" => "n", "19" => "y" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS background-repeat round and space",
ucprefix => 0,
},
"background-sync" => {
categories => ["JS API"],
chrome_id => 6170807885627392,
description => "Provides one-off and periodic synchronization for Service Workers with an onsync event.",
keywords => "syncmanager",
links => [
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1217544",
},
{
title => "SyncManager on MDN Web Docs",
url => "https://developer.mozilla.org/docs/Web/API/SyncManager",
},
{
title => "Google Developers blog: Introducing Background Sync",
url => "https://developers.google.com/web/updates/2015/12/background-sync",
},
],
notes_by_num => {},
spec => "https://wicg.github.io/BackgroundSync/spec/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 139 => "u" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 42 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "unoff",
title => "Background Sync API",
ucprefix => 0,
},
"battery-status" => {
categories => ["JS API"],
chrome_id => 4537134732017664,
description => "Method to provide information about the battery status of the hosting device.",
keywords => "navigator.battery,navigator.getbattery,batterymanager",
links => [
{
title => "MDN Web Docs - battery status",
url => "https://developer.mozilla.org/en-US/docs/WebAPI/Battery_Status",
},
{
title => "Simple demo",
url => "https://pazguille.github.io/demo-battery-api/",
},
],
notes => "Firefox 52+ [removed access to this API due to privacy concerns.](https://bugzilla.mozilla.org/show_bug.cgi?id=1313580)",
notes_by_num => {
1 => "Partial support refers to support for the older specification's `navigator.battery` rather than `navigator.getBattery()` to access the `BatteryManager`.",
},
spec => "https://www.w3.org/TR/battery-status/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 37 => "n d", 38 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 10 => "a x #1", 16 => "a #1", 43 => "y", 52 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 25 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Battery Status API",
ucprefix => 0,
},
"beacon" => {
categories => ["JS API"],
chrome_id => 5517433905348608,
description => "Allows data to be sent asynchronously to a server with `navigator.sendBeacon`, even after a page was closed. Useful for posting analytics data the moment a user was finished using the page.",
links => [
{
title => "MDN Web Docs - Beacon",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Navigator/sendBeacon",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/beacon/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 39 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 31 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 26 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Beacon API",
ucprefix => 0,
},
"beforeafterprint" => {
categories => ["HTML5", "JS API"],
chrome_id => 5700595042222080,
description => "Window fires `beforeprint` and `afterprint` events so the printed document can be annotated.",
keywords => "print,printer,printing,beforeprint,afterprint",
links => [
{
title => "MDN Web Docs - Detecting print requests",
url => "https://developer.mozilla.org/en-US/docs/Web/Guide/Printing#Detecting_print_requests",
},
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=218205",
},
{
title => "Safari support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=19937",
},
],
notes => "Due to its wider support, consider using `window.matchMedia('print')` where possible.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html#printing",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "n", 63 => "y" },
edge => { "5.5" => "u", "6" => "y" },
firefox => { 2 => "n", 6 => "y" },
ie_mob => { 10 => "u" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 50 => "y" },
safari => { "3.1" => "n", "13" => "y" },
samsung => { "4" => "u", "5.0-5.4" => "n" },
},
status => "ls",
title => "Printing Events",
ucprefix => 0,
},
"bigint" => {
categories => ["JS"],
chrome_id => 5371603852460032,
description => "Arbitrary-precision integers in JavaScript.",
keywords => "int,integer,precision",
links => [
{
title => "GitHub repository",
url => "https://github.com/tc39/proposal-bigint",
},
{
title => "Blog article from Google Developer",
url => "https://developers.google.com/web/updates/2018/05/bigint",
},
{
title => "Blog article from Dr. Axel Rauschmayer",
url => "https://2ality.com/2017/03/es-integer.html",
},
{
title => "MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1366287",
},
],
notes_by_num => {
1 => "Can be enabled by setting `javascript.options.bigint` to \"True\" in `about:config`",
},
spec => "https://tc39.es/ecma262/#sec-bigint-objects",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 67 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 65 => "n d #1", 68 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.0-14.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "y" },
safari => { "3.1" => "n", "14" => "y" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "other",
title => "BigInt",
ucprefix => 0,
},
"blobbuilder" => {
categories => ["JS API"],
chrome_id => 5328783104016384,
description => "Construct Blobs (binary large objects) either using the BlobBuilder API (deprecated) or the Blob constructor.",
links => [
{
title => "MDN Web Docs - BlobBuilder",
url => "https://developer.mozilla.org/en/DOM/BlobBuilder",
},
{
title => "MDN Web Docs - Blobs",
url => "https://developer.mozilla.org/en-US/docs/DOM/Blob",
},
],
notes => "Partial support refers to only supporting the now deprecated BlobBuilder to create blobs.",
notes_by_num => {},
parent => "fileapi",
spec => "https://www.w3.org/TR/FileAPI/#constructorBlob",
stats => {
and_chr => { "2.1" => "n", "3" => "a x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 8 => "a x", 20 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 6 => "a x", 13 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "9" => "n", "12.1" => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Blob constructing",
ucprefix => 1,
},
"bloburls" => {
categories => ["JS API"],
description => "Method of creating URL handles to the specified File or Blob object.",
keywords => "createobjecturl,revokeobjecturl",
links => [
{
title => "MDN Web Docs - createObjectURL",
url => "https://developer.mozilla.org/en/DOM/window.URL.createObjectURL",
},
],
notes_by_num => { 1 => "Created blob url can't be used as object or iframe src" },
parent => "fileapi",
spec => "https://www.w3.org/TR/FileAPI/#url",
stats => {
and_chr => { "2.1" => "n", "4" => "y x", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 8 => "y x", 23 => "y" },
edge => { "5.5" => "n", "10" => "y #1", "15" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y x", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "y x", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Blob URLs",
ucprefix => 0,
},
"border-image" => {
categories => ["CSS3"],
description => "Method of using images for borders",
keywords => "border-image-source,border-image-slice,border-image-repeat,border-image-width,,border-image-outset",
links => [
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/border-image",
},
{
title => "MDN Web Docs - Border image",
url => "https://developer.mozilla.org//docs/Web/CSS/border-image",
},
],
notes => "Note that both the `border-style` and `border-width` must be specified (not set to `none` or 0) for border-images to work.",
notes_by_num => {
1 => "Has a bug where `border-image` incorrectly overrides `border-style`. See [test case](https://codepen.io/Savago/pen/yYrgyK), [WebKit bug](https://bugs.webkit.org/show_bug.cgi?id=99922), [discussion](https://github.com/whatwg/compat/issues/17)",
2 => "Partial support refers to not supporting `border-image-repeat: space`",
3 => "Partial support refers to supporting the shorthand syntax, but not the individual properties (`border-image-source`, `border-image-slice`, etc). ",
4 => "Partial support refers to not supporting `border-image-repeat: round`",
},
spec => "https://www.w3.org/TR/css3-background/#border-images",
stats => {
and_chr => { "2.1" => "a x #1 #2 #3 #4", "4.4" => "a #1 #2", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1 #2 #3 #4", 10 => "a #1 #2 #4" },
chrome => {
4 => "a x #1 #2 #3 #4",
15 => "a #1 #2 #4",
30 => "a #1 #2",
51 => "a #2",
56 => "y",
},
edge => { "5.5" => "n", "11" => "y", "12" => "y #1", "14" => "y" },
firefox => { "2" => "n", "3.5" => "a x #2 #3", "15" => "a #2", "50" => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => {
"15.4" => "y",
"3.2" => "a x #1 #2 #3 #4",
"6.0-6.1" => "a #1 #2 #4",
"9.3" => "y #1",
},
kaios => { "2.5" => "a #2", "3.0-3.1" => "y" },
op_mini => { all => "a x #2 #3 #4" },
op_mob => { 10 => "n", 11 => "a x #2 #3 #4", 80 => "y" },
opera => {
"9" => "n",
"10.5" => "a #2 #3 #4",
"11" => "a x #2 #3 #4",
"15" => "a #1 #2",
"38" => "a #2",
"43" => "y",
},
safari => {
"3.1" => "a x #1 #2 #3 #4",
"6" => "a #1 #2 #4",
"9.1" => "y #1",
"15.4" => "y",
},
samsung => { "4" => "a #1 #2", "5.0-5.4" => "a #2", "7.2-7.4" => "y" },
},
status => "cr",
title => "CSS3 Border images",
ucprefix => 0,
},
"border-radius" => {
categories => ["CSS3"],
description => "Method of making the border corners round. Covers support for the shorthand `border-radius` as well as the long-hand properties (e.g. `border-top-left-radius`)",
keywords => "roundedcorners, border radius,-moz-border-radius",
links => [
{
title => "Border-radius CSS Generator",
url => "https://border-radius.com",
},
{
title => "Detailed compliance table",
url => "https://muddledramblings.com/table-of-css3-border-radius-compliance",
},
{
title => "Polyfill which includes border-radius",
url => "http://css3pie.com/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/border-radius",
},
{
title => "MDN Web Docs - CSS border-radius",
url => "https://developer.mozilla.org/en/docs/Web/CSS/border-radius",
},
],
notes_by_num => {
1 => "Safari 6.1 and earlier did not apply `border-radius` correctly to image borders: https://stackoverflow.com/q/17202128",
2 => "Dotted and dashed rounded border corners are rendered as solid in Firefox. [see bug](https://bugzilla.mozilla.org/show_bug.cgi?id=382721)",
},
spec => "https://www.w3.org/TR/css3-background/#the-border-radius",
stats => {
and_chr => { "2.1" => "y x", "2.2" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y x", 5 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "a x #2", 3 => "y x #2", 4 => "y #2", 50 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y x", "4.0-4.1" => "y" },
kaios => { "2.5" => "y #2", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "y x", "5" => "y", "5.1" => "y #1", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 Border-radius (rounded corners)",
ucprefix => 0,
},
"broadcastchannel" => {
categories => ["JS API"],
chrome_id => 4585496197988352,
description => "BroadcastChannel allows scripts from the same origin but other browsing contexts (windows, workers) to send each other messages.",
keywords => "broadcast,channel,messaging",
links => [
{
title => "MDN Web Docs - Broadcast Channel",
url => "https://developer.mozilla.org/en-US/docs/Web/API/BroadcastChannel",
},
{
title => "Shim - Broadcast Channel based on Localstorage, Indexeddb or Sockets",
url => "https://github.com/pubkey/broadcast-channel",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/comms.html#broadcasting-to-other-browsing-contexts",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 54 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 38 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 41 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "ls",
title => "BroadcastChannel",
ucprefix => 0,
},
"brotli" => {
categories => ["Other"],
chrome_id => 5420797577396224,
description => "More effective lossless compression algorithm than gzip and deflate.",
keywords => "http,compression,accept,content,encoding",
links => [
{
title => "Introducing Brotli",
url => "https://opensource.googleblog.com/2015/09/introducing-brotli-new-compression.html",
},
{
title => "Blink's intent to ship",
url => "https://groups.google.com/a/chromium.org/forum/m/#!msg/blink-dev/JufzX024oy0/WEOGbN43AwAJ",
},
{
title => "Official code repository",
url => "https://github.com/google/brotli",
},
{
title => "WebKit Bug 154859: Add support for format brotli for HTTP compression",
url => "https://bugs.webkit.org/show_bug.cgi?id=154859",
},
],
notes_by_num => {
1 => "Supported in Chrome and Opera behind the 'Brotli Content-Encoding' flag",
2 => "Enabled since 27 May 2016",
3 => "Support starting with macOS 10.13 High Sierra",
},
spec => "https://tools.ietf.org/html/rfc7932",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "n d #1", 50 => "y #2", 51 => "y" },
edge => { "5.5" => "n", "15" => "y" },
firefox => { 2 => "n", 44 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "n d #1", 38 => "y" },
safari => { "3.1" => "n", "11" => "y #3", "13" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Brotli Accept-Encoding/Content-Encoding",
ucprefix => 0,
},
"calc" => {
categories => ["CSS3"],
chrome_id => 5765241438732288,
description => "Method of allowing calculated values for length units, i.e. `width: calc(100% - 3em)`",
links => [
{
title => "Mozilla Hacks article",
url => "https://hacks.mozilla.org/2010/06/css3-calc/",
},
{
title => "MDN Web Docs - calc",
url => "https://developer.mozilla.org/en/docs/Web/CSS/calc",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/functions/calc",
},
],
notes => "Support can be somewhat emulated in older versions of IE using the non-standard `expression()` syntax.\r\n\r\nDue to the way browsers handle [sub-pixel rounding](https://johnresig.com/blog/sub-pixel-problems-in-css/) differently, layouts using `calc()` expressions may have unexpected results.",
notes_by_num => {
1 => "Partial support in Android Browser 4.4 refers to the browser lacking the ability to multiply and divide values.",
2 => "Partial support in IE9 refers to the browser crashing when used as a `background-position` value.",
3 => "Partial support in IE10/IE11 refers to calc not working properly with various use cases mentioned in known issues",
},
spec => "https://w3c.github.io/csswg-drafts/css-values-3/#calc-notation",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 19 => "y x", 26 => "y" },
edge => { "5.5" => "n", "9" => "a #2", "10" => "a #3", "12" => "y" },
firefox => { 2 => "n", 4 => "y x", 16 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y x", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "y x", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "calc() as CSS unit value",
ucprefix => 0,
},
"canvas" => {
categories => ["Canvas", "HTML5"],
chrome_id => 5100084685438976,
description => "Method of generating fast, dynamic graphics using JavaScript.",
keywords => "canvas,toDataURL()",
links => [
{
title => "Tutorial by Mozilla",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial",
},
{
title => "Animation kit",
url => "http://glimr.rubyforge.org/cake/canvas.html",
},
{
title => "Another tutorial",
url => "https://diveintohtml5.info/canvas.html",
},
{
title => "Implementation for Internet Explorer",
url => "https://github.com/arv/ExplorerCanvas",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/graphics.js#canvas",
},
{
title => "Canvas Tutorial & Cheat Sheet",
url => "https://skilled.co/html-canvas/",
},
{
title => "MDN Web Docs - Canvas API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API",
},
],
notes => "For screen readers, IE, Chrome & Firefox support the [accessible canvas element sub-DOM](http://www.paciellogroup.com/blog/2012/06/html5-canvas-accessibility-in-firefox-13/).\r\nFirefox & Chrome also support the drawfocus ring.",
notes_by_num => {
1 => "Does not support `toDataURL()`",
2 => "Opera Mini supports the canvas element, but is unable to play animations or run other more complex applications.",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#the-canvas-element",
stats => {
and_chr => { "2.1" => "a #1", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "y" },
firefox => { "2" => "a #1", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #2" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "a #1", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Canvas (basic support)",
ucprefix => 0,
},
"canvas-blending" => {
categories => ["Canvas"],
description => "Method of defining the effect resulting from overlaying two layers on a Canvas element.",
links => [
{
title => "Blog post",
url => "https://blogs.adobe.com/webplatform/2013/01/28/blending-features-in-canvas/",
},
],
notes_by_num => {},
parent => "canvas",
spec => "https://www.w3.org/TR/compositing-1/#blending",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 30 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 20 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 17 => "y" },
safari => { "3.1" => "n", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Canvas blend modes",
ucprefix => 0,
},
"canvas-text" => {
categories => ["Canvas", "HTML5"],
description => "Method of displaying text on Canvas elements",
links => [
{
title => "Examples by Mozilla",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text",
},
{
title => "Support library",
url => "https://code.google.com/archive/p/canvas-text/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/graphics.js#canvas-text",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/canvas/CanvasRenderingContext2D/fillText",
},
],
notes_by_num => {},
parent => "canvas",
spec => "https://html.spec.whatwg.org/multipage/scripting.html#drawing-text-to-the-bitmap",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "y" },
firefox => { "2" => "p", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "p", 11 => "y" },
opera => { "9" => "p", "10.5" => "y" },
safari => { "3.1" => "p", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Text API for Canvas",
ucprefix => 0,
},
"ch-unit" => {
categories => ["CSS3"],
description => "Unit representing the width of the character \"0\" in the current font, of particular use in combination with monospace fonts.",
keywords => "ch unit,character unit",
links => [
{
title => "Blog post on using ch units",
url => "https://johndjameson.com/posts/making-sense-of-ch-units",
},
{
title => "What is the CSS \x{2018}ch\x{2019} Unit?",
url => "https://meyerweb.com/eric/thoughts/2018/06/28/what-is-the-css-ch-unit/",
},
],
notes_by_num => {
1 => "IE supports the `ch` unit, but unlike other browsers its width is that specifically of the \"0\" glyph, not its surrounding space. As a result, 3ch for example is shorter than the width of the string \"000\" in IE.",
},
spec => "https://www.w3.org/TR/css3-values/#ch",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 27 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "12" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "ch (character) unit",
ucprefix => 0,
},
"chacha20-poly1305" => {
categories => ["Security"],
chrome_id => 5355238106071040,
description => "A set of cipher suites used in Transport Layer Security (TLS) protocol, using ChaCha20 for symmetric encryption and Poly1305 for authentication.",
keywords => "chacha20,poly1305,tls,cipher",
links => [
{
title => "Chrome article",
url => "https://security.googleblog.com/2014/04/speeding-up-and-strengthening-https.html",
},
{
title => "SSL/TLS Capabilities of Your Browser by Qualys SSL Labs",
url => "https://www.ssllabs.com/ssltest/viewMyClient.html",
},
],
notes_by_num => {
1 => "Old versions of Chrome use non-standard code points for ChaCha20-Poly1305 cipher suites.",
},
spec => "https://tools.ietf.org/html/rfc7905",
stats => {
and_chr => { "135" => "y", "2.1" => "n", "4.4.3-4.4.4" => "u" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 33 => "y #1", 49 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 47 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "ChaCha20-Poly1305 cipher suites for TLS",
ucprefix => 0,
},
"channel-messaging" => {
categories => ["JS API"],
chrome_id => 6710044586409984,
description => "Method for having two-way communication between browsing contexts (using MessageChannel)",
links => [
{
title => "An Introduction to HTML5 web messaging",
url => "https://dev.opera.com/articles/view/window-postmessage-messagechannel/#channel",
},
{
title => "MDN Web Docs - Channel Messaging API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Channel_Messaging_API",
},
],
notes_by_num => {
1 => "Supported in Firefox behind the `dom.messageChannel.enabled` flag. Reported to not work in web workers before version 41.",
},
parent => "x-doc-messaging",
spec => "https://html.spec.whatwg.org/multipage/comms.html#channel-messaging",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 26 => "n d #1", 41 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "u", "10.6" => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Channel messaging",
ucprefix => 0,
},
"childnode-remove" => {
categories => ["DOM"],
description => "DOM node method to remove the node itself from the document.",
keywords => "ChildNode,remove,delete,node,DOM",
links => [
{
title => "MDN Web Docs - ChildNode.remove",
url => "https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/remove",
},
],
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-childnode-remove",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 24 => "y" },
edge => { "5.5" => "n", "12" => "u", "13" => "y" },
firefox => { 2 => "n", 23 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "u", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "ChildNode.remove()",
ucprefix => 0,
},
"classlist" => {
categories => ["DOM", "HTML5"],
description => "Method of easily manipulating classes on elements, using the `DOMTokenList` object.",
keywords => "classlist.contains(),classlist.toggle(),classlist.add(),classlist.remove()",
links => [
{
title => "Mozilla Hacks article",
url => "https://hacks.mozilla.org/2010/01/classlist-in-firefox-3-6/",
},
{
title => "Polyfill script",
url => "https://github.com/eligrey/classList.js",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/Element/classList",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/exploring-classlist-api/",
},
{
title => "Demo using classList",
url => "https://www.audero.it/demo/classlist-api-demo.html",
},
{
title => "MDN Web Docs - Element.classList",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element.classList",
},
],
notes_by_num => {
1 => "Does not have support for `classList` on SVG or MathML elements.",
2 => "Does not support the second parameter for the `toggle` method",
3 => "Does not support multiple parameters for the `add()` & `remove()` methods",
4 => "Does not support assign to `classList` or the `replace()` method",
},
spec => "https://dom.spec.whatwg.org/#dom-element-classlist",
stats => {
and_chr => { "2.1" => "p", "3" => "a #1 #2 #3", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1 #2 #3", 10 => "y" },
chrome => { 4 => "p", 8 => "a #1 #2 #3", 23 => "a #2 #3", 24 => "a #3", 28 => "y" },
edge => { "5.5" => "p", "10" => "a #1 #2 #3 #4", "12" => "y" },
firefox => { "2" => "p", "3.6" => "a #2 #3", "24" => "a #3", "26" => "y" },
ie_mob => { 10 => "a #1 #2 #3" },
ios_saf => { "3.2" => "p", "5.0-5.1" => "a #1 #2 #3", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1 #2 #3" },
op_mob => { "10" => "p", "11.1" => "a #1 #2 #3", "80" => "y" },
opera => { "9" => "p", "11.5" => "a #1 #2 #3", "15" => "y" },
safari => { "3.1" => "p", "5.1" => "a #1 #2 #3", "7" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "classList (DOMTokenList)",
ucprefix => 0,
},
"client-hints-dpr-width-viewport" => {
categories => ["DOM"],
chrome_id => 5504430086553600,
description => "DPR, Width, and Viewport-Width hints enable proactive content negotiation between client and server, enabling automated delivery of optimized assets - e.g. auto-negotiating image DPR resolution.",
keywords => "client hints, client-hints, dpr, viewport, content-dpr",
links => [
{
title => "Automating resource selection with Client Hints",
url => "https://developers.google.com/web/updates/2015/09/automating-resource-selection-with-client-hints",
},
{
title => "Mozilla Bug 935216 - Implement Client-Hints HTTP header",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=935216",
},
{
title => "WebKit Bug 145380 - Add Content-DPR header support",
url => "https://bugs.webkit.org/show_bug.cgi?id=145380",
},
],
notes_by_num => {},
spec => "https://tools.ietf.org/html/draft-grigorik-http-client-hints",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 46 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 33 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Client Hints: DPR, Width, Viewport-Width",
ucprefix => 0,
},
"clipboard" => {
categories => ["JS API"],
description => "API to provide copy, cut and paste events as well as provide access to the OS clipboard.",
keywords => "cut,copy,paste,clipboarddata,clipboardevent",
links => [
{
title => "MDN Web Docs - ClipboardEvent",
url => "https://developer.mozilla.org/en-US/docs/Web/API/ClipboardEvent",
},
{
title => "Guide on cross-platform clipboard access",
url => "https://www.lucidchart.com/techblog/2014/12/02/definitive-guide-copying-pasting-javascript/",
},
],
notes => "Internet Explorer will display a security prompt for access to the OS clipboard.\r\n\r\nChrome 42+, Opera 29+ and Firefox 41+ support clipboard reading/writing only when part of a user action (click, keydown, etc).",
notes_by_num => {
1 => "Only supports `Text` and `URL` data types and uses [a non-standard method](https://msdn.microsoft.com/en-us/library/ie/ms535220%28v=vs.85%29.aspx) of interacting with the clipboard.",
2 => "Only fires `copy` event on a valid selection and only `cut` and `paste` in focused editable fields.",
3 => "Only supports OS clipboard reading/writing via shortcut keys, not through `document.execCommand()`.",
4 => "Only supports `paste` event (on focused editable field).",
5 => "Does not support the `ClipboardEvent` constructor",
6 => "Supports `cut` & `copy` events without a focused editable field, but not `paste` (presumably for security reasons)",
7 => "Supports `cut` & `copy` events without a focused editable field, but does not fire `paste` with `document.execCommand('paste')` ",
},
spec => "https://www.w3.org/TR/clipboard-apis/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a #2 #5", "135" => "a #2" },
and_ff => { 137 => "a #4" },
and_qq => { "14.9" => "a #7" },
and_uc => { "15.5" => "a #7" },
baidu => { "13.52" => "a #7" },
bb => { 7 => "n", 10 => "a #2 #5" },
chrome => { 4 => "n", 13 => "a #3 #5", 43 => "a #5 #7", 58 => "a #7" },
edge => { "5.5" => "a #1 #2 #5", "17" => "a #2", "79" => "a #7" },
firefox => { 2 => "n", 22 => "a #2 #3", 41 => "a #6" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "y", "3.2" => "n", "5.0-5.1" => "a #2 #3 #5" },
kaios => { "2.5" => "a #6" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12.1" => "u", "80" => "a #7" },
opera => {
"9" => "n",
"12" => "u",
"12.1" => "a #3",
"15" => "a #3 #5",
"30" => "a #5 #7",
"45" => "a #7",
},
safari => { "3.1" => "u", "4" => "a #2 #3 #5", "10" => "a #2 #5", "12" => "y" },
samsung => { "4" => "a #2 #5", "5.0-5.4" => "a #5", "7.2-7.4" => "a #7" },
},
status => "wd",
title => "Synchronous Clipboard API",
ucprefix => 0,
},
"colr" => {
categories => ["Other"],
chrome_id => 5897235770376192,
description => "The COLR table adds support for multi-colored glyphs in a manner that integrates with the rasterizers of existing text engines. COLRv0 only supports pure colors, does not support gradients, transformations and various blending modes.",
keywords => "colr,cpal,font,color-font,fontface,webfonts",
links => [
{
title => "Where can I use color fonts",
url => "https://www.colorfonts.wtf/#w-node-85d8080e63a6-0134536f",
},
{
title => "DirectWrite's color fonts document",
url => "https://docs.microsoft.com/en-us/windows/win32/directwrite/color-fonts",
},
{
title => "A tool to check whether the browser supports OpenType color formats",
url => "https://pixelambacht.nl/chromacheck/",
},
{
title => "A variable color font",
url => "https://www.harbortype.com/fonts/rocher-color/",
},
{
title => "Make COLR/CPAL format fonts in Glyphs app",
url => "https://glyphsapp.com/learn/creating-a-microsoft-color-font",
},
],
notes_by_num => {
1 => "Supported only on Safari for macOS High Sierra (10.13)+",
2 => "Supported only on Windows 8.1+",
3 => "On Windows pre 8.1 and macOS Sierra (10.12) and below falls back to using FreeType: [Chromium bug 882844](https://bugs.chromium.org/p/chromium/issues/detail?id=882844#c3)",
4 => "COLRv0 support was disabled by a regression bug in Safari 17.0 and 17.1: [Issue 262223](https://bugs.webkit.org/show_bug.cgi?id=262223)",
},
parent => "fontface",
spec => "https://docs.microsoft.com/en-us/typography/opentype/spec/colr",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "n", 71 => "y #3", 110 => "y" },
edge => { "5.5" => "n", "9" => "y #2", "12" => "y", "79" => "y #3", "110" => "y" },
firefox => { 2 => "n", 32 => "y" },
ie_mob => { 10 => "u" },
ios_saf => { "11.0-11.2" => "y", "17.0" => "n #4", "17.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 58 => "y #3", 96 => "y" },
safari => { "3.1" => "n", "11" => "y #1", "14" => "y", "17.0" => "n #4", "17.2" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "other",
title => "COLR/CPAL(v0) Font Formats",
ucprefix => 0,
},
"colr-v1" => {
categories => ["Other"],
chrome_id => 5638148514119680,
description => "COLRv1 is an improved version of COLRv0, this is also part of the OpenType specification. COLRv1 supports additional graphic capabilities. In addition to solid colors, gradient fills can be used, as well as more complex fills using other graphic operations, including affine transformations and various blending modes.",
keywords => "colr,colrv1,cpal,font,color-font,fontface,webfonts",
links => [
{
title => "COLRv1 Color Gradient Vector Fonts in Chrome 98",
url => "https://developer.chrome.com/blog/colrv1-fonts/",
},
{
title => "COLRv1 version of Noto Emoji",
url => "https://github.com/googlefonts/color-fonts",
},
{
title => "A tool to check whether the browser supports OpenType color formats",
url => "https://pixelambacht.nl/chromacheck/",
},
{
title => "Where can I use color fonts",
url => "https://www.colorfonts.wtf/#w-node-85d8080e63a6-0134536f",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1740525",
},
{
title => "WebKit position",
url => "https://lists.webkit.org/pipermail/webkit-dev/2021-March/031765.html",
},
{
title => "First Batch of Color Fonts Arrives on Google Fonts",
url => "https://material.io/blog/color-fonts-are-here",
},
],
notes_by_num => {
1 => "Can be enabled with the \"COLR v1 Fonts\" feature flag under `chrome://flags`",
2 => "Firefox actively supports this format and will consider implementing it in the future: [https://mozilla.github.io/standards-positions/#font-colrv1](https://mozilla.github.io/standards-positions/#font-colrv1)",
3 => "Can be enabled by setting `gfx.font_rendering.colr_v1.enabled` to true",
},
parent => "fontface",
spec => "https://docs.microsoft.com/en-us/typography/opentype/spec/colr",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "u" },
chrome => { 4 => "n", 90 => "n d #1", 98 => "y" },
edge => { "5.5" => "n", "98" => "y" },
firefox => { 2 => "n", 98 => "n #2", 105 => "n d #3", 107 => "y" },
ie_mob => { 10 => "u" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 86 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "18.0" => "y" },
},
status => "other",
title => "COLR/CPAL(v1) Font Formats",
ucprefix => 0,
},
"comparedocumentposition" => {
categories => ["DOM"],
description => "Compares the relative position of two nodes to each other in the DOM tree.",
keywords => "Node,compareDocumentPosition,compare,document,position,preceding,following,disconnected,before,after,contains,contained,DOM",
links => [
{
title => "MDN Web Docs - Node.compareDocumentPosition",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Node/compareDocumentPosition",
},
],
notes_by_num => {
1 => "The spec requires that comparisons of nodes in different documents, and comparisons where at least one node is not in any document, must arbitrarily (but consistently) set either the `DOCUMENT_POSITION_PRECEDING` or `DOCUMENT_POSITION_FOLLOWING` bit in the result. These browser versions don't set either bit in some such cases.",
2 => "Sets neither the `DOCUMENT_POSITION_DISCONNECTED` bit nor the `DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC` bit in some cases when comparing nodes in different documents or when comparing a node which is not in any document.",
},
spec => "https://dom.spec.whatwg.org/#dom-node-comparedocumentposition",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "u", 15 => "a #1", 30 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "u", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "u", "4.0-4.1" => "a #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "u", 12 => "y" },
opera => { "9" => "u", "11.6" => "y", "15" => "a #1", "17" => "y" },
safari => { "3.1" => "u", "5.1" => "a #2", "6" => "u", "6.1" => "a #1", "10" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Node.compareDocumentPosition()",
ucprefix => 0,
},
"console-basic" => {
categories => ["JS API"],
description => "Method of outputting data to the browser's console, intended for development purposes.",
keywords => "console.log,console.info,console.warn,console.error,window.console",
links => [
{
title => "MDN Web Docs - Console",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Console",
},
{
title => "Chrome console reference",
url => "https://developer.chrome.com/devtools/docs/console-api",
},
{
title => "Edge/Internet Explorer console reference",
url => "https://msdn.microsoft.com/en-us/library/hh772169",
},
],
notes => "The basic functions that this information refers to include `console.log`, `console.info`, `console.warn`, `console.error`.",
notes_by_num => {
1 => "Only supports console functions when developer tools are open, otherwise the `console` object is undefined and any calls will throw errors.",
2 => "Allows `console` functions to be used without throwing errors, but does not appear to output the data anywhere.",
3 => "Log output on iOS 6+ Safari can only be seen by connecting to a Mac and using the [Safari debugger](https://developer.apple.com/safari/tools/).",
4 => "Log output on older Android browsers can be retrieved via Android's `logcat` command or using Chrome Developer Tools in Android 4.4+/Chrome for Android [see details](https://developer.android.com/guide/webapps/debugging.html)",
5 => "Log output on Firefox for Android can be [accessed using WebIDE](https://developer.mozilla.org/en-US/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_with_WebIDE)",
6 => "See [this article](https://dev.opera.com/articles/opera-mini-and-javascript/) for details on how to see console logging in Opera Mini",
},
spec => "https://console.spec.whatwg.org/",
stats => {
and_chr => { "2.1" => "y #4" },
and_ff => { 137 => "y #5" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "n #2" },
baidu => { "13.52" => "y #4" },
bb => { 7 => "n #2" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "a #1", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "n #2" },
ios_saf => { "3.2" => "y", "6.0-6.1" => "y #3" },
kaios => { "2.5" => "y" },
op_mini => { all => "y #6" },
op_mob => { 10 => "n", 11 => "n #2", 80 => "y #4" },
opera => { 9 => "n", 11 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y #4" },
},
status => "ls",
title => "Basic console logging functions",
ucprefix => 0,
},
"console-time" => {
categories => ["JS API"],
description => "Functions for measuring performance",
keywords => "console.time,console.timeEnd,window.console",
links => [
{
title => "MDN Web Docs - Console.time",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Console/time",
},
],
notes => "`console.time()` starts a timer you can use to track how long an operation takes. You give each timer a unique name, and may have up to 10,000 timers running on a given page. When you call `console.timeEnd()` with the same name, the browser will output the time, in milliseconds, that elapsed since the timer was started. These functions are not always available in `workers`. For example, in Firefox, they are available from version `38`. More on using the `console` on mobile devices, see [here](https://caniuse.com/#feat=console-basic). ",
notes_by_num => {},
parent => "console-basic",
spec => "https://console.spec.whatwg.org/#time",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "n", 10 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "u", 80 => "y" },
opera => { "9" => "n", "11" => "u", "11.1" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "console.time and console.timeEnd",
ucprefix => 0,
},
"const" => {
categories => ["JS"],
chrome_id => 4645595339816960,
description => "Declares a constant with block level scope",
keywords => "ES6,constant,block,scope",
links => [
{
title => "Variables and Constants in ES6",
url => "https://generatedcontent.org/post/54444832868/variables-and-constants-in-es6",
},
{
title => "MDN Web Docs - const",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const",
},
],
notes_by_num => {
1 => "const is recognized, but treated like var (no block scope, can be overwritten)",
2 => "const does not have block scope",
3 => "Only recognized when NOT in strict mode",
4 => "Supported correctly in strict mode, otherwise supported without block scope",
5 => "Not supported in for-in and for-of loops",
},
spec => "https://tc39.es/ecma262/#sec-let-and-const-declarations",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #2", "3" => "a #2 #3", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #2 #3" },
chrome => { 4 => "a #2", 21 => "a #2 #3", 41 => "a #4", 49 => "y" },
edge => { "5.5" => "n", "11" => "a #5", "12" => "y" },
firefox => { 2 => "a #1", 13 => "a #2", 36 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => {
"10.0-10.2" => "a #2",
"11.0-11.2" => "y",
"3.2" => "a #2",
"5.0-5.1" => "a #2 #3",
},
kaios => { "2.5" => "y" },
op_mini => { all => "a #1 #3" },
op_mob => { 10 => "a #1", 12 => "a #1 #3", 80 => "y" },
opera => {
"10.0-10.1" => "a #1",
"11.6" => "a #1 #3",
"15" => "a #2 #3",
"28" => "a #4",
"36" => "y",
"9" => "n",
},
safari => { "3.1" => "a #2", "5.1" => "a #2 #3", "10" => "a #2", "11" => "y" },
samsung => { "4" => "a #4", "5.0-5.4" => "y" },
},
status => "other",
title => "const",
ucprefix => 0,
},
"constraint-validation" => {
categories => ["JS API"],
description => "API for better control over form field validation. Includes support for `checkValidity()`, `setCustomValidity()`, `reportValidity()` and validation states.",
links => [
{
title => "MDN article on constraint validation",
url => "https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation",
},
{
title => "`reportValidity()` ponyfill",
url => "https://github.com/jelmerdemaat/report-validity",
},
],
notes_by_num => {
1 => "Does not support `reportValidity`",
2 => "Does not support `validity.tooShort`. See also [support for `minlength`.](https://caniuse.com/#feat=input-minlength)",
3 => "Does not support `validity.badInput`",
},
spec => "https://html.spec.whatwg.org/dev/form-control-infrastructure.html#the-constraint-validation-api",
stats => {
and_chr => { "2.1" => "u", "4" => "a #1 #2 #3", "4.4" => "a #1 #2", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "a #1 #2" },
chrome => { 4 => "u", 15 => "a #1 #2 #3", 25 => "a #1 #2", 40 => "y" },
edge => { "5.5" => "n", "10" => "a #1 #2 #3", "14" => "a #1 #2", "17" => "y" },
firefox => { 2 => "n", 4 => "a #1 #2 #3", 29 => "a #1 #2", 49 => "a #2", 51 => "y" },
ie_mob => { 10 => "a #1 #2 #3" },
ios_saf => {
"10.0-10.2" => "y",
"3.2" => "u",
"5.0-5.1" => "a #1 #2 #3",
"7.0-7.1" => "a #1 #2",
},
kaios => { "2.5" => "a #1 #2", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "u", 12 => "a #1 #2 #3", 80 => "y" },
opera => { "9" => "u", "11.6" => "a #1 #2 #3", "15" => "a #1 #2", "27" => "y" },
safari => { "3.1" => "u", "5.1" => "a #1 #2 #3", "7.1" => "a #1 #2", "10" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Constraint Validation API",
ucprefix => 0,
},
"contenteditable" => {
categories => ["HTML5"],
description => "Method of making any HTML element editable.",
keywords => "iscontenteditable",
links => [
{
title => "WHATWG blog post",
url => "https://blog.whatwg.org/the-road-to-html-5-contenteditable",
},
{
title => "Blog post on usage problems",
url => "https://accessgarage.wordpress.com/2009/05/08/how-to-hack-your-app-to-make-contenteditable-work/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/attributes/contentEditable",
},
{
title => "MDN Web Docs - contentEditable attribute",
url => "https://developer.mozilla.org/en/docs/Web/API/HTMLElement/contentEditable",
},
],
notes => "This support only refers to very basic editing capability, implementations vary significantly on how certain elements can be edited.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/interaction.html#contenteditable",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "y" },
firefox => { "2" => "n", "3" => "a", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "contenteditable attribute (basic support)",
ucprefix => 0,
},
"contentsecuritypolicy" => {
categories => ["Security"],
chrome_id => 5205088045891584,
description => "Mitigate cross-site scripting attacks by only allowing certain sources of script, style, and other resources.",
keywords => "csp,security,header",
links => [
{
title => "HTML5Rocks article",
url => "https://www.html5rocks.com/en/tutorials/security/content-security-policy/",
},
{
title => "CSP Examples & Quick Reference",
url => "https://content-security-policy.com/",
},
{
title => "MDN Web Docs - Content Security Policy",
url => "https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP",
},
],
notes => "The standard HTTP header is `Content-Security-Policy` which is used unless otherwise noted.",
notes_by_num => {
1 => "Supported through the `X-Content-Security-Policy` header",
2 => "Supported through the `X-WebKit-CSP` header",
},
spec => "https://www.w3.org/TR/2012/CR-CSP-20121115/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y #2" },
chrome => { 4 => "n", 14 => "y #2", 25 => "y" },
edge => { "5.5" => "n", "10" => "a #1", "12" => "y" },
firefox => { 2 => "n", 4 => "y #1", 23 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "a #2", "6.0-6.1" => "y #2", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5.1" => "a #2", "6" => "y #2", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Content Security Policy 1.0",
ucprefix => 0,
},
"contentsecuritypolicy2" => {
categories => ["Security"],
chrome_id => 4957003285790720,
description => "Mitigate cross-site scripting attacks by only allowing certain sources of script, style, and other resources. CSP 2 adds hash-source, nonce-source, and five new directives",
keywords => "csp,header,nonce,hash",
links => [
{
title => "HTML5Rocks article",
url => "https://www.html5rocks.com/en/tutorials/security/content-security-policy/",
},
{
title => "MDN Web Docs - Content Security Policy",
url => "https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP",
},
],
notes_by_num => {
1 => "Firefox 31-34 is missing the child-src, frame-ancestors, base-uri, and form-action directives.",
2 => "Firefox 35 is missing the child-src, frame-ancestors, and form-action directives.",
3 => "Firefox 36-44 is missing the child-src directives.",
4 => "Chrome 36-38 & Opera 23-25 are missing the child-src, frame-ancestors, base-uri, and form-action directives.",
5 => "Chrome 39 and Opera 26 are missing the child-src, base-uri, and form-action directives.",
6 => "Edge has broken nonce support as it ignores nonces on sourced scripts.",
},
spec => "https://www.w3.org/TR/CSP2/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 36 => "a #4", 39 => "a #5", 40 => "y" },
edge => { "5.5" => "n", "15" => "a #6", "79" => "y" },
firefox => { 2 => "n", 31 => "a #1", 35 => "a #2", 36 => "a #3", 45 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 23 => "a #4", 26 => "a #5", 27 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "Content Security Policy Level 2",
ucprefix => 0,
},
"cookie-store-api" => {
categories => ["JS API"],
chrome_id => 5658847691669504,
description => "An API for reading and modifying cookies. Compared to the existing `document.cookie` method, the API provides a much more modern interface, which can also be used in service workers.",
keywords => "document.cookie,cookieStore,window.cookieStore",
links => [
{
title => "Article on using the Cookie Store API",
url => "https://developers.google.com/web/updates/2018/09/asynchronous-access-to-http-cookies",
},
{
title => "Specification explainer",
url => "https://wicg.github.io/cookie-store/explainer.html",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1475599",
},
{
title => "WebKit position",
url => "https://github.com/WebKit/standards-positions/issues/36",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=258504",
},
],
notes_by_num => {
1 => "Can be enabled with the `#enable-experimental-web-platform-features` flag.",
2 => "Can be enabled with the `dom.cookieStore.enabled` flag.",
},
spec => "https://wicg.github.io/cookie-store/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 64 => "n d #1", 87 => "y" },
edge => { "5.5" => "n", "79" => "n d #1", "87" => "y" },
firefox => { 2 => "n", 132 => "n d #2", 139 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "18.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 51 => "n d #1", 74 => "y" },
safari => { "3.1" => "n", "18.4" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "unoff",
title => "Cookie Store API",
ucprefix => 0,
},
"cors" => {
categories => ["JS API", "Security"],
description => "Method of performing XMLHttpRequests across domains",
links => [
{
title => "Mozilla Hacks blog post",
url => "https://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/",
},
{
title => "Alternative implementation by IE8",
url => "https://msdn.microsoft.com/en-us/library/cc288060(VS.85).aspx",
},
{
title => "DOM access using CORS",
url => "https://dev.opera.com/articles/view/dom-access-control-using-cross-origin-resource-sharing/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-cors-xhr",
},
{
title => "MDN Web Docs - Access control CORS",
url => "https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS",
},
],
notes_by_num => {
1 => "Does not support CORS for images in `<canvas>`",
2 => "Supported somewhat in IE8 and IE9 using the XDomainRequest object (but has [limitations](https://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx))",
3 => "Does not support CORS for `<video>` in `<canvas>`: https://bugs.webkit.org/show_bug.cgi?id=135379",
4 => "Does not support CORS for resources which redirect: https://bugzilla.mozilla.org/show_bug.cgi?id=1346749",
},
spec => "https://fetch.spec.whatwg.org/#http-cors-protocol",
stats => {
and_chr => { "2.1" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1", 10 => "y" },
chrome => { 4 => "a #1", 13 => "y" },
edge => { "5.5" => "n", "8" => "a #2", "10" => "a #1", "11" => "y" },
firefox => { "2" => "n", "3.5" => "y", "61" => "y #4", "71" => "y" },
ie_mob => { 10 => "a #1", 11 => "y" },
ios_saf => { "3.2" => "a #1 #3", "6.0-6.1" => "y #3" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 12 => "y" },
opera => { 9 => "n", 12 => "y" },
safari => { "3.1" => "n", "4" => "a #1 #3", "6" => "y #3" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Cross-Origin Resource Sharing",
ucprefix => 0,
},
"createimagebitmap" => {
categories => ["JS API"],
description => "Create image bitmap with support for resizing and adjusting quality",
links => [
{
title => "self.createImageBitmap() - Web APIs | MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/createImageBitmap",
},
],
notes_by_num => {
1 => "No support for options parameter, resizeWidth, resizeHeight, resizeQuality or SVGImageElement as Source Image",
2 => "No support for resizeWidth, resizeHeight, resizeQuality or SVGImageElement as Source Image",
3 => "No support for SVGImageElement as Source Image",
4 => "No support for resizeWidth, resizeHeight and resizeQuality. See [this bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1363861)",
5 => "No support for `createImageBitmap(source, options)` interface. See [this bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1335594)",
6 => "No support for premultiplyAlpha with `ImageData` as Source Image. See [this bug](https://bugs.webkit.org/show_bug.cgi?id=237082)",
7 => "No support for resizeQuality. See [this bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1363861)",
},
spec => "https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#dom-createimagebitmap",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "a #7" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 50 => "a #1", 52 => "a #2", 54 => "a #3", 59 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 42 => "a #4 #5", 93 => "a #4", 98 => "a #7" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "a #6", "17.0" => "y", "3.2" => "n" },
kaios => { "2.5" => "a #4 #5" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 37 => "a #1", 39 => "a #2", 41 => "a #3", 46 => "y" },
safari => { "3.1" => "n", "15" => "a #6", "17.0" => "y" },
samsung => { "4" => "u", "6.2-6.4" => "y" },
},
status => "ls",
title => "createImageBitmap",
ucprefix => 0,
},
"credential-management" => {
categories => ["JS API", "Security"],
chrome_id => 5026422640869376,
description => "API that provides a programmatic interface to the browser's credential manager. In short, an origin can request a user's credentials to sign them in, or can ask the browser to save credentials on the user's behalf. Both of these requests are user-mediated.",
keywords => "credential,navigator.credentials",
links => [
{
title => "Tutorial by Google",
url => "https://developers.google.com/web/updates/2016/04/credential-management-api",
},
{
title => "MDN Web Docs - Credential Management API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Credential_Management_API",
},
{
title => "Live Demo",
url => "https://credential-management-sample.appspot.com/",
},
{
title => "Sample Code",
url => "https://github.com/GoogleChrome/credential-management-sample",
},
{
title => "Spec discussion",
url => "https://github.com/w3c/webappsec-credential-management",
},
],
notes_by_num => {
1 => "In Chrome 51 ~ 56, PSL matched credentials are not supported. This means you cannot use credentials set on a.example.com in b.example.com. This is supported since Chrome 57.",
},
spec => "https://www.w3.org/TR/credential-management-1/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 48 => "n d", 51 => "y #1", 57 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "14.0-14.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 45 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "wd",
title => "Credential Management API",
ucprefix => 0,
},
"cross-document-view-transitions" => {
categories => ["CSS", "JS API"],
chrome_id => 5118874666663936,
description => "Provides a mechanism for easily creating animated transitions between different DOM states, while also updating the DOM contents in a single step. This API is specific to cross-document transitions.",
keywords => "ViewTransition,\@view-transition",
links => [
{
title => "Explainer document",
url => "https://github.com/WICG/view-transitions/blob/main/cross-doc-explainer.md",
},
{
title => "View Transition API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/View_Transition_API",
},
{
title => "Chrome Developers documentation",
url => "https://developer.chrome.com/docs/web-platform/view-transitions/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1860854",
},
],
notes => "See also support for the [Navigation API](/mdn-api_navigation) which can be used for some view transition behavior.",
notes_by_num => {},
spec => "https://www.w3.org/TR/css-view-transitions-2/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 126 => "y" },
edge => { "5.5" => "n", "126" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "18.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 112 => "y" },
safari => { "3.1" => "n", "18.2" => "y" },
samsung => { 4 => "n" },
},
status => "wd",
title => "View Transitions (cross-document)",
ucprefix => 0,
},
"cryptography" => {
categories => ["JS API", "Security"],
chrome_id => 5030265697075200,
description => "JavaScript API for performing basic cryptographic operations in web applications",
keywords => "subtle,subtlecrypto",
links => [
{
title => "The History and Status of Web Crypto API",
url => "https://www.slideshare.net/Channy/the-history-and-status-of-web-crypto-api",
},
{
title => "Microsoft Research JavaScript Cryptography Library",
url => "https://github.com/microsoft/MSR-JavaScript-Crypto",
},
{
title => "Cross-browser cryptography library",
url => "https://bitwiseshiftleft.github.io/sjcl/",
},
{
title => "Polyfill by Netflix with partial support",
url => "https://github.com/Netflix/NfWebCrypto",
},
{
title => "PKI.js - another crypto library for Public Key Infrastructure applications",
url => "https://github.com/GlobalSign/PKI.js",
},
{
title => "Test suite for various algorithms/methods",
url => "https://diafygi.github.io/webcrypto-examples/",
},
{
title => "Web Cryptography API shim for IE11 and Safari - set of bugfixes and workarounds of prefixed api implementations",
url => "https://github.com/vibornoff/webcrypto-shim",
},
{
title => "MDN Web Docs - Web Crypto API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Web_Crypto_API",
},
],
notes => "Many browsers support the `[crypto.getRandomValues()](#feat=getrandomvalues)` method, but not actual cryptography functionality under `crypto.subtle`.",
notes_by_num => {
1 => "Support in IE11 is based on an older version of the specification.",
2 => "Support in Safari before version 11 was using the `crypto.webkitSubtle` prefix.",
3 => "In Edge 12-18, Web Crypto was not supported in Web Workers and Service Workers.",
},
spec => "https://www.w3.org/TR/WebCryptoAPI/",
stats => {
and_chr => { "2.1" => "p", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p" },
chrome => { 4 => "p", 37 => "y" },
edge => { "5.5" => "n", "6" => "p", "11" => "a x #1", "12" => "y #3", "79" => "y" },
firefox => { 2 => "p", 32 => "n d", 34 => "y" },
ie_mob => { 10 => "p", 11 => "a x #1" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "p", "8" => "y x #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "p", 80 => "y" },
opera => { 9 => "p", 24 => "y" },
safari => { "3.1" => "p", "7.1" => "y x #2", "11" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "Web Cryptography",
ucprefix => 0,
},
"css-all" => {
categories => ["CSS"],
chrome_id => 6178222542684160,
description => "A shorthand property for resetting all CSS properties except for `direction` and `unicode-bidi`.",
keywords => "CSS,all,property,shorthand,reset",
links => [
{
title => "MDN Web Docs - CSS all",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/all",
},
{
title => "Resetting styles using `all: unset`",
url => "https://mcc.id.au/blog/2013/10/all-unset",
},
{
title => "WebKit bug 116966: [css3-cascade] Add support for `all` shorthand property",
url => "https://bugs.webkit.org/show_bug.cgi?id=116966",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-cascade-3/#all-shorthand",
stats => {
and_chr => { "2.1" => "n", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 37 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 27 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 24 => "y" },
safari => { "3.1" => "n", "9.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS all property",
ucprefix => 0,
},
"css-anchor-positioning" => {
categories => ["CSS"],
chrome_id => 5124922471874560,
description => "Allows placing elements anywhere on the page relative to an \"anchor element\", without regard to the layout of other elements besides their containing block",
keywords => "anchor,position,anchor-element,anchor-name,anchor-default,anchor-scroll,position-fallback,position-fallback-bounds",
links => [
{
title => "Blog post on usage",
url => "https://developer.chrome.com/blog/tether-elements-to-each-other-with-css-anchor-positioning/",
},
{
title => "Polyfill",
url => "https://github.com/oddbird/css-anchor-positioning",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1838746",
},
{
title => "Blog post",
url => "https://12daysofweb.dev/2023/anchor-positioning/",
},
{
title => "WebKit position on Anchor Positioning",
url => "https://github.com/WebKit/standards-positions/issues/167",
},
],
notes_by_num => {
1 => "Can be enabled via the `#enable-experimental-web-platform-features` flag in `chrome://flags`",
},
spec => "https://www.w3.org/TR/css-anchor-position-1/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 117 => "n d #1", 125 => "y" },
edge => { "5.5" => "n", "117" => "n d #1", "125" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 103 => "n d #1", 111 => "y" },
safari => { "3.1" => "n", "TP" => "y" },
samsung => { 4 => "n", 27 => "y" },
},
status => "wd",
title => "CSS Anchor Positioning",
ucprefix => 0,
},
"css-animation" => {
categories => ["CSS3"],
description => "Complex method of animating certain properties of an element",
keywords => "animations,css-animations,animation-name,animation-duration,animation-delay,animation-timing-function,animation-iteration-count,\@keyframes,animationstart,animationend,animationiteration,css3 animation,steps,step-start,step-end,cubic-bezier",
links => [
{
title => "Blog post on usage",
url => "https://robertnyman.com/2010/05/06/css3-animations/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/animations",
},
{
title => "MDN - animation",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/animation",
},
],
notes_by_num => {
1 => "Partial support in Android browser refers to buggy behavior in different scenarios.",
2 => "Does not support the `steps()`, `step-start` & `step-end` timing functions",
},
spec => "https://www.w3.org/TR/css3-animations/",
stats => {
and_chr => { "2.1" => "a x #1", "4" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "y x", 43 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 5 => "y x", 16 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a x #1", "6.0-6.1" => "y x", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "9" => "n", "12" => "y x", "12.1" => "y", "15" => "y x", "30" => "y" },
safari => { "3.1" => "n", "4" => "a x #2", "5.1" => "y x", "9" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS Animation",
ucprefix => 0,
},
"css-any-link" => {
categories => ["CSS"],
chrome_id => 5724922840088576,
description => "The `:any-link` CSS pseudo-class matches all elements that match `:link` or `:visited`",
keywords => "any-link,css4,selector,visited",
links => [
{
title => "MDN Web Docs - CSS :any-link",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:any-link",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/selectors-4/#the-any-link-pseudo",
stats => {
and_chr => { "2.1" => "u", "4.4" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "u", 15 => "y x", 65 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "u", 3 => "y x", 50 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "6.0-6.1" => "y x", "9.0-9.2" => "y" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 52 => "y" },
safari => { "3.1" => "u", "6.1" => "y x", "9" => "y" },
samsung => { "4" => "u", "5.0-5.4" => "y x", "9.2" => "y" },
},
status => "wd",
title => "CSS :any-link selector",
ucprefix => 0,
},
"css-appearance" => {
categories => ["CSS"],
description => "The `appearance` property defines how elements (particularly form controls) appear by default. By setting the value to `none` the default appearance can be entirely redefined using other CSS properties.",
links => [
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/properties/a/appearance/",
},
{
title => "Safari implementation bug for unprefixed `appearance`",
url => "https://bugs.webkit.org/show_bug.cgi?id=143842",
},
],
notes => "WebKit, Blink, and Gecko browsers also support additional vendor specific values.",
notes_by_num => {
1 => "The appearance property is supported with the `none` value, but not `auto`.",
2 => "Microsoft Edge and IE Mobile support this property with the `-webkit-` prefix, rather than `-ms-` for interop reasons.",
3 => "`-moz-appearance:none` did not remove the dropdown arrow in the select tag",
},
spec => "https://www.w3.org/TR/css-ui-4/#appearance-switching",
stats => {
and_chr => { "2.1" => "a x #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a x #1" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x #1" },
chrome => { 4 => "a x #1", 83 => "y x", 84 => "y" },
edge => { "5.5" => "n", "12" => "a #1 #2", "79" => "a x #1", "83" => "y x", "84" => "y" },
firefox => { 2 => "a x #1 #3", 35 => "a x #1", 80 => "y" },
ie_mob => { 10 => "n", 11 => "a #1 #2" },
ios_saf => { "3.2" => "a x #1", "15.4" => "y" },
kaios => { "2.5" => "a x #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x #1", 70 => "y x", 73 => "y" },
safari => { "3.1" => "a x #1", "15.4" => "y" },
samsung => { "4" => "a x #1", "14.0" => "y" },
},
status => "wd",
title => "CSS Appearance",
ucprefix => 0,
},
"css-at-counter-style" => {
categories => ["CSS3"],
chrome_id => 5692693659254784,
description => "The \@counter-style CSS at-rule allows custom counter styles to be defined. A \@counter-style rule defines how to convert a counter value into a string representation.",
keywords => "css \@counter-style, list-style",
links => [
{
title => "MDN Web Docs - CSS counter style",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@counter-style",
},
{
title => "CSS \@counter-style Demo",
url => "https://mdn.github.io/css-examples/counter-style-demo/",
},
{
title => "WebKit bug on support for \@counter-style",
url => "https://bugs.webkit.org/show_bug.cgi?id=167645",
},
],
notes_by_num => {
1 => "Partial support refers to lacking support for image symbols: [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1024179), [Chrome bug](https://bugs.chromium.org/p/chromium/issues/detail?id=1176323)",
},
spec => "https://w3c.github.io/csswg-drafts/css-counter-styles/",
stats => {
and_chr => { "2.1" => "n", "135" => "a #1" },
and_ff => { 137 => "a #1" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 91 => "a #1" },
edge => { "5.5" => "n", "91" => "a #1" },
firefox => { 2 => "n", 33 => "a #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.0" => "a" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 77 => "a #1" },
safari => { "3.1" => "n", "17.0" => "a" },
samsung => { "4" => "n", "16.0" => "a #1" },
},
status => "cr",
title => "CSS Counter Styles",
ucprefix => 0,
},
"css-backdrop-filter" => {
categories => ["CSS", "CSS3"],
chrome_id => 5679432723333120,
description => "Method of applying filter effects (like blur, grayscale or hue) to content/elements below the target element.",
keywords => "blue,hue-rotate,invert,saturate,filter",
links => [
{
title => "Blog post",
url => "https://product.voxmedia.com/til/2015/2/17/8053347/css-ios-transparency-with-webkit-backdrop-filter",
},
{
title => "MDN Web Docs - CSS backdrop filter",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter",
},
{
title => "WebKit bug to unprefix `-webkit-backdrop-filter`",
url => "https://bugs.webkit.org/show_bug.cgi?id=224899",
},
],
notes_by_num => {
1 => "Can be enabled via the \"Experimental Web Platform Features\" flag",
2 => "Currently only supported with the `-webkit-` prefix (not -ms-)",
3 => "Can be enabled by setting the `layout.css.backdrop-filter.enabled` and `gfx.webrender.all` preference to `true` in about:config.",
},
spec => "https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProperty",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 47 => "n d #1", 76 => "y" },
edge => { "5.5" => "n", "17" => "y #2", "79" => "y" },
firefox => { 2 => "n", 70 => "n d #3", 103 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "18.0" => "y", "3.2" => "n", "9.0-9.2" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 34 => "n d #1", 64 => "y" },
safari => { "3.1" => "n", "9" => "y x", "18.0" => "y" },
samsung => { "12.0" => "y", "4" => "n", "5.0-5.4" => "n d #1" },
},
status => "unoff",
title => "CSS Backdrop Filter",
ucprefix => 0,
},
"css-background-offsets" => {
categories => ["CSS3"],
description => "Allows CSS background images to be positioned relative to the specified edge using the 3 to 4 value syntax. For example: `background-position: right 5px bottom 5px;` for positioning 5px from the bottom-right corner.",
keywords => "4 value syntax",
links => [
{
title => "MDN Web Docs - background-position",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/background-position",
},
{
title => "Basic information",
url => "https://briantree.se/quick-tip-06-use-four-value-syntax-properly-position-background-images/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-background/#background-position",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 25 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 13 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS background-position edge offsets",
ucprefix => 0,
},
"css-backgroundblendmode" => {
categories => ["CSS"],
chrome_id => 5768037999312896,
description => "Allows blending between CSS background images, gradients, and colors.",
keywords => "css blend modes,css blending modes,blending,multiply,screen,background",
links => [
{
title => "codepen example",
url => "https://codepen.io/bennettfeely/pen/rxoAc",
},
{
title => "Blog post",
url => "https://medium.com/web-design-technique/6b51bf53743a",
},
{ title => "Demo", url => "https://bennettfeely.com/gradients/" },
{
title => "MDN Web Docs - background-blend-mode",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/background-blend-mode",
},
],
notes_by_num => {
1 => "Partial in Safari refers to not supporting the `hue`, `saturation`, `color`, and `luminosity` blend modes.",
2 => "Chrome 46 has some [serious bugs](https://code.google.com/p/chromium/issues/detail?id=543583) with multiply, difference, and exclusion blend modes",
},
spec => "https://www.w3.org/TR/compositing-1/#propdef-background-blend-mode",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 35 => "y", 46 => "a #2", 47 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 30 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "a #1", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 22 => "y", 33 => "a #2", 34 => "y" },
safari => { "3.1" => "n", "7.1" => "a #1", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS background-blend-mode",
ucprefix => 0,
},
"css-boxdecorationbreak" => {
categories => ["CSS3"],
chrome_id => 5162398704205824,
description => "Controls whether the box's margins, borders, padding, and other decorations wrap the broken edges of the box fragments (when the box is split by a break (page/column/region/line).",
keywords => "box-decoration,box decoration,break",
links => [
{
title => "MDN Web Docs - CSS box-decoration-break",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/box-decoration-break",
},
{
title => "Demo of effect on box border",
url => "https://jsbin.com/xojoro/edit?css,output",
},
{
title => "Chromium bug to unprefix `-webkit-box-decoration-break`",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=682224",
},
{
title => "WebKit position request to support box-decoration-break everywhere without prefix",
url => "https://github.com/WebKit/standards-positions/issues/366",
},
],
notes_by_num => {
1 => "Partial support refers to working for inline elements but not across column or page breaks.",
},
spec => "https://www.w3.org/TR/css3-break/#break-decoration",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a x #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a x #1" },
and_uc => { "15.5" => "a x #1" },
baidu => { "13.52" => "a x #1" },
bb => { 7 => "n", 10 => "a x #1" },
chrome => { 4 => "n", 22 => "a x #1", 130 => "y" },
edge => { "5.5" => "n", "79" => "a x #1", "130" => "y" },
firefox => { 2 => "n", 32 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "a x #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { 10 => "n", 11 => "y #1", 80 => "a x #1" },
opera => { 9 => "n", 11 => "y #1", 15 => "a x #1", 116 => "y" },
safari => { "3.1" => "n", "6.1" => "a x #1" },
samsung => { 4 => "a x #1" },
},
status => "cr",
title => "CSS box-decoration-break",
ucprefix => 0,
},
"css-boxshadow" => {
categories => ["CSS3"],
description => "Method of displaying an inner or outer shadow effect to elements",
keywords => "box-shadows,boxshadows,box shadow,shaow",
links => [
{
title => "MDN Web Docs - box-shadow",
url => "https://developer.mozilla.org/En/CSS/-moz-box-shadow",
},
{
title => "Live editor",
url => "https://westciv.com/tools/boxshadows/index.html",
},
{
title => "Demo of various effects",
url => "http://tests.themasta.com/blogstuff/boxshadowdemo.html",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/box-shadow",
},
],
notes => "Can be partially emulated in older IE versions using the non-standard \"shadow\" filter.",
notes_by_num => {
1 => "Partial support in Safari, iOS Safari and Android Browser refers to missing \"inset\", blur radius value, and multiple shadow support.",
},
spec => "https://www.w3.org/TR/css3-background/#box-shadow",
stats => {
and_chr => { "2.1" => "a x #1", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x", 10 => "y" },
chrome => { 4 => "y x", 10 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.5" => "y x", "4" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a x #1", "4.0-4.1" => "y x", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "a x #1", "5" => "y x", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 Box-shadow",
ucprefix => 0,
},
"css-canvas" => {
categories => ["CSS"],
chrome_id => 5722125839106048,
description => "Method of using HTML5 Canvas as a background image. Not currently part of any specification.",
links => [
{
title => "WebKit blog post",
url => "https://webkit.org/blog/176/css-canvas-drawing/",
},
],
notes => "A similar effect can be achieved in Firefox 4+ using the -moz-element() background property",
notes_by_num => {},
spec => "https://webkit.org/blog/176/css-canvas-drawing/",
stats => {
and_chr => { "2.1" => "y x", "135" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "y x" },
chrome => { 4 => "y x", 48 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 15 => "y x", 35 => "n" },
safari => { "3.1" => "n", "4" => "y x" },
samsung => { "4" => "y x", "5.0-5.4" => "n" },
},
status => "unoff",
title => "CSS Canvas Drawings",
ucprefix => 0,
},
"css-caret-color" => {
categories => ["CSS"],
chrome_id => 5720917787279360,
description => "The `caret-color` property allows the color to be set of the caret (blinking text insertion pointer) in an editable text area.",
links => [
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=166572",
},
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/caret-color",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-ui-3/#caret-color",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 57 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 53 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 44 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "rec",
title => "CSS caret-color",
ucprefix => 0,
},
"css-cascade-layers" => {
categories => ["CSS"],
chrome_id => 5663362835808256,
description => "The `\@layer` at-rule allows authors to explicitly layer their styles in the cascade, before specificity and order of appearance are considered.",
links => [
{
title => "The Future of CSS: Cascade Layers (CSS \@layer)",
url => "https://www.bram.us/2021/09/15/the-future-of-css-cascade-layers-css-at-layer/",
},
{ title => "Chromium support bug", url => "https://crbug.com/1095765" },
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1699215",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=220779",
},
{
title => "Collection of demos",
url => "https://codepen.io/collection/BNjmma",
},
],
notes_by_num => {
1 => "Can be enabled with the \"layout.css.cascade-layers.enabled\" feature flag under `about:config`",
2 => "Can be enabled in Chrome Canary using the `--enable-blink-features=CSSCascadeLayers` runtime flag",
},
spec => "https://www.w3.org/TR/css-cascade-5/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 96 => "n d #2", 99 => "y" },
edge => { "5.5" => "n", "96" => "n d #2", "99" => "y" },
firefox => { 2 => "n", 94 => "n d #1", 97 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 86 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { "4" => "n", "18.0" => "y" },
},
status => "cr",
title => "CSS Cascade Layers",
ucprefix => 0,
},
"css-cascade-scope" => {
categories => ["CSS"],
chrome_id => 5100672734199808,
description => "Allows CSS rules to be scoped to part of the document, with upper and lower limits described by selectors.",
keywords => "scope,stylescoped",
links => [
{
title => "Explainer",
url => "https://css.oddbird.net/scope/explainer/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1830512",
},
{
title => "WebKit position: support",
url => "https://github.com/WebKit/standards-positions/issues/13",
},
{
title => "An introduction to \@scope in CSS",
url => "https://fullystacked.net/posts/scope-in-css/",
},
],
notes => "This implementation replaces an older concept of [scoping CSS rules](https://caniuse.com/style-scoped).",
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
},
spec => "https://drafts.csswg.org/css-cascade-6/#scoped-styles",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 104 => "n d #1", 118 => "y" },
edge => { "5.5" => "n", "104" => "n d #1", "118" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 90 => "n d #1", 106 => "y" },
safari => { "3.1" => "n", "17.4" => "y" },
samsung => { 4 => "n", 25 => "y" },
},
status => "wd",
title => "Scoped Styles: the \@scope rule",
ucprefix => 0,
},
"css-case-insensitive" => {
categories => ["CSS"],
chrome_id => 5610936115134464,
description => "Including an `i` before the `]` in a CSS attribute selector causes the attribute value to be matched in an ASCII-case-insensitive manner. For example, `[b=\"xyz\" i]` would match both `<a b=\"xyz\">` and `<a b=\"XYZ\">`.",
keywords => "i,attribute,case,insensitive,sensitive,sensitivity,insensitivity",
links => [
{
title => "MDN Web Docs - CSS case-insensitive",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors#case-insensitive",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/zutuna/edit?html,css,output",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/selectors-4/#attribute-case",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 47 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "Case-insensitive CSS attribute selectors",
ucprefix => 0,
},
"css-clip-path" => {
categories => ["CSS3"],
description => "Method of defining the visible region of an HTML element using SVG or a shape definition.",
keywords => "clippath",
links => [
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/properties/c/clip/",
},
{
title => "Codepen Example Clipping an Image with a Polygon",
url => "https://codepen.io/dubrod/details/myNNyW/",
},
{
title => "Visual test cases",
url => "https://lab.iamvdo.me/css-svg-masks",
},
{
title => "Chromium bug for shapes in external SVGs",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=109212",
},
{
title => "WebKit bug for shapes in external SVGs",
url => "https://bugs.webkit.org/show_bug.cgi?id=104442",
},
],
notes => "Support refers to the `clip-path` CSS property on HTML elements specifically. Support for `clip-path` in SVG is supported in all browsers with [basic SVG](#feat=svg) support.",
notes_by_num => {
1 => "Partial support refers to only supporting the `url()` syntax.",
2 => "Partial support refers to supporting shapes and the `url(#foo)` syntax for inline SVG, but not shapes in external SVGs.",
3 => "Supports shapes behind the `layout.css.clip-path-shapes.enabled` flag",
4 => "Partial support can be enabled on MS Edge with the Enable CSS Clip-Path Flag",
5 => "While Edge doesn't seem to recognize any `<basic-shape>` function, it does allow you to use `polygon()` in HTML and SVG",
},
parent => "css-masks",
spec => "https://www.w3.org/TR/css-masking-1/#the-clip-path",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a x #2", "135" => "a #2" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #2" },
and_uc => { "15.5" => "a #2" },
baidu => { "13.52" => "a #2" },
bb => { 7 => "n" },
chrome => { 4 => "n", 24 => "a x #2", 55 => "a #2" },
edge => { "5.5" => "n", "18" => "n d #4 #5", "79" => "a #2" },
firefox => { "2" => "n", "3.5" => "a #1", "47" => "a #1 #3", "54" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "a #2", "3.2" => "n", "7.0-7.1" => "a x #2" },
kaios => { "2.5" => "a #1 #3", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #2" },
opera => { 9 => "n", 15 => "a x #2", 42 => "a #2" },
safari => { "3.1" => "n", "7" => "a x #2", "13.1" => "a #2" },
samsung => { "4" => "a x #2", "6.2-6.4" => "a #2" },
},
status => "cr",
title => "CSS clip-path property (for HTML)",
ucprefix => 0,
},
"css-color-adjust" => {
categories => ["CSS"],
description => "The `print-color-adjust` (or `-webkit-print-color-adjust` as prefixed in WebKit/Blink browsers) property is a CSS extension that can be used to force printing of background colors and images.",
keywords => "color-adjust,print-color-adjust,color adjust,print color adjust,coloradjust,printcoloradjust",
links => [
{
title => "MDN web docs - print-color-adjust",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/print-color-adjust",
},
{
title => "Edge issue with print-color-adjust",
url => "https://web.archive.org/web/20190624214232/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/12399195/",
},
{
title => "Chromium bug with print-color-adjust property",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=131054",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-color-adjust-1/#propdef-print-color-adjust",
stats => {
and_chr => { "2.1" => "u", "135" => "y x" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y x" },
and_uc => { "15.5" => "u" },
baidu => { "13.52" => "u" },
bb => { 7 => "u" },
chrome => { 4 => "u", 19 => "y x" },
edge => { "5.5" => "n", "79" => "y x" },
firefox => { 2 => "n", 48 => "y" },
ie_mob => { 10 => "u" },
ios_saf => { "3.2" => "u", "15.4" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y x" },
opera => { 9 => "n", 15 => "y x" },
safari => { "3.1" => "n", "6" => "y x", "15.4" => "y" },
samsung => { 4 => "u" },
},
status => "cr",
title => "CSS print-color-adjust",
ucprefix => 0,
},
"css-color-function" => {
categories => ["CSS"],
description => "The CSS `color()` function allows the browser to display colors in any color space, such as the P3 color space which can display colors outside of the default sRGB color space.",
keywords => "color(),Display-P3,A98-RGB,ProPhoto-RGB,REC-2020,Device-Dependent Colors,Profiled Colors,\@color-profile,color space",
links => [
{
title => "Chromium implementation bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1068610",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1128204",
},
{
title => "WebKit article on using color() with the P3 color space",
url => "https://webkit.org/blog/10042/wide-gamut-color-in-css-with-display-p3/",
},
{
title => "Color generator that uses color() with the P3 color space",
url => "https://p3colorpicker.cool/",
},
],
notes => "For this function to work properly, the device screen and OS also needs to support the color space being used.",
notes_by_num => {
1 => "Only supports `display-p3` predefined color profile.",
2 => "Available behind the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag",
3 => "Can be enabled by setting about:config flag `layout.css.more_color_4.enabled` to true",
},
spec => "https://w3c.github.io/csswg-drafts/css-color/#color-function",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 108 => "n d #2", 111 => "y" },
edge => { "5.5" => "n", "108" => "n d #2", "111" => "y" },
firefox => { 2 => "n", 111 => "n d #3", 113 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "a #1", "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 95 => "n d #2", 98 => "y" },
safari => { "3.1" => "n", "10.1" => "a #1", "15" => "y" },
samsung => { 4 => "n", 22 => "y" },
},
status => "cr",
title => "CSS color() function",
ucprefix => 0,
},
"css-conic-gradients" => {
categories => ["CSS"],
chrome_id => 5706155347148800,
description => "Method of defining a conical or repeating conical color gradient as a CSS image.",
keywords => "conical-gradient,repeating-conical-gradient,gradient,conical",
links => [
{
title => "Client-side polyfill",
url => "https://leaverou.github.io/conic-gradient/",
},
{
title => "Server-side polyfill (PostCSS)",
url => "https://github.com/jonathantneal/postcss-conic-gradient",
},
{
title => "Mozilla bug #1175958: Implement conic gradients from CSS Image Values Level 4",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1175958",
},
{
title => "MDN Web Docs - conic-gradient()",
url => "https://developer.mozilla.org/docs/Web/CSS/conic-gradient",
},
],
notes_by_num => {
1 => "Can be enabled via the \"Experimental Web Platform Features\" flag",
2 => "Does not support multi-position color stops",
3 => "Can be enabled with the `layout.css.conic-gradient.enabled` flag",
},
parent => "css-gradients",
spec => "https://www.w3.org/TR/css-images-4/#conic-gradients",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 59 => "n d #1 #2", 69 => "y #2", 71 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 75 => "n d #3", 83 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.2-12.5" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 46 => "n d #1 #2", 56 => "y #2", 58 => "y" },
safari => { "3.1" => "n", "12.1" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "wd",
title => "CSS Conical Gradients",
ucprefix => 0,
},
"css-container-queries" => {
categories => ["CSS"],
chrome_id => 6525308435955712,
description => "Size queries in Container Queries provide a way to query the size of a container, and conditionally apply CSS to the content of that container.",
keywords => "container query,\@container,container-name,container-type",
links => [
{
title => "Container Queries: a Quick Start Guide",
url => "https://www.oddbird.net/2021/04/05/containerqueries/",
},
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries",
},
{ title => "Chromium support bug", url => "https://crbug.com/1145970" },
{
title => "Collection of demos",
url => "https://codepen.io/collection/XQrgJo",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=229659",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1744221",
},
{
title => "Container Query Polyfill",
url => "https://github.com/GoogleChromeLabs/container-query-polyfill",
},
],
notes_by_num => {
1 => "Can be enabled with the \"Enable CSS Container Queries\" feature flag under `chrome://flags`",
2 => "The initial Chrome prototype used an earlier draft syntax based on the `contain` property",
3 => "Combining size container queries and table layout inside a multicolumn layout doesn't work",
},
spec => "https://www.w3.org/TR/css-contain-3/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 92 => "n d #1 #2", 93 => "n d #1", 105 => "a #3", 106 => "y" },
edge => { "5.5" => "n", "105" => "a #3", "106" => "y" },
firefox => { 2 => "n", 110 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 79 => "n d #1", 91 => "a #3", 94 => "y" },
safari => { "3.1" => "n", "16.0" => "y" },
samsung => { 4 => "n", 20 => "y" },
},
status => "wd",
title => "CSS Container Queries (Size)",
ucprefix => 0,
},
"css-container-queries-style" => {
categories => ["CSS"],
chrome_id => 5076875399921664,
description => "Style queries in Container Queries provide a way to query the current styling of a container, and conditionally apply additional CSS to the contents of that container.",
keywords => "style query,style queries,style(),container query,container queries",
links => [
{
title => "Getting Started with Style Queries",
url => "https://developer.chrome.com/blog/style-queries/",
},
{ title => "Style Queries", url => "https://una.im/style-queries/" },
{
title => "Container Queries: Style Queries",
url => "https://www.bram.us/2022/10/14/container-queries-style-queries/",
},
{
title => "CSS Style Queries",
url => "https://ishadeed.com/article/css-container-style-queries/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1795622",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=246605",
},
],
notes_by_num => {
1 => "Enabled through the \"Experimental Web Platform features\" flag in `chrome://flags`",
2 => "Partial support refers to only working with CSS custom property values in the `style()` query",
3 => "The root element cannot be a container",
},
spec => "https://www.w3.org/TR/css-contain-3/",
stats => {
and_chr => { "2.1" => "n", "135" => "a #2" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 107 => "n d #1", 111 => "a #2" },
edge => { "5.5" => "n", "107" => "n d #1", "111" => "a #2" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "18.0" => "a #2 #3", "18.1" => "a #2" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #2" },
opera => { 9 => "n", 93 => "n d #1", 98 => "a #2" },
safari => { "3.1" => "n", "18.0" => "a #2 #3", "18.1" => "a #2" },
samsung => { 4 => "n", 22 => "a #2" },
},
status => "wd",
title => "CSS Container Style Queries",
ucprefix => 0,
},
"css-container-query-units" => {
categories => ["CSS"],
chrome_id => 6525308435955712,
description => "Container Query Units specify a length relative to the dimensions of a query container. The units include: `cqw`, `cqh`, `cqi`, `cqb`, `cqmin`, and `cqmax`.",
keywords => "container query",
links => [
{
title => "Blog post: CSS Container Query Units",
url => "https://ishadeed.com/article/container-query-units/",
},
{
title => "CSS Tricks: Container Units Should Be Pretty Handy",
url => "https://css-tricks.com/container-units-should-be-pretty-handy/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1744231",
},
],
notes_by_num => {
1 => "Can be enabled with the \"Enable CSS Container Queries\" feature flag under `chrome://flags`",
2 => "The initial Chrome implementation used an earlier spec draft syntax: `q*` units",
},
spec => "https://www.w3.org/TR/css-contain-3/#container-lengths",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 93 => "n d #1 #2", 101 => "n d #1", 105 => "y" },
edge => { "5.5" => "n", "105" => "y" },
firefox => { 2 => "n", 110 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 79 => "n d #1", 91 => "y" },
safari => { "3.1" => "n", "16.0" => "y" },
samsung => { 4 => "n", 20 => "y" },
},
status => "wd",
title => "CSS Container Query Units",
ucprefix => 0,
},
"css-containment" => {
categories => ["CSS"],
chrome_id => 6522186978295808,
description => "The CSS `contain` property lets developers limit the scope of the browser's styles, layout and paint work for faster and more efficient rendering.",
links => [
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2016/06/css-containment",
},
],
notes_by_num => {
1 => "Can be enabled in older Gecko engines with the `layout.css.contain.enabled` flag in about:config",
},
spec => "https://www.w3.org/TR/css-contain-1/#contain-property",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "n d", 52 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 41 => "n d #1", 69 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "n d #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 38 => "n d", 40 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "rec",
title => "CSS Containment",
ucprefix => 0,
},
"css-content-visibility" => {
categories => ["CSS"],
chrome_id => 4613920211861504,
description => "Provides control over when elements are rendered, so rendering can be skipped for elements not yet in the user's viewport. ",
links => [
{
title => "content-visibility: the new CSS property that boosts your rendering performance",
url => "https://web.dev/content-visibility/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1660384",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=236238",
},
],
notes_by_num => {
1 => "Enabled in Firefox by setting the `about:config` preference `layout.css.content-visibility.enabled` to true",
},
spec => "https://www.w3.org/TR/css-contain-2/#content-visibility",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 85 => "y" },
edge => { "5.5" => "n", "85" => "y" },
firefox => { 2 => "n", 109 => "n d #1", 125 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "18.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 71 => "y" },
safari => { "3.1" => "n", "18.0" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "wd",
title => "CSS content-visibility",
ucprefix => 0,
},
"css-counters" => {
categories => ["CSS2"],
description => "Method of controlling number values in generated content, using the `counter-reset` and `counter-increment` properties.",
links => [
{
title => "Tutorial and information",
url => "https://onwebdev.blogspot.com/2012/02/css-counters-tutorial.html",
},
{
title => "MDN Web Docs - CSS Counters",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Counter_Styles/Using_CSS_counters",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/counter-reset",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/CSS21/generate.html#counters",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS Counters",
ucprefix => 0,
},
"css-crisp-edges" => {
categories => ["CSS", "CSS3"],
chrome_id => 5118058116939776,
description => "Scales images with an algorithm that preserves edges and contrast, without smoothing colors or introducing blur. This is intended for images such as pixel art. Official values that accomplish this for the `image-rendering` property are `crisp-edges` and `pixelated`.",
keywords => "image-rendering,crisp-edges",
links => [
{
title => "MDN Web Docs - CSS Image rendering",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering",
},
{
title => "HTML5Rocks article",
url => "https://developer.chrome.com/blog/pixelated/",
},
{
title => "Firefox bug #856337: Implement image-rendering: pixelated",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=856337",
},
{
title => "Chrome bug #317991: Implement image-rendering:crisp-edges",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=317991",
},
],
notes => "Note that prefixes apply to the value (e.g. `-moz-crisp-edges`), not the `image-rendering` property.",
notes_by_num => {
1 => "Supported using the non-standard value `-webkit-optimize-contrast`",
2 => "Internet Explorer accomplishes support using the non-standard declaration `-ms-interpolation-mode: nearest-neighbor`",
3 => "Supports the `crisp-edges` value, but not `pixelated`.",
4 => "Supports the `pixelated` value, but not `crisp-edges`.",
5 => "Only works on `<img>`, not CSS backgrounds or `<canvas>`.",
6 => "Only works on `<img>` and CSS backgrounds, _not_ `<canvas>`. ",
},
spec => "https://w3c.github.io/csswg-drafts/css-images-3/#valdef-image-rendering-crisp-edges",
stats => {
and_chr => { "2.1" => "n", "135" => "y #4" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y #4" },
and_uc => { "15.5" => "y #4" },
baidu => { "13.52" => "y #4" },
bb => { 7 => "n", 10 => "a x #1 #6" },
chrome => { 4 => "n", 41 => "y #4" },
edge => { "5.5" => "n", "7" => "a x #2 #5", "12" => "n", "79" => "y #4" },
firefox => { "2" => "n", "3.6" => "y x #3", "65" => "y #3", "93" => "y" },
ie_mob => { 10 => "a x #2 #5" },
ios_saf => {
"10.0-10.2" => "y",
"3.2" => "n",
"5.0-5.1" => "a x #1 #6",
"7.0-7.1" => "a x #3 #6",
},
kaios => { "2.5" => "y #6", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 12 => "y x #3", 80 => "y #4" },
opera => { "9" => "n", "11.6" => "y x #3", "15" => "n", "28" => "y #4" },
safari => { "3.1" => "n", "6" => "a x #1", "6.1" => "a x #3 #6", "10" => "y" },
samsung => { 4 => "y #4" },
},
status => "cr",
title => "Crisp edges/pixelated images",
ucprefix => 0,
},
"css-cross-fade" => {
categories => ["CSS"],
description => "Image function to create a \"crossfade\" between images. This allows one image to transition (fade) into another based on a percentage value.",
keywords => "css,image,crossfade",
links => [
{
title => "Firefox bug #546052: Implement cross-fade()",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=546052",
},
{
title => "MDN Web Docs - CSS cross-fade()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/cross-fade()",
},
{
title => "Chromium bug to unprefix `-webkit-cross-fade()`",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=614906",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-images-4/#cross-fade-function",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y x" },
and_uc => { "15.5" => "y x" },
baidu => { "13.52" => "y x" },
bb => { 7 => "n" },
chrome => { 4 => "n", 17 => "y x" },
edge => { "5.5" => "n", "79" => "y x" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n", "5.0-5.1" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y x" },
opera => { 9 => "n", 15 => "y x" },
safari => { "3.1" => "n", "5.1" => "y x", "10" => "y" },
samsung => { 4 => "y x" },
},
status => "cr",
title => "CSS Cross-Fade Function",
ucprefix => 0,
},
"css-default-pseudo" => {
categories => ["CSS"],
description => "The `:default` pseudo-class matches checkboxes and radio buttons which are checked by default, `<option>`s with the `selected` attribute, and the default submit button (if any) of a form.",
keywords => ":default,default",
links => [
{
title => "HTML specification for `:default`",
url => "https://html.spec.whatwg.org/multipage/scripting.html#selector-default",
},
{
title => "MDN Web Docs - CSS :default",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:default",
},
{
title => "WebKit bug 156230 - `:default` CSS pseudo-class should match checkboxes+radios with a `checked` attribute",
url => "https://bugs.webkit.org/show_bug.cgi?id=156230",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/hiyada/edit?html,css,output",
},
],
notes => "Whether `<option selected>` matches `:default` (per the spec) was not tested since `<select>`s and `<option>`s are generally not styleable, which makes it hard to formulate a test for this.",
notes_by_num => {
1 => "Does not match `<input type=\"checkbox\" checked>` or `<input type=\"radio\" checked>`",
2 => "Does not match the default submit button of a form",
},
spec => "https://w3c.github.io/csswg-drafts/selectors-4/#the-default-pseudo",
stats => {
and_chr => { "2.1" => "u", "4" => "a #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "a #1" },
chrome => { 4 => "u", 15 => "a #1", 51 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "u", 4 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "y", "3.2" => "u", "7.0-7.1" => "a #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #2" },
op_mob => { "10" => "u", "12.1" => "a #2", "80" => "y" },
opera => { "9" => "u", "11.6" => "a #2", "15" => "a #1", "38" => "y" },
safari => { "3.1" => "u", "5.1" => "a #1", "10.1" => "y" },
samsung => { "4" => "a #1", "5.0-5.4" => "y" },
},
status => "wd",
title => ":default CSS pseudo-class",
ucprefix => 0,
},
"css-descendant-gtgt" => {
categories => ["CSS"],
description => "An explicit, non-whitespace spelling of the descendant combinator. `A >> B` is equivalent to `A B`.",
links => [
{
title => "MDN Web Docs - Descendant selectors",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_selectors",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/qipekof/edit?html,css,output",
},
{
title => "Chrome issue #446050: Implement Descendant Combinator \">>\"",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=446050",
},
{
title => "Mozilla bug #1266283 - Implement CSS4 descendant combinator `>>`",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1266283",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/selectors-4/#descendant-combinators",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "79" => "u", "80" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "11" => "y", "11.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Explicit descendant combinator >>",
ucprefix => 0,
},
"css-deviceadaptation" => {
categories => ["CSS"],
chrome_id => 4737164243894272,
description => "Method of overriding the size of viewport in web page using the `\@viewport` rule, replacing Apple's own popular `<meta>` viewport implementation. Includes the `extend-to-zoom` width value.",
keywords => "viewport,extend-to-zoom",
links => [
{
title => "Introduction to meta viewport and \@viewport in Opera Mobile",
url => "https://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/",
},
{
title => "Device adaptation in Internet Explorer 10",
url => "https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/dev-guides/hh708740(v=vs.85)",
},
{
title => "Chrome tracking bug",
url => "https://code.google.com/p/chromium/issues/detail?id=155477",
},
{
title => "WebKit tracking bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=95959",
},
{
title => "Mozilla tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=747754",
},
],
notes => "Due to lack of implementation this specification [is slated to be retired](https://github.com/w3c/csswg-drafts/issues/4766).",
notes_by_num => {
1 => "IE only supports the 'width' and 'height' properties.",
2 => "Opera Mobile and Opera Mini only support the 'orientation' property.",
},
spec => "https://www.w3.org/TR/css-device-adapt/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n d" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 29 => "n d" },
edge => { "5.5" => "n", "10" => "a x #1", "79" => "n d" },
firefox => { 2 => "n" },
ie_mob => { 10 => "a x #1" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "a x #2" },
op_mob => { 10 => "n", 11 => "a x #2", 80 => "n" },
opera => { 9 => "n", 40 => "n d" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS Device Adaptation",
ucprefix => 0,
},
"css-dir-pseudo" => {
categories => ["CSS"],
chrome_id => 5751531651465216,
description => "Matches elements based on their directionality. `:dir(ltr)` matches elements which are Left-to-Right. `:dir(rtl)` matches elements which are Right-to-Left.",
keywords => ":dir,dir,direction,ltr,rtl,left,right",
links => [
{
title => "HTML specification for `:dir()`",
url => "https://html.spec.whatwg.org/multipage/scripting.html#selector-ltr",
},
{
title => "MDN Web Docs - CSS :dir",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:dir",
},
{
title => "Chrome issue #576815: CSS4 pseudo-class :dir()",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=576815",
},
{
title => "WebKit bug #64861: Need support for :dir() pseudo-class",
url => "https://bugs.webkit.org/show_bug.cgi?id=64861",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/celuye/edit?html,css,output",
},
],
notes_by_num => {
1 => "Can be enabled via the `#enable-experimental-web-platform-features` flag",
},
spec => "https://www.w3.org/TR/selectors4/#the-dir-pseudo",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 91 => "n d #1", 120 => "y" },
edge => { "5.5" => "n", "105" => "n d #1", "120" => "y" },
firefox => { 2 => "n", 17 => "y x", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 91 => "n d #1", 106 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { 4 => "n", 25 => "y" },
},
status => "wd",
title => ":dir() CSS pseudo-class",
ucprefix => 0,
},
"css-display-contents" => {
categories => ["CSS"],
chrome_id => 5663606012116992,
description => "`display: contents` causes an element's children to appear as if they were direct children of the element's parent, ignoring the element itself. This can be useful when a wrapper element should be ignored when using CSS grid or similar layout techniques.",
links => [
{
title => "Vanishing boxes with display contents",
url => "https://rachelandrew.co.uk/archives/2016/01/29/vanishing-boxes-with-display-contents/",
},
],
notes_by_num => {
1 => "Partial support refers to [severe implementation bugs](https://hiddedevries.nl/en/blog/2018-04-21-more-accessible-markup-with-display-contents) that renders content inaccessible for many element types.",
2 => "Buttons are not accessible with `display: contents` applied. See issues for [Chromium](https://bugs.chromium.org/p/chromium/issues/detail?id=1366037), [Firefox](https://bugzilla.mozilla.org/show_bug.cgi?id=1791648), and [WebKit](https://bugs.webkit.org/show_bug.cgi?id=255149)",
3 => "HTML tables and nodes with ARIA roles `directory`, `grid`, `treegrid`, `table`, `row`, `gridcell`, `cell`, `columnheader`, `tree`, and `treeitem` are not accessible with `display: contents` applied. See WebKit bugs [239478](https://bugs.webkit.org/show_bug.cgi?id=239478), [239479](https://bugs.webkit.org/show_bug.cgi?id=239479), [239478](https://bugs.webkit.org/show_bug.cgi?id=239478), and [257458](https://bugs.webkit.org/show_bug.cgi?id=257458)",
},
spec => "https://w3c.github.io/csswg-drafts/css-display/",
stats => {
and_chr => { "2.1" => "n", "135" => "a #2" },
and_ff => { 137 => "a #2" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "a #1" },
baidu => { "13.52" => "a #2" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #1", 65 => "a #1", 89 => "a #2" },
edge => { "5.5" => "n", "79" => "a #1", "89" => "a #2" },
firefox => { 2 => "n", 37 => "a #1", 62 => "a #2" },
ie_mob => { 10 => "n" },
ios_saf => {
"11.3-11.4" => "a #1",
"13.4-13.7" => "a #2",
"16.0" => "a #2 #3",
"16.1" => "a #3",
"17.0" => "y",
"3.2" => "n",
},
kaios => { "2.5" => "a #1", "3.0-3.1" => "a #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #2" },
opera => { 9 => "n", 52 => "a #1", 76 => "a #2" },
safari => { "3.1" => "n", "11.1" => "a #1", "16.0" => "a #2 #3", "17.0" => "a #2" },
samsung => { "4" => "n", "9.2" => "a #1", "15.0" => "a #2" },
},
status => "cr",
title => "CSS display: contents",
ucprefix => 0,
},
"css-element-function" => {
categories => ["CSS3"],
description => "This function renders a live image generated from an arbitrary HTML element",
keywords => "element, function",
links => [
{
title => "MDN Web Docs - CSS element",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/element",
},
],
notes_by_num => {
1 => "In Firefox < 4, usage is limited to the background and background-image CSS properties",
},
spec => "https://www.w3.org/TR/css4-images/#element-notation",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y x" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "a x #1", 4 => "y x" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y x" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS element() function",
ucprefix => 0,
},
"css-env-function" => {
categories => ["CSS"],
chrome_id => 5710044637167616,
description => "Usage of environment variables like `safe-area-inset-top`.",
keywords => "css env(),css constant(),css variables,safe-area-inset-top,safe-area-inset-right,safe-area-inset-bottom,safe-area-inset-left",
links => [
{
title => "JSFiddle test case",
url => "https://jsfiddle.net/mrd3h90w/",
},
{
title => "The env() CSS Function - MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/env",
},
{
title => "Designing Websites for iPhone X - WebKit Blog",
url => "https://webkit.org/blog/7929/designing-websites-for-iphone-x/",
},
],
notes_by_num => { 1 => "Supported as `constant()` instead of `env()`" },
spec => "https://w3c.github.io/csswg-drafts/css-env-1/#env-function",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 69 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 65 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "a #1", "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 56 => "y" },
safari => { "3.1" => "n", "11" => "a #1", "11.1" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "unoff",
title => "CSS Environment Variables env()",
ucprefix => 0,
},
"css-exclusions" => {
categories => ["CSS"],
description => "Exclusions defines how inline content flows around elements. It extends the content wrapping ability of floats to any block-level element.",
keywords => "floats,exclusions,wrap-flow,wrap-through",
links => [
{
title => "CSS Exclusions",
url => "https://msdn.microsoft.com/en-us/library/ie/hh673558(v=vs.85).aspx",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=674804",
},
{
title => "WebKit tracking bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=57311",
},
{ title => "Chromium tracking bug", url => "https://crbug.com/700838" },
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-exclusions/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "10" => "y x", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "y x" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS Exclusions Level 1",
ucprefix => 0,
},
"css-featurequeries" => {
categories => ["CSS3"],
chrome_id => 4993981813358592,
description => "CSS Feature Queries allow authors to condition rules based on whether particular property declarations are supported in CSS using the \@supports at rule.",
keywords => "supports,conditional",
links => [
{
title => "MDN Web Docs - CSS \@supports",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@supports",
},
{
title => "\@supports in Firefox",
url => "https://mcc.id.au/blog/2012/08/supports",
},
{ title => "Test case", url => "https://dabblet.com/gist/3895764" },
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/atrules/supports",
},
],
notes => "See also the [CSS.supports() DOM API](css-supports-api)",
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-conditional/#at-supports",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 28 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 22 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "12.1" => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS Feature Queries",
ucprefix => 0,
},
"css-filter-function" => {
categories => ["CSS", "CSS3"],
chrome_id => 5425136400334848,
description => "This function filters a CSS input image with a set of filter functions (like blur, grayscale or hue)",
keywords => "filter, function",
links => [
{
title => "Blog post",
url => "https://iamvdo.me/en/blog/advanced-css-filters#filter",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1191043",
},
{ title => "Chromium support bug", url => "https://crbug.com/541698" },
],
notes_by_num => {},
spec => "https://www.w3.org/TR/filter-effects/#FilterCSSImageValue",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n", "9.0-9.2" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "9" => "y x", "9.1" => "y" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS filter() function",
ucprefix => 0,
},
"css-filters" => {
categories => ["CSS", "CSS3"],
chrome_id => 5822463824887808,
description => "Method of applying filter effects using the `filter` property to elements, matching filters available in SVG. Filter functions include blur, brightness, contrast, drop-shadow, grayscale, hue-rotate, invert, opacity, sepia and saturate.",
keywords => "filter:",
links => [
{ title => "Demo", url => "https://fhtr.org/css-filters/" },
{
title => "HTML5Rocks article",
url => "https://www.html5rocks.com/en/tutorials/filters/understanding-css/",
},
{
title => "Filter editor",
url => "https://web.archive.org/web/20160219005748/https://dl.dropboxusercontent.com/u/3260327/angular/CSS3ImageManipulation.html",
},
{
title => "Filter Playground",
url => "https://web.archive.org/web/20160310041612/http://bennettfeely.com/filters/",
},
],
notes => "Note that this property is significantly different from and incompatible with Microsoft's [older \"filter\" property](http://msdn.microsoft.com/en-us/library/ie/ms530752%28v=vs.85%29.aspx).",
notes_by_num => {
1 => "Supported in Firefox under the `layout.css.filters.enabled` flag.",
2 => "Supported in MS Edge under the \"Enable CSS filter property\" flag.",
3 => "Partial support in Firefox before version 34 [only implemented the url() function of the filter property](https://developer.mozilla.org/en-US/docs/Web/CSS/filter#Browser_compatibility)",
4 => "Partial support refers to supporting filter functions, but not the `url` function.",
},
spec => "https://www.w3.org/TR/filter-effects-1/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y x" },
chrome => { 4 => "n", 18 => "y x", 53 => "y" },
edge => { "5.5" => "n", "12" => "n d #2 #4", "13" => "a #4", "79" => "y" },
firefox => { "2" => "n", "3.6" => "a #3", "34" => "a d #1", "35" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y x", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 40 => "y" },
safari => { "3.1" => "n", "6" => "y x", "9.1" => "y" },
samsung => { "4" => "y x", "7.2-7.4" => "y" },
},
status => "wd",
title => "CSS Filter Effects",
ucprefix => 0,
},
"css-first-letter" => {
categories => ["CSS"],
description => "CSS pseudo-element that allows styling only the first \"letter\" of text within an element. Useful for implementing initial caps or drop caps styling.",
keywords => "first,letter,pseudo,element,class,selector",
links => [
{
title => "MDN Web Docs - :first-letter",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter",
},
],
notes => "The spec says that both letters of digraphs which are always capitalized together (such as \"IJ\" in Dutch) should be matched by ::first-letter, but no browser has ever implemented this.",
notes_by_num => {
1 => "Excludes punctuation immediately after the first letter from the match. (The spec says it should be included in the match.)",
2 => "Acts like the first character is always a letter even when it's not. For example, given \"!,X;\", \"!,\" is matched instead of the entire string.",
3 => "Only recognizes the deprecated :first-letter pseudo-class, not the ::first-letter pseudo-element.",
4 => "Only matches the very first character. The spec says that surrounding punctuation should also match.",
},
spec => "https://www.w3.org/TR/css3-selectors/#first-letter",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "a #1", 5 => "u", 9 => "y" },
edge => { "5.5" => "u", "6" => "a #3 #4", "8" => "a #3", "9" => "y" },
firefox => { "2" => "a #2", "3" => "a #1", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "a #2", 12 => "y" },
opera => { "10.0-10.1" => "a #2", "11.6" => "y", "9" => "u" },
safari => { "3.1" => "u", "3.2" => "a #1", "5" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "::first-letter CSS pseudo-element selector",
ucprefix => 0,
},
"css-first-line" => {
categories => ["CSS3"],
description => "Allows styling specifically for the first line of text using the `::first-line` pseudo-element. Note that only a limited set of properties can be applied.",
links => [
{
title => "MDN Web Docs - ::first-line",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/::first-line",
},
{
title => "CSS tricks article",
url => "https://css-tricks.com/almanac/selectors/f/first-line/",
},
],
notes_by_num => {
1 => "IE8 only supports the single-colon CSS 2.1 syntax (i.e. `:first-line`). It does not support the double-colon CSS3 syntax (i.e. `::first-line`).",
},
parent => "css-sel3",
spec => "https://w3c.github.io/csswg-drafts/selectors-3/#first-line",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "a #1", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS first-line pseudo-element",
ucprefix => 0,
},
"css-fixed" => {
categories => ["CSS"],
description => "Method of keeping an element in a fixed location regardless of scroll position",
links => [
{
title => "Article on mobile support",
url => "https://bradfrost.com/blog/post/fixed-position/",
},
{
title => "position: fixed on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/position#fixed",
},
],
notes_by_num => {
1 => "Partial support in older iOS Safari refers to [buggy behavior](http://remysharp.com/2012/05/24/issues-with-position-fixed-scrolling-on-ios/).",
2 => "Only works in Android 2.1 thru 2.3 by using the following meta tag: <meta name=\"viewport\" content=\"width=device-width, user-scalable=no\">.",
3 => "Android 4.0-4.3 [ignore transforms and margin:auto on position:fixed elements](https://codepen.io/mattiacci/pen/mPRKZY).",
4 => "in Safari 9.1, having a `position:fixed`-element inside an animated element, [may cause the `position:fixed`-element to not appear](https://jsbin.com/fuxipax).",
},
spec => "https://www.w3.org/TR/CSS21/visuren.html#fixed-positioning",
stats => {
and_chr => { "2.1" => "a #2", "3" => "y", "4" => "y #3", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "7" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "a #1", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y", "9.1" => "y #4", "10" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS position:fixed",
ucprefix => 0,
},
"css-focus-visible" => {
categories => ["CSS"],
chrome_id => 5823526732824576,
description => "The `:focus-visible` pseudo-class applies while an element matches the `:focus` pseudo-class, and the UA determines via heuristics that the focus should be specially indicated on the element (typically via a \x{201C}focus ring\x{201D}).",
keywords => "focus,ring,focusring,focus-ring,visible,focus-visible,pseudo",
links => [
{
title => "Prototype for `:focus-visible`",
url => "https://github.com/WICG/focus-visible",
},
{
title => "Chrome does not support CSS Selectors 4 :focus-visible",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=817199",
},
{
title => "Blink: Intent to implement :focus-visible pseudo class.",
url => "https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/-wN72ESFsyo",
},
{
title => "Mozilla Developer Network (MDN) documentation - :-moz-focusring",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-focusring",
},
{
title => "Bugzilla: Add :focus-visible (former :focus-ring)",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1437901",
},
{
title => "Bugzilla: implement :focus-visible pseudo-class (rename/alias :-moz-focusring)",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1445482",
},
{
title => "WebKit bug #185859: [selectors] Support for Focus-Indicated Pseudo-class: `:focus-visible`",
url => "https://bugs.webkit.org/show_bug.cgi?id=185859",
},
],
notes => "Previously drafted as `:focus-ring`",
notes_by_num => {
1 => "As `:-moz-focusring`",
2 => "Enabled through the \"Experimental Web Platform features\" flag in chrome://flags",
3 => "Can be enabled via \":focus-visible pseudo-class\" in the Experimental Features menu",
},
spec => "https://w3c.github.io/csswg-drafts/selectors-4/#the-focus-visible-pseudo",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 67 => "p d #2", 86 => "y" },
edge => { "5.5" => "n", "79" => "p d #2", "86" => "y" },
firefox => { 2 => "n", 4 => "y x #1", 85 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "n d #3", "15.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "y x #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 66 => "p d #2", 72 => "y" },
safari => { "3.1" => "n", "15" => "n d #3", "15.4" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "wd",
title => ":focus-visible CSS pseudo-class",
ucprefix => 0,
},
"css-focus-within" => {
categories => ["CSS"],
chrome_id => 5363834508279808,
description => "The `:focus-within` pseudo-class matches elements that either themselves match `:focus` or that have descendants which match `:focus`.",
keywords => "focus,within,focus-within,pseudo",
links => [
{
title => "The Future Generation of CSS Selectors: Level 4: Generalized Input Focus Pseudo-class",
url => "https://www.sitepoint.com/future-generation-css-selectors-level-4/#generalized-input-focus-pseudo-class-focus-within",
},
{
title => "ally.style.focusWithin Polyfill, part of ally.js",
url => "https://allyjs.io/api/style/focus-within.html",
},
{
title => "WebKit bug #140144: Add support for CSS4 `:focus-within` pseudo",
url => "https://bugs.webkit.org/show_bug.cgi?id=140144",
},
{
title => "Chromium issue #617371: Implement `:focus-within` pseudo-class from Selectors Level 4",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=617371",
},
{
title => "Mozilla bug #1176997: Add support for pseudo class `:focus-within`",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1176997",
},
{
title => "MDN Web Docs - :focus-within",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-within",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/qevoqa/edit?html,css,output",
},
],
notes_by_num => {
1 => "Can be enabled via the \"Experimental Web Platform Features\" flag",
},
spec => "https://w3c.github.io/csswg-drafts/selectors-4/#the-focus-within-pseudo",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 59 => "n d #1", 60 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 52 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 46 => "n d #1", 47 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "unoff",
title => ":focus-within CSS pseudo-class",
ucprefix => 0,
},
"css-font-palette" => {
categories => ["CSS"],
chrome_id => 5674031696052224,
description => "The font-palette CSS property allows selecting a palette from a color font. In combination with the `\@font-palette-values` at-rule, custom palettes can be defined.",
keywords => "font-palette,palette,color,colr,cpal,color-font,fontface,webfonts",
links => [
{
title => "Demo",
url => "https://yisibl.github.io/color-font-palette/",
},
{
title => "Explainer",
url => "https://github.com/drott/csswg-drafts/blob/paletteExplainer/css-fonts-4/palette-explainer.md",
},
{
title => "Safari 15.4 Beta Release Notes",
url => "https://webkit.org/blog/12445/new-webkit-features-in-safari-15-4/#typography",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1461588",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-fonts-4/#propdef-font-palette",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 101 => "y" },
edge => { "5.5" => "n", "105" => "y" },
firefox => { 2 => "n", 107 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 87 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { "4" => "n", "19.0" => "y" },
},
status => "wd",
title => "CSS font-palette",
ucprefix => 0,
},
"css-font-rendering-controls" => {
categories => ["CSS"],
chrome_id => 4799947908055040,
description => "`\@font-face` descriptor `font-display` that allows control over how a downloadable font renders before it is fully loaded.",
keywords => "swap,fallback,optional,block,font-display",
links => [
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2016/02/font-display",
},
{
title => "MDN Web Docs - font-display",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@font-face/font-display",
},
{
title => "CSS tricks article",
url => "https://css-tricks.com/font-display-masses/",
},
],
notes_by_num => {
1 => "Can be enabled via the `layout.css.font-display.enabled` flag",
},
spec => "https://www.w3.org/TR/css-fonts-4/#font-display-desc",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "n d", 60 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 46 => "n d #1", 58 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n d #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "n d", 47 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "n d", "8.2" => "y" },
},
status => "wd",
title => "CSS font-display",
ucprefix => 0,
},
"css-font-stretch" => {
categories => ["CSS"],
chrome_id => 4598830058176512,
description => "If a font has multiple types of variations based on the width of characters, the `font-stretch` property allows the appropriate one to be selected. The property in itself does not cause the browser to stretch to a font.",
keywords => "font stretch",
links => [
{
title => "MDN Web Docs - font-stretch",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-stretch",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/properties/f/font-stretch/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-fonts-3/#font-stretch-prop",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 48 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 9 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 35 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "rec",
title => "CSS font-stretch",
ucprefix => 0,
},
"css-gencontent" => {
categories => ["CSS2", "CSS3"],
description => "Method of displaying text or images before or after the given element's contents using the ::before and ::after pseudo-elements. All browsers with support also support the `attr()` notation in the `content` property. ",
keywords => "before,after",
links => [
{
title => "Guide on usage",
url => "https://www.westciv.com/style_master/academy/css_tutorial/advanced/generated_content.html",
},
{
title => "Dev.Opera article",
url => "https://dev.opera.com/articles/view/css-generated-content-techniques/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/generated_and_replaced_content",
},
],
notes => "For content to appear in pseudo-elements, the `content` property must be set (but may be an empty string).",
notes_by_num => {
1 => "IE8 only supports the single-colon CSS 2.1 syntax (i.e. :pseudo-class). It does not support the double-colon CSS3 syntax (i.e. ::pseudo-element).",
},
spec => "https://www.w3.org/TR/CSS21/generate.html",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "a #1", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS Generated content for pseudo-elements",
ucprefix => 0,
},
"css-gradients" => {
categories => ["CSS3"],
chrome_id => 5785905063264256,
description => "Method of defining a linear or radial color gradient as a CSS image.",
keywords => "linear,linear-gradient,gradiant",
links => [
{
title => "Cross-browser editor",
url => "https://www.colorzilla.com/gradient-editor/",
},
{
title => "Tool to emulate support in IE",
url => "http://css3pie.com/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/functions/linear-gradient",
},
],
notes => "Syntax used by browsers with prefixed support may be incompatible with that for proper support.\r\n\r\nSupport can be somewhat emulated in older IE versions using the non-standard \"gradient\" filter. \r\n\r\nFirefox 10+, Opera 11.6+, Chrome 26+ and IE10+ also support the new \"to (side)\" syntax.",
notes_by_num => {
1 => "Partial support in Opera 11.10 and 11.50 also refers to only having support for linear gradients.",
2 => "Partial support in Safari and Older Firefox versions refers to not using premultiplied colors which results in unexpected behavior when using the transparent keyword as advised by the [spec](https://www.w3.org/TR/2012/CR-css3-images-20120417/#color-stop-syntax).",
3 => "Implements an earlier prefixed syntax as `-webkit-gradient`",
},
spec => "https://www.w3.org/TR/css3-images/",
stats => {
and_chr => { "2.1" => "a x #3", "4" => "y x", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x #3", 10 => "y" },
chrome => { 4 => "a x #3", 10 => "y x", 26 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { "2" => "n", "3.6" => "a x #2", "16" => "a #2", "36" => "y" },
ie_mob => { 10 => "y" },
ios_saf => {
"15.4" => "y",
"3.2" => "a x #2 #3",
"5.0-5.1" => "a x #2",
"7.0-7.1" => "a #2",
},
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "a x #1", "12" => "y x", "12.1" => "y" },
opera => { "9" => "n", "11.1" => "a x #1", "11.6" => "y x", "12.1" => "y" },
safari => {
"3.1" => "n",
"4" => "a x #2 #3",
"5.1" => "a x #2",
"6.1" => "a #2",
"15.4" => "y",
},
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS Gradients",
ucprefix => 0,
},
"css-grid" => {
categories => ["CSS"],
chrome_id => 4589636412243968,
description => "Method of using a grid concept to lay out content, providing a mechanism for authors to divide available space for layout into columns and rows using a set of predictable sizing behaviors. Includes support for all `grid-*` properties and the `fr` unit.",
keywords => "grids,grid-row,grid-column,grid-template,display:grid,displaygrid,inline-grid,fr unit,fractional unit,cssgrid,justify-content:space-between,justify-content:space-around,align-content:space-between,align-content:space-around,space-between",
links => [
{
title => "Polyfill based on old spec",
url => "https://github.com/codler/Grid-Layout-Polyfill",
},
{
title => "Polyfill based on new spec",
url => "https://github.com/FremyCompany/css-grid-polyfill/",
},
{
title => "WebKit Blog post",
url => "https://webkit.org/blog/7434/css-grid-layout-a-new-layout-module-for-the-web/",
},
{
title => "Css Grid By Example: Everything you need to learn CSS Grid Layout",
url => "https://gridbyexample.com/",
},
{
title => "Mozilla: Introduction to CSS Grid Layout",
url => "https://mozilladevelopers.github.io/playground/css-grid",
},
],
notes => "See also support for [subgrids](#feat=css-subgrid)",
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Partial support in IE refers to supporting an [older version](https://www.w3.org/TR/2011/WD-css3-grid-layout-20110407/) of the specification.",
3 => "Enabled in Firefox through the `layout.css.grid.enabled ` flag",
4 => "There are some bugs with overflow ([1356820](https://bugzilla.mozilla.org/show_bug.cgi?id=1356820), [1348857](https://bugzilla.mozilla.org/show_bug.cgi?id=1348857), [1350925](https://bugzilla.mozilla.org/show_bug.cgi?id=1350925))",
},
spec => "https://www.w3.org/TR/css-grid-1/",
stats => {
and_chr => { "135" => "y", "2.1" => "n", "4.2-4.3" => "p" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 25 => "p", 29 => "p d #1", 57 => "y #4", 58 => "y" },
edge => { "5.5" => "n", "9" => "p", "10" => "a x #2", "16" => "y" },
firefox => { 2 => "n", 19 => "p", 40 => "p d #3", 52 => "y #4", 54 => "y" },
ie_mob => { 10 => "a x #2" },
ios_saf => { "10.3" => "y", "3.2" => "n", "6.0-6.1" => "p" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 28 => "p d #1", 44 => "y" },
safari => { "3.1" => "n", "6" => "p", "10.1" => "y" },
samsung => { "4" => "p", "5.0-5.4" => "n", "6.2-6.4" => "y" },
},
status => "cr",
title => "CSS Grid Layout (level 1)",
ucprefix => 0,
},
"css-hanging-punctuation" => {
categories => ["CSS"],
description => "Allows some punctuation characters from start (or the end) of text elements to be placed \"outside\" of the box in order to preserve the reading flow.",
keywords => "hanging punctuation,force-end,allow-end",
links => [
{
title => "CSS tricks article",
url => "https://css-tricks.com/almanac/properties/h/hanging-punctuation/",
},
{
title => "Firefox bug #1253615",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1253615",
},
{
title => "Chrome bug #41491716",
url => "https://issues.chromium.org/issues/41491716",
},
],
notes_by_num => {
1 => "Safari does not support the `force-end` keyword, though it does recognize it. ([see bug](https://bugs.webkit.org/show_bug.cgi?id=233761)).",
},
spec => "https://w3c.github.io/csswg-drafts/css-text-3/#hanging-punctuation-property",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "a #1", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "10" => "a #1" },
samsung => { 4 => "n" },
},
status => "cr",
title => "CSS hanging-punctuation",
ucprefix => 0,
},
"css-has" => {
categories => ["CSS"],
chrome_id => 5794378545102848,
description => "Select elements containing specific content. For example, `a:has(img)` selects all `<a>` elements that contain an `<img>` child.",
keywords => "children,parent,selector",
links => [
{
title => "MDN Web Docs - :has",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:has",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=418039",
},
{
title => "Chrome bug to track implementation",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=669058",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=227702",
},
{
title => "Using :has() as a CSS Parent Selector and much more",
url => "https://webkit.org/blog/13096/css-has-pseudo-class/",
},
],
notes_by_num => {
1 => "Can be enabled via the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag",
2 => "Supported in Firefox behind the `layout.css.has-selector.enabled` flag, which is enabled by default since 119 (only Nightly)",
},
spec => "https://w3c.github.io/csswg-drafts/selectors-4/#relational",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 101 => "n d #1", 105 => "y" },
edge => { "5.5" => "n", "105" => "y" },
firefox => { 2 => "n", 103 => "n d #2", 121 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 91 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { 4 => "n", 20 => "y" },
},
status => "wd",
title => ":has() CSS relational pseudo-class",
ucprefix => 0,
},
"css-hyphens" => {
categories => ["CSS3"],
description => "Method of controlling when words at the end of lines should be hyphenated using the \"hyphens\" property.",
keywords => "hyphen,shy",
links => [
{
title => "MDN Web Docs - CSS hyphens",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/hyphens",
},
{ title => "Blog post", url => "https://clagnut.com/blog/2394" },
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/hyphens",
},
{
title => "Chromium bug for implementing hyphenation",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=652964",
},
{
title => "WebKit bug to unprefix `-webkit-hyphens`",
url => "https://bugs.webkit.org/show_bug.cgi?id=193002",
},
],
notes => "Chrome < 55 and Android 4.0 Browser support \"-webkit-hyphens: none\", but not the \"auto\" property. It is [advisable to set the \@lang attribute](http://blog.adrianroselli.com/2015/01/on-use-of-lang-attribute.html) on the HTML element to enable hyphenation support and improve accessibility.",
notes_by_num => {
1 => "Only supported on Android & Mac platforms (and only the \"auto\" value) for now. [See commit](https://crrev.com/ed7e106e0e48b3afb160a5bdbb37649e307d2b05) & related [bug](https://bugs.chromium.org/p/chromium/issues/detail?id=652964).",
2 => "Only supported on Android & Mac platforms",
},
spec => "https://www.w3.org/TR/css3-text/#hyphenation",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 55 => "a #1", 88 => "y" },
edge => { "5.5" => "n", "10" => "y x", "79" => "a #1", "88" => "a #2", "105" => "y" },
firefox => { 2 => "n", 6 => "y x", 43 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "17.0" => "y", "3.2" => "n", "4.2-4.3" => "y x" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 42 => "a #1", 91 => "y" },
safari => { "3.1" => "n", "5.1" => "y x", "17.0" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a #1", "6.2-6.4" => "y" },
},
status => "cr",
title => "CSS Hyphenation",
ucprefix => 0,
},
"css-image-orientation" => {
categories => ["CSS3"],
chrome_id => 6313474512650240,
description => "CSS property used generally to fix the intended orientation of an image. This can be done using 90 degree increments or based on the image's EXIF data using the \"from-image\" value.",
keywords => "image-orientation,from-image,flip",
links => [
{
title => "MDN Web Docs - CSS image-orientation",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/image-orientation",
},
{
title => "Blog post",
url => "http://sethfowler.org/blog/2013/09/13/new-in-firefox-26-css-image-orientation/",
},
{ title => "Demo (Chinese)", url => "https://jsbin.com/EXUTolo/4" },
{
title => "Chromium bug #158753: Support for the CSS image-orientation CSS property",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=158753",
},
],
notes => "Opening the image in a new tab in Chrome results in the image shown in the orientation according to the EXIF data.",
notes_by_num => {
1 => "Partial support in iOS refers to the browser using EXIF data by default, though it does not actually support the property.",
2 => "Has [a bug](https://bugs.chromium.org/p/chromium/issues/detail?id=1082669) where the browser is not maintaining the image\x{2019}s aspect ratio when `object-fit: cover` and `image-orientation: from-image` are used together.",
},
spec => "https://www.w3.org/TR/css-images-3/#the-image-orientation",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 81 => "y #2", 89 => "y" },
edge => { "5.5" => "n", "81" => "y #2", "89" => "y" },
firefox => { 2 => "n", 26 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.4-13.7" => "y", "3.2" => "a #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 68 => "y #2", 77 => "y" },
safari => { "3.1" => "n", "13.1" => "y" },
samsung => { "4" => "n", "13.0" => "y #2", "15.0" => "y" },
},
status => "cr",
title => "CSS3 image-orientation",
ucprefix => 0,
},
"css-image-set" => {
categories => ["CSS"],
chrome_id => 5432024223449088,
description => "Method of letting the browser pick the most appropriate CSS image from a given set.",
links => [
{
title => "Web Platform Tests",
url => "https://wpt.fyi/results/css/css-images/image-set/image-set-parsing.html",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=image-set",
},
{
title => "Chromium bug to update and unprefix image-set()",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=630597",
},
{
title => "WebKit bug to support type()",
url => "https://bugs.webkit.org/show_bug.cgi?id=225185",
},
],
notes_by_num => {
1 => "Has very limited support. Only `url()` is accepted as the image and only `x` is accepted as a resolution.",
2 => "Does not support generated images in `content`. Example: `content: image-set(linear-gradient())`. [Bug 1696314](https://bugzilla.mozilla.org/show_bug.cgi?id=1696314).",
3 => "Does not support the `type()` function.",
4 => "Does not support omitting the resolution.",
5 => "Does not support using `calc()` for the resolution.",
},
spec => "https://w3c.github.io/csswg-drafts/css-images-4/#image-set-notation",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a x #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a x #1" },
and_uc => { "15.5" => "a x #1" },
baidu => { "13.52" => "a x #1" },
bb => { 7 => "n", 10 => "a x #1" },
chrome => { 4 => "n", 21 => "a x #1", 113 => "y #5", 114 => "y" },
edge => { "5.5" => "n", "79" => "a x #1", "113" => "y #5", "114" => "y" },
firefox => { 2 => "n", 86 => "n d", 88 => "a #2 #3 #5", 89 => "y #2 #5", 113 => "y" },
ie_mob => { 10 => "n" },
ios_saf => {
"10.0-10.2" => "a #1",
"14.0-14.4" => "a #3 #4",
"17.0" => "y",
"3.2" => "n",
"6.0-6.1" => "a x #1",
},
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x #1", 99 => "y #5", 100 => "y" },
safari => { "3.1" => "n", "6" => "a x #1", "10" => "a #1", "14" => "a #3 #4", "17.0" => "y" },
samsung => { 4 => "a x #1", 23 => "y" },
},
status => "wd",
title => "CSS image-set",
ucprefix => 0,
},
"css-in-out-of-range" => {
categories => ["CSS"],
description => "If a temporal or number `<input>` has `max` and/or `min` attributes, then `:in-range` matches when the value is within the specified range and `:out-of-range` matches when the value is outside the specified range. If there are no range constraints, then neither pseudo-class matches.",
keywords => "in,out,of,range,:in-range,:out-of-range",
links => [
{
title => "MDN Web Docs - CSS :out-of-range",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:out-of-range",
},
{
title => "WHATWG HTML specification for `:in-range` and `:out-of-range`",
url => "https://html.spec.whatwg.org/multipage/scripting.html#selector-in-range",
},
],
notes => "Note that `<input type=\"range\">` can never match `:out-of-range` because the user cannot input such a value, and if the initial value is outside the range, the browser immediately clamps it to the minimum or maximum (as appropriate) bound of the range.",
notes_by_num => {
1 => "Opera Mini correctly applies style on initial load, but does not correctly update when value is changed.",
2 => "`:in-range` also incorrectly matches temporal and `number` inputs which don't have `min` or `max` attributes. See [Edge bug](https://web.archive.org/web/20171213080515/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7200501/), [Chrome bug](https://bugs.chromium.org/p/chromium/issues/detail?id=603268), [WebKit bug](https://bugs.webkit.org/show_bug.cgi?id=156558).",
3 => "`:in-range` and `:out-of-range` incorrectly match inputs which are disabled or readonly. See [Edge bug](https://web.archive.org/web/20171213073431/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7190958/), [Mozilla bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1264157), [WebKit bug](https://bugs.webkit.org/show_bug.cgi?id=156530), [Chrome bug](https://bugs.chromium.org/p/chromium/issues/detail?id=602568).",
},
spec => "https://www.w3.org/TR/selectors4/#range-pseudos",
stats => {
and_chr => { "2.1" => "n", "4" => "a #2", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "a #2" },
chrome => { 4 => "n", 5 => "u", 15 => "a #2 #3", 52 => "a #2", 53 => "y" },
edge => { "5.5" => "n", "13" => "a #2", "79" => "y" },
firefox => { 2 => "n", 29 => "a #3", 50 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "y", "3.2" => "n", "5.0-5.1" => "a #2 #3" },
kaios => { "2.5" => "a #3", "3.0-3.1" => "y" },
op_mini => { all => "a #1" },
op_mob => { 10 => "a #2", 80 => "y" },
opera => {
"10.0-10.1" => "a #2",
"15" => "a #2 #3",
"39" => "a #2",
"40" => "y",
"9" => "u",
},
safari => { "3.1" => "n", "5" => "u", "5.1" => "a #2 #3", "10.1" => "y" },
samsung => { "4" => "a #2", "5.0-5.4" => "y" },
},
status => "wd",
title => ":in-range and :out-of-range CSS pseudo-classes",
ucprefix => 0,
},
"css-indeterminate-pseudo" => {
categories => ["CSS"],
description => "The `:indeterminate` pseudo-class matches indeterminate checkboxes, indeterminate `<progress>` bars, and radio buttons with no checked button in their radio button group.",
keywords => ":indeterminate,indeterminate",
links => [
{
title => "HTML specification for `:indeterminate`",
url => "https://html.spec.whatwg.org/multipage/scripting.html#selector-indeterminate",
},
{
title => "MDN Web Docs - CSS :indeterminate",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:indeterminate",
},
{
title => "EdgeHTML issue 7124038 - `:indeterminate` pseudo-class doesn't match radio buttons",
url => "https://web.archive.org/web/20190624214229/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7124038/",
},
{
title => "Mozilla Bug 885359 - Radio groups without a selected radio button should have `:indeterminate` applying",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=885359",
},
{
title => "WebKit Bug 156270 - `:indeterminate` pseudo-class should match radios whose group has no checked radio",
url => "https://bugs.webkit.org/show_bug.cgi?id=156270",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/zumoqu/edit?html,css,js,output",
},
],
notes_by_num => {
1 => "Doesn't match radio buttons whose radio button group lacks a checked radio button",
2 => "Doesn't support the `<progress>` element",
3 => "Doesn't match indeterminate `<progress>` bars",
},
spec => "https://www.w3.org/TR/selectors-4/#indeterminate",
stats => {
and_chr => {
"135" => "y",
"2.1" => "u",
"4" => "a #1 #2",
"4.4" => "a #1",
"4.4.3-4.4.4" => "u",
},
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "a #1" },
chrome => { 4 => "u", 15 => "a #1", 39 => "y" },
edge => { "5.5" => "n", "9" => "a #1 #2", "10" => "a #1", "79" => "y" },
firefox => { 2 => "u", 4 => "a #1 #2", 6 => "a #1", 51 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "10.3" => "y", "3.2" => "u", "7.0-7.1" => "a #1" },
kaios => { "2.5" => "a #1", "3.0-3.1" => "y" },
op_mini => { all => "a #3" },
op_mob => { "10" => "u", "12.1" => "a #3", "80" => "y" },
opera => { "9" => "u", "11.6" => "a #3", "15" => "a #1", "26" => "y" },
safari => { "3.1" => "u", "5.1" => "a #1 #2", "6" => "u", "6.1" => "a #1", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => ":indeterminate CSS pseudo-class",
ucprefix => 0,
},
"css-initial-letter" => {
categories => ["CSS"],
chrome_id => 5167442033115136,
description => "Method of creating an enlarged cap, including a drop or raised cap, in a robust way.",
keywords => "initial-letter,initial letter,letter,drop cap,dropcap,initial letters,letters",
links => [
{
title => "Firefox Implementation Ticket",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1273019",
},
{
title => "MDN Web Docs - CSS initial-letter",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/initial-letter",
},
{
title => "Blog post on Envato Tuts+, \"Better CSS Drop Caps With initial-letter\"",
url => "https://webdesign.tutsplus.com/tutorials/better-css-drop-caps-with-initial-letter--cms-26350",
},
{
title => "Demos at Jen Simmons Labs",
url => "https://labs.jensimmons.com/#initialletter",
},
{
title => "WebKit bug to unprefix -webkit-initial-letter",
url => "https://bugs.webkit.org/show_bug.cgi?id=229090",
},
],
notes_by_num => {
1 => "Safari implementation is incomplete. Does not allow applying web fonts to the initial letter.",
2 => "Partial support refers to only supporting the `initial-letter` property (not `initial-letter-align` or `initial-letter-wrap`)",
},
spec => "https://www.w3.org/TR/css-inline/#initial-letter-styling",
stats => {
and_chr => { "2.1" => "n", "135" => "a #2" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 110 => "a #2" },
edge => { "5.5" => "n", "110" => "a #2" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "a x #1 #2" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #2" },
opera => { 9 => "n", 98 => "a #2" },
safari => { "3.1" => "n", "9" => "a #2", "9.1" => "a x #1 #2" },
samsung => { 4 => "n", 21 => "a #2" },
},
status => "wd",
title => "CSS Initial Letter",
ucprefix => 0,
},
"css-initial-value" => {
categories => ["CSS"],
description => "A CSS value that will apply a property's initial value as defined in the CSS specification that defines the property",
keywords => "CSS,initial,value",
links => [
{
title => "MDN Web Docs - CSS initial",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/initial",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/getting-acquainted-with-initial/",
},
],
notes_by_num => { 1 => "Not supported on `quotes` property" },
spec => "https://www.w3.org/TR/css-values/#common-keywords",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { "2" => "a x #1", "3.5" => "y x", "19" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "u", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS initial value",
ucprefix => 0,
},
"css-lch-lab" => {
categories => ["CSS"],
chrome_id => 4592567062626304,
description => "The `lch()` and `lab()` color functions are based on the CIE LAB color space, representing colors in a way that closely matches human perception and provides access to a wider spectrum of colors than offered by the usual RGB color space.",
keywords => "lch,lab,lch(),lab(),cielab,L*a*b*",
links => [
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1026287",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1352757",
},
{
title => "LCH colors in CSS: what, why, and how?",
url => "https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/",
},
{ title => "LCH color picker", url => "https://css.land/lch/" },
{
title => "MDN article on lch()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/lch()",
},
{
title => "MDN article on lab()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/lab()",
},
],
notes_by_num => {
1 => "Can be enabled by setting about:config flag `layout.css.more_color_4.enabled` to true",
2 => "Can be enabled via the `#enable-experimental-web-platform-features` flag in `chrome://flags`",
},
spec => "https://www.w3.org/TR/css-color-4/#specifying-lab-lch",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 110 => "n d #2", 111 => "y" },
edge => { "5.5" => "n", "110" => "n d #2", "111" => "y" },
firefox => { 2 => "n", 111 => "n d #1", 113 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 98 => "y" },
safari => { "3.1" => "n", "15" => "y" },
samsung => { 4 => "n", 22 => "y" },
},
status => "cr",
title => "LCH and Lab color values",
ucprefix => 0,
},
"css-letter-spacing" => {
categories => ["CSS"],
description => "Controls spacing between characters of text (i.e. \"tracking\" in typographical terms). Not to be confused with kerning.",
keywords => "CSS,letter,spacing,tracking",
links => [
{
title => "MDN Web Docs - CSS letter-spacing",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing",
},
],
notes_by_num => { 1 => "Truncates or rounds fractional portions of values" },
spec => "https://www.w3.org/TR/CSS2/text.html#propdef-letter-spacing",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 30 => "y" },
edge => { "5.5" => "u", "6" => "a #1", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "a #1", 80 => "y" },
opera => { "10.0-10.1" => "a #1", "17" => "y", "9" => "u" },
safari => { "3.1" => "u", "3.2" => "a #1", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "letter-spacing CSS property",
ucprefix => 0,
},
"css-line-clamp" => {
categories => ["CSS"],
description => "CSS property that will contain text to a given amount of lines when used in combination with `display: -webkit-box`. It will end with ellipsis when `text-overflow: ellipsis` is included.",
links => [
{
title => "CSS Tricks article",
url => "https://css-tricks.com/line-clampin/",
},
{
title => "MDN Web Docs - line-clamp",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/line-clamp",
},
],
notes => "Older (presto-based) versions of the Opera browser have also supported the same effect using the proprietary `-o-ellipsis-lastline;` value for `text-overflow`.",
notes_by_num => {
1 => "Supported in MS Edge with `-webkit-` prefix only (not with `-ms-`)",
},
spec => "https://w3c.github.io/csswg-drafts/css-overflow-3/#propdef--webkit-line-clamp",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y x" },
and_ff => { 137 => "y x" },
and_qq => { "14.9" => "y x" },
and_uc => { "15.5" => "y x" },
baidu => { "13.52" => "y x" },
bb => { 7 => "y x" },
chrome => { 4 => "u", 14 => "y x" },
edge => { "5.5" => "n", "17" => "y #1", "79" => "y x" },
firefox => { 2 => "n", 68 => "y x" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y x" },
kaios => { "2.5" => "n", "3.0-3.1" => "y x" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y x" },
opera => { 9 => "n", 15 => "y x" },
safari => { "3.1" => "n", "5" => "y x" },
samsung => { 4 => "y x" },
},
status => "wd",
title => "CSS line-clamp",
ucprefix => 0,
},
"css-logical-props" => {
categories => ["CSS", "CSS3"],
description => "Logical properties and values provide control of layout through logical, rather than physical, direction and dimension mappings. These properties are `writing-mode` relative equivalents of their corresponding physical properties.",
keywords => "block-size,border-block,border-block-color,border-block-end,border-block-end-color,border-block-end-style,border-block-end-width,border-block-start,border-block-start-color,border-block-start-style,border-block-start-width,border-block-style,border-block-width,border-end-end-radius,border-end-start-radius,border-inline,border-inline-color,border-inline-end,border-inline-end-color,border-inline-end-style,border-inline-end-width,border-inline-start,border-inline-start-color,border-inline-start-style,border-inline-start-width,border-inline-style,border-inline-width,border-start-end-radius,border-start-start-radius,inline-size,inset,inset-block,inset-block-end,inset-block-start,inset-inline,inset-inline-end,inset-inline-start,margin-block,margin-block-end,margin-block-start,margin-inline,margin-inline-end,margin-inline-start,max-block-size,max-inline-size,min-block-size,min-inline-size,padding-block,padding-block-end,padding-block-start,padding-inline,padding-inline-end,padding-inline-start,recto,verso",
links => [
{
title => "MDN Web Docs - CSS -moz-margin-start",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-margin-start",
},
{
title => "MDN Web Docs - CSS -moz-padding-start",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-padding-start",
},
{
title => "MDN - Basic concepts of Logical Properties and Values",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties/Basic_concepts",
},
],
notes_by_num => {
1 => "Only supports the `*-start`, and `*-end` values for `margin`, `border` and `padding`, not the `inline`/`block` type values as defined in the spec.",
2 => "Like #1 but also supports `*-before` and `*-end` for `*-block-start` and `*-block-end` properties as well as `start` and `end` values for `text-align`.",
3 => "Does not support the `margin-block`, `margin-inline`, `padding-block`, `padding-inline`, or any of the `inset` shorthand properties. Supported in newer Chromium browsers behind the `#enable-experimental-web-platform-features` flag.",
4 => "Does not support the `border-start-start-radius`, `border-start-end-radius`, `border-end-start-radius` and `border-end-end-radius` property.",
5 => "Does not support the `margin-block`, `margin-inline`, `padding-block`, `padding-inline` shorthand properties when value is a CSS property. Supported when using a length value.",
},
spec => "https://www.w3.org/TR/css-logical-1/",
stats => {
and_chr => { "2.1" => "a x #2", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #3 #4" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x #2" },
chrome => { 4 => "a x #2", 69 => "a #3 #4", 87 => "a #4", 89 => "y" },
edge => { "5.5" => "n", "79" => "a #3 #4", "87" => "a #4", "89" => "y" },
firefox => { 2 => "n", 3 => "a x #1", 41 => "a #3 #4", 66 => "y" },
ie_mob => { 10 => "n" },
ios_saf => {
"12.2-12.5" => "a #3 #4",
"14.5-14.8" => "a #4 #5",
"15.0-15.1" => "y",
"3.2" => "a x #2",
},
kaios => { "2.5" => "a #3 #4", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x #2", 56 => "a #3 #4", 74 => "a #4", 76 => "y" },
safari => { "3.1" => "a x #2", "12.1" => "a #3 #4", "14.1" => "a #4 #5", "15" => "y" },
samsung => { "4" => "a x #2", "10.1" => "a #3 #4", "15.0" => "y" },
},
status => "wd",
title => "CSS Logical Properties",
ucprefix => 0,
},
"css-marker-pseudo" => {
categories => ["CSS3"],
description => "The `::marker` pseudo-element allows list item markers to be styled or have their content value customized.",
links => [
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=457718",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=205202",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=141477",
},
{
title => "MDN Web Docs - CSS ::marker",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/::marker",
},
{
title => "CSS-Tricks article",
url => "https://css-tricks.com/almanac/selectors/m/marker/",
},
],
notes_by_num => {
1 => "Safari support is limited to color and font-size. See bug [204163](https://bugs.webkit.org/show_bug.cgi?id=204163).",
},
spec => "https://w3c.github.io/csswg-drafts/css-pseudo-4/#marker-pseudo",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 86 => "y" },
edge => { "5.5" => "n", "86" => "y" },
firefox => { 2 => "n", 68 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "a #1", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 72 => "y" },
safari => { "11.1" => "a #1", "3.1" => "n", "TP" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "wd",
title => "CSS ::marker pseudo-element",
ucprefix => 0,
},
"css-masks" => {
categories => ["CSS"],
chrome_id => 5381559662149632,
description => "Method of displaying part of an element, using a selected image as a mask",
keywords => "clip,clip-path,clip-rule,mask,mask-border,mask-clip,mask-image,mask-mode,mask-type,css masking",
links => [
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/mask",
},
{
title => "HTML5 Rocks article",
url => "https://www.html5rocks.com/en/tutorials/masking/adobe/",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1224422",
},
{
title => "Visual test cases",
url => "https://lab.iamvdo.me/css-svg-masks",
},
{
title => "Detailed blog post (via The Internet Archive)",
url => "https://web.archive.org/web/20160505054016/http://thenittygritty.co/css-masking",
},
{
title => "MDN - mask",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/mask",
},
],
notes_by_num => {
1 => "Partial support in WebKit/Blink browsers refers to supporting the mask-image and mask-box-image properties, but lacking support for other parts of the spec.",
2 => "Partial support in Firefox refers to only support for inline SVG mask elements i.e. mask: url(#foo).",
3 => "Partial support refers to supporting the mask-box-image shorthand but not the longhand properties",
4 => "Can be enabled in MS edge behind the \"Enable CSS Masking\" flag.",
5 => "Partial support refers to supporting mask-image and mask-size",
6 => "Partial support refers to supporting mask-image, mask-size, mask-position, mask-repeat and mask-composite",
7 => "Edge also recognizes and supports all the `-webkit-` prefixed equivalents of the unprefixed properties for site compatibility",
},
spec => "https://www.w3.org/TR/css-masking-1/",
stats => {
and_chr => { "2.1" => "a x #1 #3", "4.4" => "a x #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a x #1" },
and_uc => { "15.5" => "a x #1" },
baidu => { "13.52" => "a x #1" },
bb => { 7 => "a x #1" },
chrome => { 4 => "a x #1", 120 => "y" },
edge => {
"5.5" => "n",
"17" => "n d #4 #5",
"18" => "a #6 #7",
"79" => "a x #1",
"120" => "y",
},
firefox => { "2" => "n", "3.5" => "a #2", "53" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "a x #1", "15.4" => "y" },
kaios => { "2.5" => "a #2", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x #1", 106 => "y" },
safari => { "3.1" => "n", "4" => "a x #1", "15.4" => "y" },
samsung => { 4 => "a x #1", 25 => "y" },
},
status => "cr",
title => "CSS Masks",
ucprefix => 0,
},
"css-matches-pseudo" => {
categories => ["CSS"],
chrome_id => 5445716612743168,
description => "The `:is()` (formerly `:matches()`, formerly `:any()`) pseudo-class checks whether the element at its position in the outer selector matches any of the selectors in its selector list. It's useful syntactic sugar that allows you to avoid writing out all the combinations manually as separate selectors. The effect is similar to nesting in Sass and most other CSS preprocessors.",
keywords => ":is,is,:matches,matches,:any,any,:-moz-any,-moz-any,:-webkit-any,-webkit-any",
links => [
{
title => "WebKit blog post about adding `:matches()` and other Selectors Level 4 features",
url => "https://webkit.org/blog/3615/css-selectors-inside-selectors-discover-matches-not-and-nth-child/",
},
{
title => "Chrome support bug for :is()",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=568705",
},
{
title => "MDN Web Docs - CSS :is()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:is",
},
{
title => "Codepen - Modern tests",
url => "https://codepen.io/atjn/full/MWKErBe",
},
{
title => "JS Bin - Legacy tests",
url => "https://output.jsbin.com/lehina",
},
],
notes_by_num => {
1 => "Only supports the deprecated `:-webkit-any()` pseudo-class",
2 => "Only supports the deprecated `:-webkit-any()` and `:matches()` pseudo-classes",
3 => "Only supports the deprecated `:-moz-any()` pseudo-class.",
4 => "Support for `:is()` can be enabled with the `Experimental Web Platform features` flag",
},
spec => "https://www.w3.org/TR/selectors4/#matches",
stats => {
and_chr => { "2.1" => "u", "4" => "a x #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a d #1 #4" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "a x #1" },
chrome => { 4 => "u", 15 => "a x #1", 65 => "a d #1", 68 => "a d #1 #4", 88 => "y" },
edge => { "5.5" => "n", "79" => "a d #1 #4", "88" => "y" },
firefox => { 2 => "n", 4 => "a x #3", 78 => "y" },
ie_mob => { 10 => "n" },
ios_saf => {
"14.0-14.4" => "y",
"3.2" => "u",
"7.0-7.1" => "a x #1",
"9.0-9.2" => "a #2",
},
kaios => { "2.5" => "a x #3", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x #1", 52 => "a d #1", 55 => "a d #1 #4", 75 => "y" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "a x #1", "9" => "a #2", "14" => "y" },
samsung => { "4" => "a x #1", "15.0" => "y" },
},
status => "wd",
title => ":is() CSS pseudo-class",
ucprefix => 0,
},
"css-math-functions" => {
categories => ["CSS"],
chrome_id => 5714277878988800,
description => "More advanced mathematical expressions in addition to `calc()`",
keywords => "min,min(),max,max(),clamp,clamp()",
links => [
{
title => "Test case on JSFiddle",
url => "https://jsfiddle.net/as9t4jek/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=css-min-max",
},
{ title => "Chrome support bug", url => "https://crbug.com/825895" },
{
title => "MDN Web Docs article for min()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/min",
},
{
title => "MDN Web Docs article for max()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/max",
},
{
title => "MDN Web Docs article for clamp()",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/clamp",
},
{
title => "Getting Started With CSS Math Functions Level 4",
url => "https://webdesign.tutsplus.com/tutorials/mathematical-expressions-calc-min-and-max--cms-29735",
},
{
title => "Introduction to CSS Math Functions",
url => "https://stackdiary.com/css-math-functions/",
},
],
notes_by_num => { 1 => "Safari did not support `clamp()`" },
spec => "https://www.w3.org/TR/css-values-4/#math-function",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 79 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 75 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "a #1", "13.4-13.7" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 66 => "y" },
safari => { "3.1" => "n", "11.1" => "a #1", "13.1" => "y" },
samsung => { "4" => "n", "12.0" => "y" },
},
status => "wd",
title => "CSS math functions min(), max() and clamp()",
ucprefix => 0,
},
"css-media-interaction" => {
categories => ["CSS"],
chrome_id => 6460705494532096,
description => "Allows a media query to be set based on the presence and accuracy of the user's pointing device, and whether they have the ability to hover over elements on the page. This includes the `pointer`, `any-pointer`, `hover`, and `any-hover` media features.",
keywords => "\@media,interaction,hover,any-hover,css pointer,any-pointer,pointer:coarse,pointer:fine",
links => [
{
title => "Potential use cases for script, hover and pointer CSS Level 4 Media Features",
url => "https://jordanm.co.uk/2013/11/11/potential-use-cases-for-script-hover-and-pointer.html",
},
{
title => "Interaction Media Features and their potential (for incorrect assumptions)",
url => "https://dev.opera.com/articles/media-features/",
},
{
title => "Polyfill for the `hover` media feature",
url => "https://github.com/twbs/mq4-hover-shim",
},
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=398943",
},
],
notes_by_num => {},
parent => "css-mediaqueries",
spec => "https://www.w3.org/TR/mediaqueries-4/#mf-interaction",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 64 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 28 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "cr",
title => "Media Queries: interaction media features",
ucprefix => 0,
},
"css-media-range-syntax" => {
categories => ["CSS"],
chrome_id => 5203042742829056,
description => "Syntax improvements to make media queries using features that have a \"range\" type (like width or height) less verbose. Can be used with ordinary mathematical comparison operators: `>`, `<`, `>=`, or `<=`.\r\n\r\nFor example: `\@media (100px <= width <= 1900px)` is the equivalent of `\@media (min-width: 100px) and (max-width: 1900px)`",
keywords => "\@media,media queries,range,range syntax,range context,query,css media query range syntax",
links => [
{
title => "Syntax improvements in Level 4",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1422225#c55",
},
{
title => "PostCSS Polyfill",
url => "https://github.com/postcss/postcss-media-minmax",
},
{
title => "WebKit bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=180234",
},
{
title => "Media Queries Level 4: Media Query Range Contexts (Media Query Ranges)",
url => "https://www.bram.us/2021/10/26/media-queries-level-4-media-query-range-contexts/",
},
{
title => "New syntax for range media queries in Chrome 104",
url => "https://developer.chrome.com/blog/media-query-range-syntax/",
},
],
notes_by_num => {},
parent => "css-mediaqueries",
spec => "https://www.w3.org/TR/mediaqueries-4/#mq-range-context",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 104 => "y" },
edge => { "5.5" => "n", "104" => "y" },
firefox => { 2 => "n", 63 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 91 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { 4 => "n", 20 => "y" },
},
status => "cr",
title => "Media Queries: Range Syntax",
ucprefix => 0,
},
"css-media-resolution" => {
categories => ["CSS", "CSS3"],
chrome_id => 5944509615570944,
description => "Allows a media query to be set based on the device pixels used per CSS unit. While the standard uses `min`/`max-resolution` for this, some browsers support the older non-standard `device-pixel-ratio` media query.",
keywords => "\@media,device-pixel-ratio,resolution,dppx,dpcm,dpi",
links => [
{
title => "How to unprefix -webkit-device-pixel-ratio",
url => "https://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/",
},
{
title => "WebKit Bug 78087: Implement the 'resolution' media query",
url => "https://bugs.webkit.org/show_bug.cgi?id=78087",
},
{
title => "WHATWG Compatibility Standard: -webkit-device-pixel-ratio",
url => "https://compat.spec.whatwg.org/#css-media-queries-webkit-device-pixel-ratio",
},
{
title => "MDN Web Docs - CSS \@media resolution",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@media/resolution",
},
{
title => "CSS Values and Units Module Level 4 add the `x` unit as an alias for `dppx`.",
url => "https://drafts.csswg.org/css-values/#dppx",
},
{
title => "Chrome support 'x' as a resolution unit.",
url => "https://chromestatus.com/feature/5150549246738432",
},
{
title => "Firefox support 'x' as a resolution unit.",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1460655",
},
],
notes_by_num => {
1 => "Supports the `dpi` unit, but does not support `dppx` or `dpcm` units.",
2 => "Firefox before 16 supports only `dpi` unit, but you can set `2dppx` per `min--moz-device-pixel-ratio: 2`.",
3 => "Supports the non-standard `min`/`max-device-pixel-ratio`.",
4 => "Does not support `x` unit (alias for `dppx` unit), e.g: `\@media (min-resolution: 2x) { }`.",
},
parent => "css-mediaqueries",
spec => "https://www.w3.org/TR/mediaqueries-4/#resolution",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a x #3", "4.4" => "a #4", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x #3" },
chrome => { 4 => "a x #3", 29 => "a #4", 68 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "12" => "a #4", "79" => "y" },
firefox => { "2" => "n", "3.5" => "a #2", "16" => "a #4", "62" => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "16.0" => "y", "3.2" => "u", "4.0-4.1" => "a x #3" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { "10" => "a x #3", "12.1" => "y" },
opera => { "12.1" => "y", "15" => "a #4", "55" => "y", "9" => "n", "9.5-9.6" => "a x #3" },
safari => { "3.1" => "n", "4" => "a x #3", "16.0" => "y" },
samsung => { "4" => "a #4", "10.1" => "y" },
},
status => "cr",
title => "Media Queries: resolution feature",
ucprefix => 0,
},
"css-mediaqueries" => {
categories => ["CSS3"],
description => "Method of applying styles based on media information. Includes things like page and device dimensions",
keywords => "\@media",
links => [
{
title => "IE demo page with information",
url => "https://testdrive-archive.azurewebsites.net/HTML5/85CSS3_MediaQueries/",
},
{
title => "Media Queries tutorial",
url => "https://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries",
},
{
title => "Polyfill for IE",
url => "https://github.com/scottjehl/Respond",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/atrules/media",
},
{
title => "Practical Guide to Media Queries",
url => "https://stackdiary.com/css-media-queries/",
},
],
notes_by_num => {
1 => "Does not support nested media queries",
2 => "Partial support refers to only acknowledging different media rules on page reload",
},
spec => "https://www.w3.org/TR/css3-mediaqueries/",
stats => {
and_chr => { "2.1" => "y #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y #1", 26 => "y" },
edge => { "5.5" => "p", "9" => "y #1", "12" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "y #1" },
ios_saf => { "3.2" => "y #1", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "a #1 #2", "4" => "y #1", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS3 Media Queries",
ucprefix => 0,
},
"css-mixblendmode" => {
categories => ["CSS"],
chrome_id => 6362616360337408,
description => "Allows blending between arbitrary SVG and HTML elements",
keywords => "mix-blend-mode,css blend modes,css blending modes",
links => [
{
title => "codepen example",
url => "https://codepen.io/bennettfeely/pen/csjzd",
},
{
title => "Blog post",
url => "https://css-tricks.com/basics-css-blend-modes/",
},
],
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Partial in Safari refers to not supporting the `hue`, `saturation`, `color`, and `luminosity` blend modes.",
},
spec => "https://www.w3.org/TR/compositing-1/#mix-blend-mode",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 29 => "n d #1", 41 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 32 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "a #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 29 => "y" },
safari => { "3.1" => "n", "7.1" => "a #2" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "cr",
title => "Blending of HTML/SVG elements",
ucprefix => 0,
},
"css-motion-paths" => {
categories => ["CSS"],
chrome_id => 6190642178818048,
description => "Allows elements to be animated along SVG paths or shapes via the `offset-path` property. Originally defined as the `motion-path` property.",
keywords => "offset-position,offset-distance,offset-rotate",
links => [
{
title => "Blog post",
url => "https://codepen.io/danwilson/post/css-motion-paths",
},
{
title => "MDN Web Docs - CSS motion-path",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/motion-path",
},
{
title => "Demo",
url => "https://googlechrome.github.io/samples/css-motion-path/index.html",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1186329",
},
],
notes_by_num => {
1 => "Requires the \"Experimental Web Platform features\" flag to be enabled",
},
spec => "https://www.w3.org/TR/motion-1/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "n d #1", 46 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 72 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 30 => "n d #1", 33 => "y" },
safari => { "3.1" => "n", "16.0" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "CSS Motion Path",
ucprefix => 0,
},
"css-namespaces" => {
categories => ["CSS"],
description => "Using the `\@namespace` at-rule, elements of other namespaces (e.g. SVG) can be targeted using the pipe (`|`) selector.",
links => [
{
title => "MDN Web Docs - CSS \@namespace",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@namespace",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-namespaces/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.2-4.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "u", "4" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS namespaces",
ucprefix => 0,
},
"css-nesting" => {
categories => ["CSS"],
chrome_id => 5800613594529792,
description => "CSS nesting provides the ability to nest one style rule inside another, with the selector of the child rule relative to the selector of the parent rule. Similar behavior previously required a CSS pre-processor.",
keywords => "&,\@nest,nested css",
links => [
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1095675",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1648037",
},
{
title => "Safari support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=223497",
},
{
title => "Blog post: CSS Nesting, specificity and you",
url => "https://kilianvalkhof.com/2021/css-html/css-nesting-specificity-and-you/",
},
],
notes_by_num => {
1 => "Available behind the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag",
2 => "Available behind the `layout.css.nesting.enabled` flag",
3 => "Does not allow nesting of type (element) selectors without starting with a symbol, like the `&` nesting selector. [Chromium issue](https://bugs.chromium.org/p/chromium/issues/detail?id=1427259)",
},
spec => "https://w3c.github.io/csswg-drafts/css-nesting/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 109 => "n d #1", 112 => "a #3", 120 => "y" },
edge => { "5.5" => "n", "109" => "n d #1", "112" => "a #3", "120" => "y" },
firefox => { 2 => "n", 115 => "n d #2", 117 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.5" => "a #3", "17.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 95 => "n d #1", 98 => "a #3", 106 => "y" },
safari => { "3.1" => "n", "16.5" => "a #3", "17.2" => "y" },
samsung => { 4 => "n", 23 => "a #3", 25 => "y" },
},
status => "wd",
title => "CSS Nesting",
ucprefix => 0,
},
"css-not-sel-list" => {
categories => ["CSS"],
description => "Selectors Level 3 only allowed `:not()` pseudo-class to accept a single simple selector, which the element must not match any of. Thus, `:not(a, .b, [c])` or `:not(a.b[c])` did not work. Selectors Level 4 allows `:not()` to accept a list of selectors. Thus, `:not(a):not(.b):not([c])` can instead be written as `:not(a, .b, [c])` and `:not(a.b[c])` works as intended.",
keywords => "negation,not,pseudo,selector,selectors,list,multiple,argument,level,4",
links => [
{
title => "MDN Web Docs - CSS :not",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:not",
},
{
title => "Chrome feature request issue",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=580628",
},
{
title => "Firefox feature request bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=933562",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/selectors4/#negation",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 88 => "y" },
edge => { "5.5" => "n", "79" => "u", "80" => "n", "88" => "y" },
firefox => { 2 => "n", 84 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 75 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "15.0" => "y" },
},
status => "wd",
title => "selector list argument of :not()",
ucprefix => 0,
},
"css-nth-child-of" => {
categories => ["CSS"],
description => "The newest versions of `:nth-child()` and `:nth-last-child()` accept an optional `of S` clause which filters the children to only those which match the selector list `S`. For example, `:nth-child(1 of .foo)` selects the first child among the children that have the `foo` class (ignoring any non-`foo` children which precede that child). Similar to `:nth-of-type`, but for arbitrary selectors instead of only type selectors.",
keywords => "nth-child,nth-last-child,nth,child,an,b,of,s,sel,selector,list",
links => [
{
title => "Mozilla Bug 854148 - Support for :nth-child(An+B of sel), :nth-last-child(An+B of sel) pseudo-classes",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=854148",
},
{
title => "Chromium Issue 304163: Implement :nth-child(an+b of S) and :nth-last-child(an+b of S) pseudo-classes",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=304163",
},
{
title => "MS Edge Platform Status: Under Consideration",
url => "https://web.archive.org/web/20190401105447if_/https://developer.microsoft.com/en-us/microsoft-edge/platform/status/cssselectorslevel4/",
},
],
notes => "For support information for just `:nth-child()` see [CSS3 selector support](#feat=css-sel3)",
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/selectors/#the-nth-child-pseudo",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 111 => "y" },
edge => { "5.5" => "n", "111" => "y" },
firefox => { 2 => "n", 113 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 98 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { 4 => "n", 22 => "y" },
},
status => "wd",
title => "selector list argument of :nth-child and :nth-last-child CSS pseudo-classes",
ucprefix => 0,
},
"css-opacity" => {
categories => ["CSS3"],
description => "Method of setting the transparency level of an element",
keywords => "transparent,transparency,alpha",
links => [
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/opacity",
},
{
title => "MDN - opacity",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/opacity",
},
],
notes => "Transparency for elements in IE8 and older can be achieved using the proprietary \"filter\" property and does not work well with PNG images using alpha transparency.",
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-color/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "a", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS3 Opacity",
ucprefix => 0,
},
"css-optional-pseudo" => {
categories => ["CSS"],
description => "The `:optional` pseudo-class matches form inputs (`<input>`, `<textarea>`, `<select>`) which are not `:required`.",
keywords => ":optional,optional,:required,required",
links => [
{
title => "HTML specification for `:optional`",
url => "https://html.spec.whatwg.org/multipage/scripting.html#selector-optional",
},
{
title => "MDN Web Docs - CSS :optional",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:optional",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/fihudu/edit?html,css,output",
},
],
notes_by_num => { 1 => "Does not match non-required `<select>`s" },
parent => "form-validation",
spec => "https://www.w3.org/TR/selectors-4/#optional-pseudo",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { 10 => "a #1", 80 => "y" },
opera => { "10.0-10.1" => "a #1", "15" => "y", "9" => "u" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => ":optional CSS pseudo-class",
ucprefix => 0,
},
"css-overflow" => {
categories => ["CSS"],
description => "Originally a single property for controlling overflowing content in both horizontal & vertical directions, the `overflow` property is now a shorthand for `overflow-x` & `overflow-y`. The latest version of the specification also introduces the `clip` value that blocks programmatic scrolling.",
keywords => "overflow:hidden,overflow:scroll,overflow:clip",
links => [
{
title => "CSS overflow on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/overflow",
},
{
title => "WebKit bug on support for two values syntax",
url => "https://bugs.webkit.org/show_bug.cgi?id=184691",
},
{
title => "Edge bug on support for two values syntax",
url => "https://web.archive.org/web/20190401105108/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/16993428/",
},
{
title => "WebKit bug on support for clip value",
url => "https://bugs.webkit.org/show_bug.cgi?id=198230",
},
],
notes => "Effectively all browsers support the CSS 2.1 definition for single-value `overflow` as well as `overflow-x` & `overflow-y` and values `visible`, `hidden`, `scroll` & `auto`",
notes_by_num => {
1 => "Does not support the two value `overflow` shorthand",
2 => "Does not support the `clip` value",
},
spec => "https://www.w3.org/TR/css-overflow-3/",
stats => {
and_chr => { "2.1" => "a #1 #2", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #1 #2" },
and_uc => { "15.5" => "a #1 #2" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1 #2" },
chrome => { 4 => "a #1 #2", 68 => "a #2", 90 => "y" },
edge => { "5.5" => "a #1 #2", "79" => "a #2", "90" => "y" },
firefox => { 2 => "a #1 #2", 61 => "a #2", 81 => "y" },
ie_mob => { 10 => "a #1 #2" },
ios_saf => { "13.4-13.7" => "a #2", "16.0" => "y", "3.2" => "a #1 #2" },
kaios => { "2.5" => "a #1 #2", "3.0-3.1" => "y" },
op_mini => { all => "a #1 #2" },
op_mob => { 10 => "a #1 #2", 80 => "y" },
opera => { 9 => "a #1 #2", 55 => "a #2", 76 => "y" },
safari => { "3.1" => "a #1 #2", "13.1" => "a #2", "16.0" => "y" },
samsung => { "4" => "a #1 #2", "15.0" => "y" },
},
status => "wd",
title => "CSS overflow property",
ucprefix => 0,
},
"css-overflow-anchor" => {
categories => ["CSS3"],
chrome_id => 5700102471548928,
description => "Changes in DOM elements above the visible region of a scrolling box can result in the page moving while the user is in the middle of consuming the content.\r\nBy default, the value of `overflow-anchor` is `auto`, it can mitigate this jarring user experience by keeping track of the position of an anchor node and adjusting the scroll offset accordingly",
keywords => "overflow-anchor,scroll anchoring",
links => [
{
title => "Explainer",
url => "https://github.com/WICG/ScrollAnchoring/blob/master/explainer.md",
},
{
title => "Google developers article",
url => "https://developers.google.com/web/updates/2016/04/scroll-anchoring",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=171099",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-scroll-anchoring/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 56 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 66 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 43 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "CSS overflow-anchor (Scroll Anchoring)",
ucprefix => 0,
},
"css-overflow-overlay" => {
categories => ["CSS"],
description => "The `overlay` value of the `overflow` CSS property is a non-standard value to make scrollbars appear on top of content rather than take up space. This value is deprecated and related functionality being standardized as [the `scrollbar-gutter` property](mdn-css_properties_scrollbar-gutter).",
links => [
{
title => "MDN article on overflow values",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/overflow#values",
},
{
title => "WebKit change to make \"overflow: overlay\" a synonym for \"overflow: auto\"",
url => "https://trac.webkit.org/changeset/236341/webkit",
},
],
notes_by_num => {
1 => "The `overlay` value is recognized, but behaves the same as \"auto\".",
},
spec => "https://github.com/w3c/csswg-drafts/issues/92",
stats => {
and_chr => { "2.1" => "y", "135" => "n #1" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "u", 15 => "y", 114 => "n #1" },
edge => { "5.5" => "n", "79" => "y", "114" => "n #1" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "n #1", "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y", 100 => "n #1" },
safari => { "3.1" => "u", "4" => "y", "12" => "n #1" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "CSS overflow: overlay",
ucprefix => 0,
},
"css-overscroll-behavior" => {
categories => ["CSS"],
chrome_id => 5734614437986304,
description => "CSS property to control the behavior when the scroll position of a scroll container reaches the edge of the scrollport.",
keywords => "scroll-boundary-behavior,overscroll-behavior-x,overscroll-behavior-y,-ms-scroll-chaining",
links => [
{
title => "Demo",
url => "https://ebidel.github.io/demos/chatbox.html",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=951793#c11",
},
{
title => "Google Developers blog post on overscroll-behavior",
url => "https://developers.google.com/web/updates/2017/11/overscroll-behavior",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=176454",
},
{
title => "CSS overscroll-behavior on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior",
},
],
notes_by_num => {
1 => "Supports the precursor version of the property: [`-ms-scroll-chaining`](https://msdn.microsoft.com/en-us/library/hh772034%28v=vs.85%29.aspx), which works similarly. IE support is limited to Windows 8 & above",
2 => "Does not support `overscroll-behavior: none;` on the body element to prevent the overscroll glow and rubberbanding effects.",
3 => "Incorrectly treats `none` as `contain` see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior#Browser_compatibility) and [Edge 18 changelog](https://aka.ms/devguide_edgehtml_18)",
4 => "Can be enabled in the \"Experimental Features\" developer menu",
},
spec => "https://drafts.csswg.org/css-overscroll/#overscroll-behavior-properties",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 63 => "a #2", 65 => "y" },
edge => { "5.5" => "n", "10" => "a #1", "18" => "a #3", "79" => "y" },
firefox => { 2 => "n", 59 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "14.5-14.8" => "n d #4", "16.0" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 50 => "a #2", 52 => "y" },
safari => { "3.1" => "n", "14.1" => "n d #4", "16.0" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "wd",
title => "CSS overscroll-behavior",
ucprefix => 0,
},
"css-page-break" => {
categories => ["CSS"],
description => "Properties to control the way elements are broken across (printed) pages.",
keywords => "page-break-before,page-break-after,page-break-inside,always,avoid",
links => [
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/properties/p/page-break/",
},
{
title => "Latest fragmentation specification (includes column & region breaks)",
url => "https://drafts.csswg.org/css-break-3/#break-between",
},
],
notes => "Not all mobile browsers offer print support; support listed for these is based on browser engine capability.",
notes_by_num => {
1 => "Supports the `page-break-*` alias from the CSS 2.1 specification, but not the `break-*` properties from the latest spec.",
2 => "Partial support is due to not supporting `avoid` for `page-break-before` & `page-break-after` (only `page-break-inside`).",
3 => "Treats the `left` and `right` values like `always` (as allowed by specification).",
},
spec => "https://www.w3.org/TR/CSS2/page.html#page-breaks",
stats => {
and_chr => { "2.1" => "a #1 #2 #3", "135" => "y #1 #3" },
and_ff => { 137 => "a #2 #3" },
and_qq => { "14.9" => "a #1 #2 #3" },
and_uc => { "15.5" => "a #1 #2 #3" },
baidu => { "13.52" => "a #1 #2 #3" },
bb => { 7 => "a #1 #2 #3" },
chrome => { 4 => "a #1 #2 #3", 108 => "y #1 #3" },
edge => {
"5.5" => "a #1 #2 #3",
"10" => "a #1 #2",
"79" => "a #1 #2 #3",
"108" => "y #1 #3",
},
firefox => { 2 => "a #1 #2 #3", 65 => "a #2 #3" },
ie_mob => { 10 => "a #1 #2" },
ios_saf => { "3.2" => "a #1 #2 #3" },
kaios => { "2.5" => "a #1 #2 #3", "3.0-3.1" => "a #2 #3" },
op_mini => { all => "y #1" },
op_mob => { 10 => "y #1", 80 => "y #1 #3" },
opera => { "10.0-10.1" => "y #1", "15" => "a #1 #2 #3", "9" => "u", "94" => "y #1 #3" },
safari => { "3.1" => "a #1 #2 #3", "10" => "a #2 #3", "10.1" => "a #1 #2 #3" },
samsung => { 4 => "a #1 #2 #3", 21 => "y #1 #3" },
},
status => "rec",
title => "CSS page-break properties",
ucprefix => 0,
},
"css-paged-media" => {
categories => ["Other"],
description => "CSS at-rule (`\@page`) to define page-specific rules when printing web pages, such as margin per page and page dimensions.",
links => [
{
title => "CSS Paged media article",
url => "https://www.tutorialspoint.com/css/css_paged_media.htm",
},
{
title => "MDN Web Docs - CSS \@page",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@page",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=85062",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=286443",
},
],
notes => "Currently no browsers appear to support the `marks` & `bleed` properties from the latest version of the specification.\r\n\r\n",
notes_by_num => {
1 => "Does not support the `size` property",
2 => "Does not appear to have a way to print web pages",
},
spec => "https://w3c.github.io/csswg-drafts/css-page-3/",
stats => {
and_chr => { "2.1" => "u" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "8" => "a #1", "79" => "y" },
firefox => { 2 => "n", 19 => "a #1", 95 => "y" },
ie_mob => { 10 => "n #2" },
ios_saf => { "3.2" => "n", "18.2" => "y" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "u" },
op_mob => { 10 => "u", 80 => "y" },
opera => { 9 => "a #1", 15 => "y" },
safari => { "3.1" => "n", "18.2" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS Paged Media (\@page)",
ucprefix => 0,
},
"css-paint-api" => {
categories => ["CSS", "JS API"],
chrome_id => 5685444318593024,
description => "Allows programmatic generation of images used by CSS",
keywords => "houdini",
links => [
{
title => "Google CSS Paint API Introduction",
url => "https://developers.google.com/web/updates/2018/01/paintapi",
},
{
title => "Is Houdini Ready Yet?",
url => "https://ishoudinireadyyet.com/",
},
],
notes_by_num => {
1 => "Can be enabled using the Develop > Experimental Features menu.",
},
spec => "https://drafts.css-houdini.org/css-paint-api/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 65 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 52 => "y" },
safari => { "3.1" => "n", "12.1" => "n d #1" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "cr",
title => "CSS Painting API",
ucprefix => 0,
},
"css-placeholder" => {
categories => ["CSS"],
chrome_id => 6715780926275584,
description => "The ::placeholder pseudo-element represents placeholder text in an input field: text that represents the input and provides a hint to the user on how to fill out the form. For example, a date-input field might have the placeholder text `YYYY-MM-DD` to clarify that numeric dates are to be entered in year-month-day order.",
keywords => "::placeholder,placeholder",
links => [
{
title => "CSS-Tricks article with all prefixes",
url => "https://css-tricks.com/snippets/css/style-placeholder-text/",
},
{
title => "CSSWG discussion",
url => "https://wiki.csswg.org/ideas/placeholder-styling",
},
{
title => "MDN Web Docs - CSS ::-moz-placeholder",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/::-moz-placeholder",
},
{
title => "Mozilla Bug 1069012 - unprefix :placeholder-shown pseudo-class and ::placeholder pseudo-element",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1069012",
},
{
title => "MDN web docs - ::placeholder",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/::placeholder",
},
],
notes => "Partial support refers to using alternate names:\r\n`::-webkit-input-placeholder` for Chrome/Safari/Opera ([Chrome issue #623345](https://bugs.chromium.org/p/chromium/issues/detail?id=623345)) \r\n`::-ms-input-placeholder` for Edge (also supports webkit prefix)",
notes_by_num => {
1 => "Firefox 18 and below supported the `:-moz-placeholder` pseudo-class rather than the `::-moz-placeholder` pseudo-element.",
},
spec => "https://w3c.github.io/csswg-drafts/css-pseudo-4/#placeholder-pseudo",
stats => {
and_chr => { "2.1" => "a x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x" },
chrome => { 4 => "a x", 57 => "y" },
edge => { "5.5" => "n", "12" => "a x", "79" => "y" },
firefox => { 2 => "n #1", 19 => "y x", 51 => "y" },
ie_mob => { 10 => "a x" },
ios_saf => { "10.3" => "y", "3.2" => "n", "4.2-4.3" => "a x" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x", 44 => "y" },
safari => { "3.1" => "n", "5" => "a x", "10.1" => "y" },
samsung => { "4" => "a x", "7.2-7.4" => "y" },
},
status => "wd",
title => "::placeholder CSS pseudo-element",
ucprefix => 0,
},
"css-placeholder-shown" => {
categories => ["CSS"],
chrome_id => 6404760559157248,
description => "Input elements can sometimes show placeholder text as a hint to the user on what to type in. See, for example, the placeholder attribute in HTML5. The :placeholder-shown pseudo-class matches an input element that is showing such placeholder text.",
keywords => ":placeholder-shown,placeholder-shown,placeholder",
links => [
{
title => "WebKit commit",
url => "https://trac.webkit.org/changeset/172826",
},
{
title => "Firefox bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1069015",
},
],
notes => "For support of styling the actual placeholder text itself, see [CSS ::placeholder](https://caniuse.com/#feat=css-placeholder)",
notes_by_num => {
1 => "Partial support in Firefox refers to using the non-standard `:-moz-placeholder` name rather than `:placeholder-shown`.",
2 => "Partial support in IE refers to using the non-standard `:-ms-input-placeholder` name rather than `:placeholder-shown`.",
},
spec => "https://www.w3.org/TR/selectors4/#placeholder",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 47 => "y" },
edge => { "5.5" => "n", "10" => "a x #2", "12" => "n", "79" => "y" },
firefox => { 2 => "n", 4 => "a x #1", 51 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "a x #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 34 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => ":placeholder-shown CSS pseudo-class",
ucprefix => 0,
},
"css-read-only-write" => {
categories => ["CSS"],
description => ":read-only and :read-write pseudo-classes to match elements which are considered user-alterable",
keywords => "css,selector,read-only,read-write",
links => [
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/selectors/r/read-write-read/",
},
{
title => "MDN :read-only",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/%3Aread-only",
},
{
title => "MDN Web Docs - CSS :read-write",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/:read-write",
},
{
title => "Selectors Level 4 \xA7 The Mutability Pseudo-classes: :read-only and :read-write",
url => "https://drafts.csswg.org/selectors-4/#rw-pseudos",
},
{
title => "Firefox feature request bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=312971",
},
],
notes_by_num => {
1 => "Supports selector only for input and textarea fields, but not for contenteditable",
},
spec => "https://html.spec.whatwg.org/multipage/semantics-other.html#selector-read-only",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1", 10 => "y" },
chrome => { 4 => "u", 15 => "a #1", 36 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "u", 3 => "y x", 78 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "4.2-4.3" => "a #1", "9.0-9.2" => "y" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.5" => "a #1", "80" => "y" },
opera => { "9" => "u", "11.5" => "a #1", "23" => "y" },
safari => { "3.1" => "u", "4" => "a #1", "9" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "CSS :read-only and :read-write selectors",
ucprefix => 0,
},
"css-rebeccapurple" => {
categories => ["CSS"],
description => "The new color added in CSS Color Module Level 4",
keywords => "rebeccapurple,beccapurple",
links => [
{
title => "Codepen blog post",
url => "https://codepen.io/trezy/post/honoring-a-great-man",
},
],
notes_by_num => {
1 => "Only works in IE11 for Windows 10, not older versions of Windows",
},
spec => "https://www.w3.org/TR/css-color-4/#valdef-color-rebeccapurple",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 38 => "y" },
edge => { "5.5" => "n", "11" => "a #1", "12" => "y" },
firefox => { 2 => "n", 33 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 25 => "y" },
safari => { "3.1" => "n", "6.1" => "u", "7" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Rebeccapurple color",
ucprefix => 0,
},
"css-reflections" => {
categories => ["CSS"],
chrome_id => 5627300510957568,
description => "Method of displaying a reflection of an element",
keywords => "box-reflect",
links => [
{
title => "WebKit blog post",
url => "https://webkit.org/blog/182/css-reflections/",
},
{
title => "MDN - -webkit-box-reflect",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-box-reflect",
},
],
notes => "Similar effect can be achieved in Firefox 4+ using the -moz-element() background property",
notes_by_num => {},
spec => "https://webkit.org/blog/182/css-reflections/",
stats => {
and_chr => { "2.1" => "y x" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y x" },
and_uc => { "15.5" => "y x" },
baidu => { "13.52" => "y x" },
bb => { 7 => "y x" },
chrome => { 4 => "y x" },
edge => { "5.5" => "n", "79" => "y x" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y x" },
opera => { 9 => "n", 15 => "y x" },
safari => { "3.1" => "n", "4" => "y x" },
samsung => { 4 => "y x" },
},
status => "unoff",
title => "CSS Reflections",
ucprefix => 0,
},
"css-regions" => {
categories => ["CSS3"],
chrome_id => 5655612935372800,
description => "Method of flowing content into multiple elements, allowing magazine-like layouts. While once supported in WebKit-based browsers and Internet Explorer, implementing the feature is no longer being pursued by any browser.",
links => [
{
title => "Adobe demos and samples",
url => "https://web.archive.org/web/20121027050852/http://html.adobe.com:80/webstandards/cssregions/",
},
{
title => "IE10 developer guide info",
url => "https://learn.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/dev-guides/hh673537(v=vs.85)",
},
{
title => "Firefox feature request bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=674802",
},
{
title => "Beginner's guide to CSS Regions",
url => "https://www.sitepoint.com/a-beginners-guide-css-regions/",
},
{
title => "Discussion on removal in Blink",
url => "https://groups.google.com/a/chromium.org/g/blink-dev/c/kTktlHPJn4Q/m/YrnfLxeMO7IJ",
},
],
notes_by_num => {
1 => "Support is limited to using an iframe as a content source with the `-ms-flow-into: flow_name;` and `-ms-flow-from: flow_name;` syntax.",
2 => "Partial support refers to not supporting the `region-fragment` property.",
},
spec => "https://www.w3.org/TR/css3-regions/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 15 => "a x", 19 => "n d", 35 => "n" },
edge => { "5.5" => "n", "10" => "a x #1 #2", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "a x #1 #2" },
ios_saf => { "11.3-11.4" => "n", "3.2" => "n", "7.0-7.1" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "6.1" => "y x", "11.1" => "n" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS Regions",
ucprefix => 0,
},
"css-relative-colors" => {
categories => ["CSS"],
chrome_id => "5205844613922816,4755025804132352",
description => "Relative color syntax in CSS allows a color to be defined relative to another color using the `from` keyword and optionally `calc()` for any of the color values.",
links => [
{
title => "Dynamic Color Manipulation with CSS Relative Colors",
url => "https://blog.jim-nielsen.com/2021/css-relative-colors/",
},
{
title => "Chromium bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1274133",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1701488",
},
{
title => "Relative color syntax (blog post)",
url => "https://www.matuzo.at/blog/2023/100daysof-day92/",
},
],
notes_by_num => {
1 => "Can be enabled in Chrome via the `#enable-experimental-web-platform-features` flag in `chrome://flags`",
2 => "Does not support `currentcolor` or system color keywords ([Firefox bug 1893966](https://bugzilla.mozilla.org/show_bug.cgi?id=1893966))",
},
spec => "https://www.w3.org/TR/css-color-5/#relative-colors",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "a #2" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 118 => "n d #1", 119 => "a #2", 131 => "y" },
edge => { "5.5" => "n", "118" => "n d #1", "119" => "a #2", "131" => "y" },
firefox => { 2 => "n", 128 => "a #2", 133 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "a #2", "18.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #2" },
opera => { 9 => "n", 104 => "n d #1", 106 => "a #2", 117 => "y" },
safari => { "3.1" => "n", "16.4" => "a #2", "18.0" => "y" },
samsung => { 4 => "n", 25 => "a #2" },
},
status => "wd",
title => "CSS Relative color syntax",
ucprefix => 0,
},
"css-repeating-gradients" => {
categories => ["CSS3"],
description => "Method of defining a repeating linear or radial color gradient as a CSS image.",
keywords => "repeating-linear-gradient,repeating-radial-gradient",
links => [
{
title => "MDN Web Docs - CSS repeating linear gradient",
url => "https://developer.mozilla.org/en/CSS/repeating-linear-gradient",
},
],
notes => "Firefox 10+, Chrome 26+ and Opera 11.6+ also support the new \"to (side)\" syntax.",
notes_by_num => {},
parent => "css-gradients",
spec => "https://www.w3.org/TR/css3-images/#repeating-gradients",
stats => {
and_chr => { "2.1" => "n", "4" => "y x", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 10 => "y x", 26 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { "2" => "n", "3.6" => "y x", "16" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y x", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "a x", "12" => "y x", "12.1" => "y" },
opera => { "9" => "n", "11.1" => "a x", "11.6" => "y x", "12.1" => "y" },
safari => { "3.1" => "n", "5.1" => "y x", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS Repeating Gradients",
ucprefix => 0,
},
"css-resize" => {
categories => ["CSS3"],
description => "Method of allowing an element to be resized by the user, with options to limit to a given direction. ",
keywords => "horizontal,vertical",
links => [
{
title => "CSS Tricks info",
url => "https://css-tricks.com/almanac/properties/r/resize/",
},
{
title => "On textarea resizing",
url => "https://davidwalsh.name/textarea-resize",
},
{
title => "CSS resize none on textarea is bad for UX",
url => "https://catalin.red/css-resize-none-is-bad-for-ux/",
},
{
title => "MDN - resize",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/resize",
},
],
notes_by_num => {
1 => "Presto-based Opera 12.10+ currently only supports the resize property for textarea elements.",
},
spec => "https://www.w3.org/TR/css3-ui/#resize",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 4 => "y x", 5 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "12.1" => "a #1", "15" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "rec",
title => "CSS resize property",
ucprefix => 0,
},
"css-revert-value" => {
categories => ["CSS"],
description => "A CSS keyword value that resets a property's value to the default specified by the browser in its UA stylesheet, as if the webpage had not included any CSS. For example, `display:revert` on a `<div>` would result in `display:block`. This is in contrast to the `initial` value, which is simply defined on a per-property basis, and for `display` would be `inline`.",
keywords => "CSS,reset,value",
links => [
{
title => "MDN Web Docs - CSS revert",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/revert",
},
{
title => "Firefox feature request bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1215878",
},
{
title => "Chrome feature request issue",
url => "https://code.google.com/p/chromium/issues/detail?id=579788",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-cascade-4/#valdef-all-revert",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 84 => "y" },
edge => { "5.5" => "n", "84" => "y" },
firefox => { 2 => "n", 67 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 73 => "y" },
safari => { "3.1" => "n", "9.1" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "cr",
title => "CSS revert value",
ucprefix => 0,
},
"css-rrggbbaa" => {
categories => ["CSS"],
chrome_id => 5685348285808640,
description => "The CSS Color Module Level 4 defines new 4 & 8 character hex notation for color to include the opacity level.",
keywords => "rgba, rrggbbaa, color",
links => [
{
title => "JS Bin testcase",
url => "https://jsbin.com/ruyetahatu/edit?html,css,output",
},
],
notes => "Only supported in Android WebViews in apps that target Android Pie, due to [this issue](https://bugs.chromium.org/p/chromium/issues/detail?id=618472)",
notes_by_num => {
1 => "Can be enabled via the \"Experimental web platform features\" flag.",
},
spec => "https://w3c.github.io/csswg-drafts/css-color/#hex-notation",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 52 => "n d #1", 62 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 39 => "n d #1", 52 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "n d #1", "8.2" => "y" },
},
status => "cr",
title => "#rrggbbaa hex color notation",
ucprefix => 0,
},
"css-scroll-behavior" => {
categories => ["CSS"],
chrome_id => 5812155903377408,
description => "Method of specifying the scrolling behavior for a scrolling box, when scrolling happens due to navigation or CSSOM scrolling APIs.",
keywords => "smooth,scroll,cssom,scroll-behavior,smoothscroll",
links => [
{
title => "MDN Web Docs - CSS scroll-behavior",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior",
},
{
title => "Chrome launch bug ",
url => "https://code.google.com/p/chromium/issues/detail?id=243871",
},
{
title => "Blog post with demo",
url => "https://hospodarets.com/native_smooth_scrolling",
},
{
title => "iOS / WebKit bug report",
url => "https://bugs.webkit.org/show_bug.cgi?id=188043",
},
],
notes_by_num => {
1 => "Partial support refers to support everything except of [`Element.scrollIntoView()`](https://caniuse.com/scrollintoview) and [not together with pinch viewport](https://bugs.chromium.org/p/chromium/issues/detail?id=434497).",
2 => "Supported in Chrome and Opera behind the 'Smooth Scrolling' and/or 'Enable experimental web platform features' flag",
3 => "Supported in Safari via the \"CSSOM View Smooth Scrolling\" Experimental Features flag.",
},
spec => "https://www.w3.org/TR/css-overflow-3/#smooth-scrolling",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y #1" },
and_uc => { "15.5" => "y #1" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "n d #1 #2", 61 => "y #1" },
edge => { "5.5" => "n", "79" => "y #1" },
firefox => { 2 => "n", 36 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "n d #3", "15.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 28 => "n d #1 #2", 48 => "y #1" },
safari => { "3.1" => "n", "14" => "n d #3", "15.4" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "wd",
title => "CSS Scroll-behavior",
ucprefix => 0,
},
"css-scrollbar" => {
categories => ["CSS"],
chrome_id => 5665308343795712,
description => "Methods of styling scrollbars' color and width.",
keywords => "scrollbar-button,scrollbar-track,scrollbar-thumb,scrollbar-base-color,scrollbar-face-color,scrollbar-color,scrollbar-width",
links => [
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1460109",
},
{
title => "Stackoverflow article discussing cross-browser support",
url => "https://stackoverflow.com/questions/9251354/css-customized-scroll-bar-in-div/14150577#14150577",
},
{
title => "Tutorial for IE & WebKit/Blink browsers",
url => "http://codemug.com/html/custom-scrollbars-using-css/",
},
{
title => "\"perfect-scrollbar\" - Minimal custom scrollbar plugin",
url => "https://perfectscrollbar.com/",
},
{
title => "jQuery custom content scroller",
url => "https://manos.malihu.gr/jquery-custom-content-scroller/",
},
{
title => "Webkit blog post describing their non-standard support",
url => "https://webkit.org/blog/363/styling-scrollbars/",
},
],
notes_by_num => {
1 => "Only supports styling scrollbar colors through proprietary prefixed properties, no other properties to define the scrollbar's appearance. (not on standards track)",
2 => "Supports scrollbar styling via CSS [pseudo-properties](https://webkit.org/blog/363/styling-scrollbars/). (not on standards track)",
3 => "Scrollbar styling doesn\x{2019}t work in [WKWebView](https://issues.apache.org/jira/browse/CB-10123)",
4 => "Can be enabled by setting the layout.css.scrollbar-colors.enabled and layout.css.scrollbar-width.enabled flags to true.",
5 => "Firefox 63 supported scrollbar-face-color and scrollbar-track-color separate properties (now dropped from the spec) instead of unified scrollbar-color property.",
},
spec => "https://w3c.github.io/csswg-drafts/css-scrollbars-1/",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a x #2" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a x #2" },
and_uc => { "15.5" => "a x #2" },
baidu => { "13.52" => "a x #2" },
bb => { 7 => "a x #2" },
chrome => { 4 => "a x #2", 121 => "y" },
edge => { "5.5" => "a #1", "12" => "n", "79" => "a x #2", "121" => "y" },
firefox => { 2 => "n", 63 => "n d #4 #5", 64 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.0-14.4" => "n", "3.2" => "u", "7.0-7.1" => "a x #2", "8" => "a x #2 #3" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a x #2" },
opera => { 9 => "n", 15 => "a x #2", 107 => "y" },
safari => { "3.1" => "u", "5.1" => "a x #2" },
samsung => { 4 => "a x #2", 25 => "y" },
},
status => "cr",
title => "CSS scrollbar styling",
ucprefix => 0,
},
"css-sel2" => {
categories => ["CSS2"],
description => "Basic CSS selectors including: `*` (universal selector), `>` (child selector), `:first-child`, `:link`, `:visited`, `:active`, `:hover`, `:focus`, `:lang()`, `+` (adjacent sibling selector), `[attr]`, `[attr=\"val\"]`, `[attr~=\"val\"]`, `[attr|=\"bar\"]`, `.foo` (class selector), `#foo` (id selector)",
keywords => "attribute selector",
links => [
{
title => "Detailed support information",
url => "https://www.quirksmode.org/css/contents.html",
},
{
title => "Examples of advanced selectors",
url => "https://www.yourhtmlsource.com/stylesheets/advancedselectors.html",
},
{
title => "Selectivizr: Polyfill for IE6-8",
url => "http://selectivizr.com",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/selectors",
},
],
notes => "Support for `:visited` styling [varies across browsers](https://www.webfx.com/blog/web-design/visited-pseudo-class-strange/) due to security concerns.",
notes_by_num => {},
spec => "https://www.w3.org/TR/CSS21/selector.html",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "7" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS 2.1 selectors",
ucprefix => 0,
},
"css-sel3" => {
categories => ["CSS3"],
description => "Advanced element selection using selectors including: `[foo^=\"bar\"]`, `[foo\$=\"bar\"]`, `[foo*=\"bar\"]`, `:root`, `:nth-child()`, `:nth-last-child()`, `:nth-of-type()`, `:nth-last-of-type()`, `:last-child`, `:first-of-type`, `:last-of-type`, `:only-child`, `:only-of-type`, `:empty`, `:target`, `:enabled`, `:disabled`, `:checked`, `:not()`, `~` (general sibling)",
links => [
{
title => "Detailed support information",
url => "https://www.quirksmode.org/css/selectors/",
},
{
title => "Automated CSS3 selector test",
url => "http://www.css3.info/selectors-test/",
},
{
title => "Selectivizr: Polyfill for IE6-8",
url => "http://selectivizr.com",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/selectors",
},
],
notes_by_num => {
1 => "IE7 and IE8 support only these CSS3 selectors: General siblings (`element1~element2`) and Attribute selectors `[attr^=val]`, `[attr\$=val]`, and `[attr*=val]`",
},
spec => "https://www.w3.org/TR/css3-selectors/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "7" => "a #1", "9" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS3 selectors",
ucprefix => 0,
},
"css-selection" => {
categories => ["CSS"],
description => "The ::selection CSS pseudo-element applies rules to the portion of a document that has been highlighted (e.g., selected with the mouse or another pointing device) by the user.",
keywords => "::selection,selection",
links => [
{
title => "::selection test",
url => "https://quirksmode.org/css/selectors/selection.html",
},
{
title => "MDN web docs",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/::selection",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-pseudo-4/#selectordef-selection",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y x", 62 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "u", "11.5" => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "::selection CSS pseudo-element",
ucprefix => 0,
},
"css-shapes" => {
categories => ["CSS3"],
chrome_id => 5163890719588352,
description => "Allows geometric shapes to be set in CSS to define an area for text to flow around. Includes properties `shape-outside`, `shape-margin` and `shape-image-threshold`",
keywords => "circle,ellipse,polygon,inset,shape-outside,shape-margin,shape-image-threshold",
links => [
{
title => "A List Apart article",
url => "https://alistapart.com/article/css-shapes-101/",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1040714",
},
],
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Partially supported in Firefox by enabling \"layout.css.shape-outside.enabled\" in about:config",
},
spec => "https://www.w3.org/TR/css-shapes/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 34 => "n d #1", 37 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 51 => "n d #2", 62 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "y x", "10.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 24 => "y" },
safari => { "3.1" => "n", "7.1" => "y x", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS Shapes Level 1",
ucprefix => 0,
},
"css-snappoints" => {
categories => ["CSS"],
chrome_id => 5721832506261504,
description => "CSS technique that allows customizable scrolling experiences like pagination of carousels by setting defined snap positions.",
keywords => "scroll-margin,scroll-snap-points-x,scroll-snap-points-y,scroll-snap-type,scroll-snap-destination,scroll-snap-coordinate,scroll-snap-margin,scroll-snap-align,scroll-snap-stop",
links => [
{
title => "Blog post",
url => "https://generatedcontent.org/post/66817675443/setting-native-like-scrolling-offsets-in-css-with",
},
{
title => "MDN Web Docs - CSS Scroll snap points",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Scroll_Snap_Points",
},
{
title => "Polyfill - based on an [older version](https://www.w3.org/TR/2015/WD-css-snappoints-1-20150326/) of the spec",
url => "https://github.com/ckrack/scrollsnap-polyfill",
},
{
title => "Polyfill - based on the [current version](https://www.w3.org/TR/css-scroll-snap-1/) of the spec",
url => "https://www.npmjs.com/package/css-scroll-snap-polyfill",
},
{
title => "MDN Web Docs - CSS Scroll Snap",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Scroll_Snap",
},
{
title => "A CSS Snap Points based carousel (and lightweight polyfill) ",
url => "https://github.com/filamentgroup/snapper",
},
],
notes => "Works in the iOS WKWebView, but not UIWebView.",
notes_by_num => {
1 => "Partial support in IE10 refers to support limited to touch screens.",
2 => "Partial support in IE11 [documented here](https://web.archive.org/web/20160616212557/https://dl.dropboxusercontent.com/u/444684/openwebref/CSS/scroll-snap-points/support.html)",
4 => "Partial support in Safari refers to not supporting the `none` keyword in `scroll-snap-points-x`, `scroll-snap-points-y` and `scroll-snap-coordinate`, and length keywords (`top`, `right`, etc.) in `scroll-snap-destination` and `scroll-snap-coordinate`.",
5 => "Supports properties from an [older version](https://www.w3.org/TR/2015/WD-css-snappoints-1-20150326/) of the spec.",
6 => "Partial support in IE & Edge refers to not supporting `scroll-snap-coordinate` and `scroll-snap-destination`.",
7 => "Available behind the \"Experimental Web Platform features\" feature flag",
},
spec => "https://www.w3.org/TR/css-scroll-snap-1/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 66 => "n d #7", 69 => "y" },
edge => { "5.5" => "n", "10" => "a x #1 #5 #6", "11" => "a x #2 #5 #6", "79" => "y" },
firefox => { 2 => "n", 39 => "a #5", 68 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n", "9.0-9.2" => "a x #4 #5" },
kaios => { "2.5" => "a #5", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "n d #7", 64 => "y" },
safari => { "3.1" => "n", "9" => "a x #4 #5", "11" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "cr",
title => "CSS Scroll Snap",
ucprefix => 0,
},
"css-sticky" => {
categories => ["CSS"],
chrome_id => 6190250464378880,
description => "Keeps elements positioned as \"fixed\" or \"relative\" depending on how it appears in the viewport. As a result the element is \"stuck\" when necessary while scrolling.",
links => [
{
title => "HTML5Rocks",
url => "https://developers.google.com/web/updates/2012/08/Stick-your-landings-position-sticky-lands-in-WebKit",
},
{
title => "MDN Web Docs - CSS position",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/position",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/position",
},
{
title => "Polyfill",
url => "https://github.com/dollarshaveclub/stickybits",
},
{
title => "Another polyfill",
url => "https://github.com/wilddeer/stickyfill",
},
{
title => "geddski article: Examples and Gotchas",
url => "https://mastery.games/post/position-sticky/",
},
],
notes => "`sticks` to its nearest ancestor that has a `scrolling mechanism` (created when overflow is hidden, scroll, auto, or overlay), even if that ancestor isn't the nearest actually scrolling ancestor",
notes_by_num => {
1 => "Can be enabled in Firefox by setting the about:config preference layout.css.sticky.enabled to true",
2 => "Enabled through the \"experimental Web Platform features\" flag",
3 => "Not supported on any `table` parts - See [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=975644)",
4 => "Supported on `th` elements, but not `thead` or `tr` - See [Chrome bug](https://bugs.chromium.org/p/chromium/issues/detail?id=702927)",
5 => "Do not appear to support sticky table headers",
6 => "Supported on `th` elements, but not `thead` or `tr` - See [Edge bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/16765952/)",
},
spec => "https://w3c.github.io/csswg-drafts/css-position/#sticky-pos",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #4" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 23 => "n d #2", 37 => "n", 52 => "n d #2", 56 => "a #4", 91 => "y" },
edge => { "5.5" => "n", "16" => "a #6", "79" => "a #4", "91" => "y" },
firefox => { 2 => "n", 26 => "n d #1", 32 => "a #3", 59 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n", "6.0-6.1" => "a x #5", "8" => "y x" },
kaios => { "2.5" => "a #3", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 39 => "n d #2", 42 => "a #4", 78 => "y" },
safari => { "3.1" => "n", "6.1" => "a x #5", "7.1" => "y x", "13" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "wd",
title => "CSS position:sticky",
ucprefix => 0,
},
"css-subgrid" => {
categories => ["CSS"],
chrome_id => 5663795354533888,
description => "Feature of the CSS Grid Layout Module Level 2 that allows a grid-item with its own grid to align in one or both dimensions with its parent grid.",
keywords => "grid-template-columns:subgrid,grid-template-rows:subgrid",
links => [
{
title => "CSS Grid Level 2: Here Comes Subgrid",
url => "https://www.smashingmagazine.com/2018/07/css-grid-2/",
},
{
title => " Why we need CSS subgrid ",
url => "https://dev.to/kenbellows/why-we-need-css-subgrid-53mh",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1240834",
},
{ title => "Chromium support bug", url => "https://crbug.com/618969" },
{
title => "Webkit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=202115",
},
],
notes_by_num => {
1 => "Available behind the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag",
},
spec => "https://www.w3.org/TR/css-grid-2/#subgrids",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 114 => "n d #1", 117 => "y" },
edge => { "5.5" => "n", "114" => "n d #1", "117" => "y" },
firefox => { 2 => "n", 71 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 100 => "n d #1", 103 => "y" },
safari => { "3.1" => "n", "16.0" => "y" },
samsung => { 4 => "n", 24 => "y" },
},
status => "cr",
title => "CSS Subgrid",
ucprefix => 0,
},
"css-supports-api" => {
categories => ["DOM", "JS API"],
chrome_id => 4993981813358592,
description => "The CSS.supports() static method returns a Boolean value indicating if the browser supports a given CSS feature, or not.",
keywords => "conditional",
links => [
{
title => "MDN Web Docs - CSS supports()",
url => "https://developer.mozilla.org/en-US/docs/Web/API/CSS.supports",
},
{
title => "Demo (Chinese)",
url => "https://jsbin.com/rimevilotari/1/edit?html,output",
},
{
title => "Native CSS Feature Detection via the \@supports Rule",
url => "https://dev.opera.com/articles/native-css-feature-detection/",
},
{
title => "CSS \@supports",
url => "https://davidwalsh.name/css-supports",
},
{
title => "Article (Chinese)",
url => "https://blog.csdn.net/hfahe/article/details/8619480",
},
],
notes => "See also [\@supports in CSS](css-featurequeries)",
notes_by_num => {
1 => "Partial support in Presto-based Opera browsers refers to using an older API (`window.supportsCSS`)",
2 => "Does not support parentheses-less one-argument version.",
},
spec => "https://w3c.github.io/csswg-drafts/css-conditional/#the-css-interface",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 28 => "a #2", 61 => "y" },
edge => { "5.5" => "n", "12" => "a #2", "79" => "y" },
firefox => { 2 => "n", 20 => "n d", 22 => "a #2", 55 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { "10" => "n", "12.1" => "a #1", "80" => "y" },
opera => { "9" => "n", "12.1" => "a #1", "15" => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS.supports() API",
ucprefix => 0,
},
"css-table" => {
categories => ["CSS2"],
description => "Method of displaying elements as tables, rows, and cells. Includes support for all `display: table-*` properties as well as `display: inline-table`",
keywords => "display:table,table-cell,table-row,table-layout",
links => [
{
title => "Blog post on usage",
url => "https://www.onenaught.com/posts/201/use-css-displaytable-for-layout",
},
],
notes_by_num => { 1 => "Firefox 2 does not support `inline-table`" },
spec => "https://www.w3.org/TR/CSS21/tables.html",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "y" },
firefox => { 2 => "a #1", 3 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS Table display",
ucprefix => 0,
},
"css-text-align-last" => {
categories => ["CSS3"],
description => "CSS property to describe how the last line of a block or a line right before a forced line break when `text-align` is `justify`.",
keywords => "text align last",
links => [
{
title => "MDN Web Docs - CSS text-align-last",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-align-last",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=146772",
},
],
notes_by_num => {
1 => "In Internet Explorer, the start and end values are not supported.",
2 => "Enabled through the \"Enable Experimental Web Platform Features\" flag in chrome://flags",
3 => "Enabled through the \"Enable Experimental Web Platform Features\" flag in opera://flags",
},
spec => "https://www.w3.org/TR/css3-text/#text-align-last-property",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 35 => "n d #2", 47 => "y" },
edge => { "5.5" => "a #1", "12" => "a", "79" => "y" },
firefox => { 2 => "n", 12 => "y x", 49 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 22 => "n d #3", 34 => "y" },
safari => { "3.1" => "n", "16.0" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "cr",
title => "CSS3 text-align-last",
ucprefix => 0,
},
"css-text-box-trim" => {
categories => ["CSS"],
chrome_id => 5174589850648576,
description => "CSS `text-box` (and it\x{2019}s longhands `text-box-trim` & `text-box-edge`) provide the ability to trim extra space over/under text glyphs at the start/end of a block to match specific font-provided metrics. This allows for more precise alignment and positioning of text. ",
keywords => "leading-trim,text-edge",
links => [
{
title => "Document with examples of text-box-trim uses",
url => "https://github.com/jantimon/text-box-trim-examples",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/leading-trim-the-future-of-digital-typesetting/",
},
],
notes_by_num => {
1 => "Available behind a [Safari feature flag](https://developer.apple.com/documentation/safari-developer-tools/feature-flag-settings).",
2 => "Can be enabled via the `#text-box-trim` flag in `chrome://flags`",
},
spec => "https://w3c.github.io/csswg-drafts/css-inline-3/#propdef-leading-trim",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 128 => "n d #2", 133 => "y" },
edge => { "5.5" => "n", "128" => "n d #2", "132" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "n d #1", "18.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 117 => "n d #2" },
safari => { "3.1" => "n", "16.4" => "n d #1", "18.2" => "y" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS Text Box",
ucprefix => 0,
},
"css-text-indent" => {
categories => ["CSS"],
description => "The `text-indent` property applies indentation to lines of inline content in a block.",
keywords => "each-line,hanging",
links => [
{
title => "MDN Web Docs - CSS text-indent",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=784648",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=112755",
},
{
title => "Article on using text-indent for image replacement",
url => "https://www.sitepoint.com/css-image-replacement-text-indent-negative-margins-and-more/",
},
],
notes_by_num => {
1 => "Partial support refers to supporting a `<length>` value, but not the `each-line` or `hanging` keywords.",
2 => "Support for `each-line` & `hanging` is available behind the Experimental Web Platform features flag",
},
spec => "https://w3c.github.io/csswg-drafts/css-text-3/#text-indent-property",
stats => {
and_chr => { "2.1" => "a #1", "135" => "a #1 #2" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #1 #2" },
and_uc => { "15.5" => "a #1 #2" },
baidu => { "13.52" => "a #1 #2" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 38 => "a #1 #2" },
edge => { "5.5" => "a #1", "79" => "a #1 #2" },
firefox => { 2 => "a #1", 121 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "a #1", "16.0" => "y" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "a #1" },
op_mob => { 10 => "a #1", 80 => "a #1 #2" },
opera => { 9 => "a #1", 25 => "a #1 #2" },
safari => { "3.1" => "a #1", "16.0" => "y" },
samsung => { "4" => "a #1", "5.0-5.4" => "a #1 #2" },
},
status => "cr",
title => "CSS text-indent",
ucprefix => 0,
},
"css-text-justify" => {
categories => ["CSS"],
description => "CSS property to define how text should be justified when `text-align: justify` is set.",
links => [
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=248894",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=99945",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=276079",
},
],
notes_by_num => {
1 => "Supports `inter-word`, but not `inter-character` or `none`. Also supports the following unofficial values: `distribute`, `distribute-all-lines`, `distribute-center-last`, `inter-cluster`, `inter-ideograph`, `newspaper`. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-justify) for details.",
2 => "`inter-word` and `distribute` values supported behind the \"Experimental platform features\" flag but `distribute` support [is buggy](https://bugs.chromium.org/p/chromium/issues/detail?id=467406)",
3 => "Behind the \"layout.css.text-justify.enabled\" flag",
4 => "Supports `auto`, `none`, `inter-word`, `inter-character`, and `distribute` with the exact same meaning and behavior as `inter-character` for legacy reasons.",
},
spec => "https://w3c.github.io/csswg-drafts/css-text-3/#text-justify-property",
stats => {
and_chr => { "2.1" => "n", "135" => "n d #2" },
and_ff => { 137 => "y #4" },
and_qq => { "14.9" => "n d #2" },
and_uc => { "15.5" => "n d #2" },
baidu => { "13.52" => "n d #2" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "n d #2" },
edge => { "5.5" => "u", "8" => "a #1", "79" => "n d #2" },
firefox => { 2 => "n", 54 => "n d #3 #4", 55 => "y #4" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y #4" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "n d #2" },
opera => { 9 => "n", 30 => "n d #2" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "n d #2" },
},
status => "cr",
title => "CSS text-justify",
ucprefix => 0,
},
"css-text-orientation" => {
categories => ["CSS"],
description => "The CSS `text-orientation` property specifies the orientation of text within a line. Current values only have an effect in vertical typographic modes (defined with the `writing-mode` property)",
links => [
{
title => "CSS text-orientation on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-orientation",
},
],
notes_by_num => {
1 => "Can be enabled on firefox via the 'layout.css.vertical-text.enabled' flag in about:config.",
},
spec => "https://w3c.github.io/csswg-drafts/css-writing-modes-3/#text-orientation",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 48 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 38 => "n d #1", 41 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 35 => "y" },
safari => { "3.1" => "n", "10" => "u", "10.1" => "y x", "14" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "rec",
title => "CSS text-orientation",
ucprefix => 0,
},
"css-text-wrap-balance" => {
categories => ["CSS"],
chrome_id => 5196960707903488,
description => "Allows multiple lines of text to have their lines broken in such a way that each line is roughly the same width, often used to make headlines more readable and visually appealing.",
keywords => "balanced",
links => [
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=249840",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1731541",
},
{
title => "Blog post",
url => "https://dev.to/hunzaboy/text-balance-in-css-is-coming-17e3",
},
{ title => "Polyfill", url => "https://github.com/adobe/balance-text" },
],
notes_by_num => {
1 => "Only supports text-wrap: balance, not text-wrap-style: balance.",
},
spec => "https://www.w3.org/TR/css-text-4/#text-wrap",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 114 => "a #1", 130 => "y" },
edge => { "5.5" => "n", "114" => "a #1", "130" => "y" },
firefox => { 2 => "n", 121 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.5" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 99 => "a #1", 116 => "y" },
safari => { "3.1" => "n", "17.5" => "y" },
samsung => { 4 => "n", 23 => "a #1" },
},
status => "wd",
title => "CSS text-wrap: balance",
ucprefix => 0,
},
"css-textshadow" => {
categories => ["CSS3"],
description => "Method of applying one or more shadow or blur effects to text",
keywords => "text shadow",
links => [
{
title => "Mozilla hacks article",
url => "https://hacks.mozilla.org/2009/06/text-shadow/",
},
{
title => "Live editor",
url => "https://testdrive-archive.azurewebsites.net/Graphics/hands-on-css3/hands-on_text-shadow.htm",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/text-shadow",
},
],
notes => "Opera Mini ignores the blur-radius set, so no blur effect is visible. Text-shadow behavior can be somewhat emulated in older IE versions using the non-standard \"dropshadow\" or \"glow\" filters.",
notes_by_num => {
1 => "IE 10+ supports a fourth length value for the shadow's \"spread\". This is not (yet) part of the specification.",
2 => "Partial support in Safari 3.* refers to not supporting multiple shadows.",
},
spec => "https://www.w3.org/TR/css-text-decor-3/#text-shadow-property",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a", 10 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "10" => "y #1", "79" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "y #1" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "a #2", "4" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 Text-shadow",
ucprefix => 0,
},
"css-touch-action" => {
categories => ["CSS"],
chrome_id => 5912074022551552,
description => "touch-action is a CSS property that controls filtering of gesture events, providing developers with a declarative mechanism to selectively disable touch scrolling (in one or both axes) or double-tap-zooming.",
keywords => "touch action",
links => [
{
title => "300ms tap delay, gone away",
url => "https://developer.chrome.com/blog/300ms-tap-delay-gone-away/",
},
{
title => "What Exactly Is..... The 300ms Click Delay",
url => "https://www.telerik.com/blogs/what-exactly-is.....-the-300ms-click-delay",
},
{
title => "MDN Web Docs - CSS touch-action",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action",
},
],
notes_by_num => {
1 => "Supported in Firefox behind the `layout.css.touch_action.enabled` flag, Firefox for Windows 8 Touch ('Metro') enabled by default.",
2 => "Supported non-standard properties `double-tap-zoom`, `cross-slide-x`, `cross-slide-y`.",
3 => "Only supported `auto` and `manipulation`.",
4 => "Not applicable to platforms that do not support pointer or touch events.",
5 => "Not applicable to platforms that do not support touch events.",
},
spec => "https://www.w3.org/TR/pointerevents/#the-touch-action-css-property",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 36 => "y" },
edge => { "5.5" => "n", "10" => "y x #2", "11" => "y" },
firefox => { 2 => "n", 29 => "n d #1", 52 => "y #4", 57 => "y" },
ie_mob => { 10 => "y x #2", 11 => "y" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n", "9.3" => "a #3" },
kaios => { "2.5" => "n d #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 23 => "y" },
safari => { "3.1" => "n #5" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS touch-action property",
ucprefix => 0,
},
"css-transitions" => {
categories => ["CSS3"],
description => "Simple method of animating certain properties of an element, with ability to define property, duration, delay and timing function. ",
keywords => "css transition,transitionend,transition-property,transition-duration,transition-timing-function,transition-delay,steps,step-start,step-end,cubic-bezier",
links => [
{
title => "Article on usage",
url => "https://www.webdesignerdepot.com/2010/01/css-transitions-101/",
},
{
title => "Examples on timing functions",
url => "https://www.the-art-of-web.com/css/timing-function/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/transition",
},
{
title => "MDN - CSS transitions",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_transitions",
},
],
notes => "Support listed is for `transition` properties as well as the `transitionend` event.",
notes_by_num => {
1 => "Does not support the `steps()`, `step-start` & `step-end` timing functions",
},
spec => "https://www.w3.org/TR/css3-transitions/",
stats => {
and_chr => { "2.1" => "y x", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x", 10 => "y" },
chrome => { 4 => "y x", 26 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "a x #1", 5 => "y x", 16 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a x #1", "6.0-6.1" => "y x", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "a x #1", "12" => "y x", "12.1" => "y" },
opera => { "9" => "n", "10.5" => "a x #1", "12" => "y x", "12.1" => "y" },
safari => { "3.1" => "a x #1", "5.1" => "y x", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS3 Transitions",
ucprefix => 0,
},
"css-unset-value" => {
categories => ["CSS"],
description => "A CSS value that's the same as \"inherit\" if a property is inherited or \"initial\" if a property is not inherited.",
keywords => "CSS,unset,value",
links => [
{
title => "MDN Web Docs - CSS unset",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/unset",
},
{
title => "Resetting styles using `all: unset`",
url => "https://mcc.id.au/blog/2013/10/all-unset",
},
{
title => "WebKit bug 148614: Add support for the `unset` CSS property value",
url => "https://bugs.webkit.org/show_bug.cgi?id=148614",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-cascade-3/#inherit-initial",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 27 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 28 => "y" },
safari => { "3.1" => "n", "9.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS unset value",
ucprefix => 0,
},
"css-variables" => {
categories => ["CSS3"],
chrome_id => 6401356696911872,
description => "Permits the declaration and usage of cascading variables in stylesheets.",
keywords => "css variables,cssvariables,vars,custom properties,var(),--var",
links => [
{
title => "Mozilla hacks article (older syntax)",
url => "https://hacks.mozilla.org/2013/12/css-variables-in-firefox-nightly/",
},
{
title => "MDN Web Docs - Using CSS variables",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables",
},
{
title => "Edge Dev Blog post",
url => "https://blogs.windows.com/msedgedev/2017/03/24/css-custom-properties/",
},
{
title => "Polyfill for IE11",
url => "https://github.com/nuxodin/ie11CustomProperties",
},
],
notes_by_num => {
1 => "Enabled through the \"Experimental Web Platform features\" flag in `chrome://flags`",
2 => "Partial support is due to bugs present (see known issues)",
},
spec => "https://www.w3.org/TR/css-variables/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 48 => "n d #1", 49 => "y" },
edge => { "5.5" => "n", "15" => "a #2", "16" => "y" },
firefox => { 2 => "n", 31 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n", "9.3" => "a #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 35 => "n d #1", 36 => "y" },
safari => { "3.1" => "n", "9.1" => "a #2", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "cr",
title => "CSS Variables (Custom Properties)",
ucprefix => 0,
},
"css-when-else" => {
categories => ["CSS"],
description => "Syntax allowing CSS conditions (like media and support queries) to be written more simply, as well as making it possible to write mutually exclusive rules using `\@else` statements.",
links => [
{
title => "Blog post: Extending CSS when/else chains: A first look",
url => "https://blog.logrocket.com/extending-css-when-else-chains-first-look/",
},
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1282896",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1747727",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=234701",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-conditional-5/#when-rule",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "wd",
title => "CSS \@when / \@else conditional rules",
ucprefix => 0,
},
"css-widows-orphans" => {
categories => ["CSS"],
description => "CSS properties to control when lines break across pages or columns by defining the amount of lines that must be left before or after the break.",
links => [
{
title => "CSS last-line: Controlling Widows & Orphans",
url => "https://thenewcode.com/946/CSS-last-line-Controlling-Widows-amp-Orphans",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=137367",
},
{
title => "codrops article on orphans",
url => "https://tympanus.net/codrops/css_reference/orphans/",
},
{
title => "codrops article on widows",
url => "https://tympanus.net/codrops/css_reference/widows/",
},
],
notes => "Some older WebKit-based browsers recognize the properties, but do not appear to have actual support",
notes_by_num => {
1 => "Supports widows & orphans properties, but due to not supporting CSS multi-columns the support is only for page breaks (for print)",
},
spec => "https://w3c.github.io/csswg-drafts/css-break-3/#widows-orphans",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 25 => "y" },
edge => { "5.5" => "n", "8" => "y #1", "10" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { 9 => "y #1", 12 => "y" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS widows & orphans",
ucprefix => 0,
},
"css-writing-mode" => {
categories => ["CSS"],
description => "Property to define whether lines of text are laid out horizontally or vertically and the direction in which blocks progress.",
keywords => "css,writing,direction,i18n,vertical,ltr,rtl",
links => [
{
title => "MDN Web Docs - CSS writing-mode",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/writing-mode",
},
{
title => "Chrome Platform Status",
url => "https://www.chromestatus.com/feature/5707470202732544",
},
],
notes_by_num => {
1 => "Internet Explorer supports different values from an [earlier version of the spec](https://www.w3.org/TR/2003/CR-css3-text-20030514/#Progression), which originated from SVG.",
2 => "Supported in Firefox under the `layout.css.vertical-text.enabled` flag",
},
spec => "https://w3c.github.io/csswg-drafts/css-writing-modes-3/#block-flow",
stats => {
and_chr => { "2.1" => "n", "3" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "n", 7 => "u", 8 => "y x", 48 => "y" },
edge => { "5.5" => "a #1", "12" => "y" },
firefox => { 2 => "n", 36 => "n d #2", 41 => "y" },
ie_mob => { 10 => "a x" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "u", "5.0-5.1" => "y x" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 35 => "y" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "y x", "11" => "y" },
samsung => { "4" => "y x", "5.0-5.4" => "y" },
},
status => "rec",
title => "CSS writing-mode property",
ucprefix => 0,
},
"css-zoom" => {
categories => ["CSS"],
description => "Method of scaling content while also affecting layout.",
keywords => "-ms-zoom,transform,-moz-transform,-ms-transform,-webkit-transform,-o-transform,scale,css-transforms",
links => [
{
title => "CSS Tricks",
url => "https://css-tricks.com/almanac/properties/z/zoom/",
},
{
title => "Safari Developer Library",
url => "https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266-SW1",
},
{
title => "Article explaining usage of zoom as the hack for fixing rendering bugs in IE6 and IE7.",
url => "https://web.archive.org/web/20160809134322/http://www.satzansatz.de/cssd/onhavinglayout.html",
},
{
title => "MDN Web Docs - CSS zoom",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/zoom",
},
],
notes => "Originally implemented only in Internet Explorer. Note that `transform: scale()` does not work the same as `zoom`. If e.g. `transform: scale(0.6)` is used on the `html` or `body` element then it resizes the entire page, showing a minified page with huge white margins around it, whereas `zoom: 0.6` scales the *elements* on the page, but not the page itself on which the elements are drawn.",
notes_by_num => {
1 => "The `-ms-zoom` property is an extension to CSS, and can be used as a synonym for `zoom` in IE8 Standards mode.",
},
spec => "https://drafts.csswg.org/css-viewport/#zoom-property",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "y", "8" => "y #1", "12" => "y" },
firefox => { 2 => "n", 126 => "y" },
ie_mob => { 10 => "y #1" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS zoom",
ucprefix => 0,
},
"css3-attr" => {
categories => ["CSS"],
chrome_id => 4680129030651904,
description => "While `attr()` is supported for effectively all browsers for the `content` property, CSS Values and Units Level 5 adds the ability to use `attr()` on **any** CSS property, and to use it for non-string values (e.g. numbers, colors).",
keywords => "attr,attribute,function",
links => [
{
title => "MDN Web Docs - CSS attr",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/attr",
},
{
title => "Mozilla Bug #435426: implement css3-values extensions to `attr()`",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=435426",
},
{
title => "Chromium issue #246571: Implement CSS3 attribute / attr references",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=246571",
},
{
title => "WebKit Bug #26609: Support CSS3 attr() function",
url => "https://bugs.webkit.org/show_bug.cgi?id=26609",
},
],
notes => "See the [generated content](/css-gencontent) table for support for `attr()` for the `content` property.",
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-values-5/#attr-notation",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 133 => "y" },
edge => { "5.5" => "n", "133" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "CSS3 attr() function for all properties",
ucprefix => 0,
},
"css3-boxsizing" => {
categories => ["CSS3"],
description => "Method of specifying whether or not an element's borders and padding should be included in size units",
keywords => "border-box,content-box",
links => [
{
title => "MDN Web Docs - CSS box-sizing",
url => "https://developer.mozilla.org/En/CSS/Box-sizing",
},
{
title => "Blog post",
url => "https://www.456bereastreet.com/archive/201104/controlling_width_with_css3_box-sizing/",
},
{
title => "Polyfill for IE",
url => "https://github.com/Schepp/box-sizing-polyfill",
},
{ title => "CSS Tricks", url => "https://css-tricks.com/box-sizing/" },
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/box-sizing",
},
],
notes => "Firefox versions before 57 also supported the `padding-box` value for `box-sizing`, though this value was been removed from the specification and later versions of the browser.",
notes_by_num => {},
spec => "https://www.w3.org/TR/css-sizing/#box-sizing",
stats => {
and_chr => { "2.1" => "y x", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x", 10 => "y" },
chrome => { 4 => "y x", 10 => "y" },
edge => { "5.5" => "p", "8" => "y" },
firefox => { 2 => "y x", 29 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y x", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "y x", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS3 Box-sizing",
ucprefix => 0,
},
"css3-colors" => {
categories => ["CSS3"],
description => "Method of describing colors using Hue, Saturation and Lightness (hsl()) rather than just RGB, as well as allowing alpha-transparency with rgba() and hsla().",
keywords => "rgb,hsl,rgba,hsla",
links => [
{
title => "Dev.Opera article",
url => "https://dev.opera.com/articles/view/color-in-opera-10-hsl-rgb-and-alpha-transparency/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/color#RGBA_Notation",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-color/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "a", 3 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "n", "9.5-9.6" => "a" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS3 Colors",
ucprefix => 0,
},
"css3-cursors" => {
categories => ["CSS3"],
description => "CSS3 cursor values added in the 2004 spec, including none, context-menu, cell, vertical-text, alias, copy, no-drop, not-allowed, nesw-resize, nwse-resize, col-resize, row-resize and all-scroll. ",
keywords => "cursors, pointers",
links => [
{
title => "MDN Web Docs - CSS cursor",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/cursor",
},
],
notes_by_num => {
1 => "Partial support refers to no support for the alias, cell, copy, ew-resize, ns-resize, nesw-resize, nwse-resize or context-menu cursors.",
2 => "Partial support refers to not supporting 'none'.",
},
spec => "https://www.w3.org/TR/css3-ui/#cursor",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "u" },
chrome => { 4 => "a", 5 => "y" },
edge => { "5.5" => "a #1", "9" => "y", "12" => "a #2", "14" => "y" },
firefox => { 2 => "a", 4 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "a #2", 15 => "y" },
safari => { "3.1" => "a", "5" => "y" },
samsung => { 4 => "n" },
},
status => "rec",
title => "CSS3 Cursors (original values)",
ucprefix => 0,
},
"css3-cursors-grab" => {
categories => ["CSS3"],
description => "Support for the `grab` & `grabbing` values for the `cursor` property. Used to indicate that something can be grabbed (dragged to be moved).",
links => [
{
title => "MDN Web Docs - CSS cursor",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/cursor",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-ui/#cursor",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "y x", 68 => "y" },
edge => { "5.5" => "n", "15" => "y" },
firefox => { 2 => "y x", 27 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "11.6" => "y", "15" => "y x", "55" => "y" },
safari => { "3.1" => "y x", "11" => "y" },
samsung => { 4 => "n" },
},
status => "rec",
title => "CSS grab & grabbing cursors",
ucprefix => 0,
},
"css3-cursors-newer" => {
categories => ["CSS3"],
description => "Support for `zoom-in`, `zoom-out` values for the CSS3 `cursor` property.",
keywords => "cursors, pointers",
links => [
{
title => "MDN Web Docs - CSS cursor",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/cursor",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-ui/#cursor",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "y x", 37 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "y x", 24 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "11.6" => "y", "15" => "y x", "24" => "y" },
safari => { "3.1" => "y x", "9" => "y" },
samsung => { 4 => "n" },
},
status => "rec",
title => "CSS3 Cursors: zoom-in & zoom-out",
ucprefix => 0,
},
"css3-tabsize" => {
categories => ["CSS3"],
description => "Method of customizing the width of the tab character. Only effective using 'white-space: pre', 'white-space: pre-wrap', and 'white-space: break-spaces'.",
keywords => "tab-size,tab-width",
links => [
{
title => "MDN Web Docs - CSS tab-size",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/tab-size",
},
{
title => "Firefox bug to unprefix `-moz-tab-size`",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=737785",
},
],
notes_by_num => {
1 => "Partial refers to supporting `<integer>` but not `<length>` values.",
},
spec => "https://www.w3.org/TR/css3-text/#tab-size",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "n", 21 => "a #1", 42 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 4 => "a x #1", 53 => "y x", 91 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.4-13.7" => "y", "3.2" => "n", "7.0-7.1" => "a #1" },
kaios => { "2.5" => "a x #1" },
op_mini => { all => "a x #1" },
op_mob => { 10 => "n", 11 => "a x #1", 80 => "y" },
opera => { "9" => "n", "10.6" => "a x #1", "15" => "a #1", "29" => "y" },
safari => { "3.1" => "n", "6.1" => "a #1", "13.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 tab-size",
ucprefix => 0,
},
"currentcolor" => {
categories => ["CSS"],
description => "A CSS value that will apply the existing `color` value to other properties like `background-color`, etc. ",
links => [
{
title => "MDN Web Docs - CSS currentColor",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentColor_keyword",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/currentcolor/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-color/#currentcolor",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS currentColor value",
ucprefix => 0,
},
"custom-elements" => {
categories => ["DOM", "HTML5"],
chrome_id => 4642138092470272,
description => "Original V0 version of the custom elements specification. See [Custom Elements V1](#feat=custom-elementsv1) for support for the latest version. ",
keywords => "document.registerElement",
links => [
{
title => "Blog post on upgrading from V0 to V1",
url => "https://developer.chrome.com/blog/web-components-time-to-upgrade/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/2016/WD-custom-elements-20160226/",
stats => {
and_chr => { "135" => "n", "2.1" => "n", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 27 => "n d", 33 => "y", 80 => "n" },
edge => { "5.5" => "n", "10" => "p", "79" => "y", "80" => "n" },
firefox => { 2 => "n", 23 => "n d", 30 => "p d", 59 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "p" },
kaios => { "2.5" => "p d", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 15 => "n d", 20 => "y", 67 => "n" },
safari => { "3.1" => "n", "6" => "p" },
samsung => { "4" => "y", "13.0" => "n" },
},
status => "unoff",
title => "Custom Elements (deprecated V0 spec)",
ucprefix => 0,
},
"custom-elementsv1" => {
categories => ["DOM", "HTML5"],
chrome_id => "4696261944934400,4670146924773376",
description => "One of the key features of the Web Components system, custom elements allow new HTML tags to be defined.",
keywords => "webcomponents,customelements",
links => [
{
title => "Google Developers - Custom elements v1: reusable web components",
url => "https://developers.google.com/web/fundamentals/primers/customelements/",
},
{
title => "customElements.define polyfill",
url => "https://github.com/webcomponents/polyfills/tree/master/packages/custom-elements",
},
{
title => "WebKit Blog: Introducing Custom Elements",
url => "https://webkit.org/blog/7027/introducing-custom-elements/",
},
],
notes_by_num => {
1 => "Supports \"Autonomous custom elements\" but not \"Customized built-in elements\" see [WebKit bug 182671](https://bugs.webkit.org/show_bug.cgi?id=182671).",
2 => "Enabled through the `dom.webcomponents.enabled` preference in `about:config`.",
3 => "Enabled through the `dom.webcomponents.customelements.enabled` preference in `about:config`.",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#custom-elements",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 52 => "p", 54 => "a #1", 67 => "y" },
edge => { "5.5" => "n", "10" => "p", "79" => "y" },
firefox => { 2 => "n", 30 => "p", 50 => "p d #2 #1", 59 => "p d #3 #1", 63 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "a #1" },
kaios => { "2.5" => "p", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 41 => "a #1", 64 => "y" },
safari => { "3.1" => "n", "8" => "p", "10.1" => "a #1" },
samsung => { "4" => "n", "5.0-5.4" => "a #1", "6.2-6.4" => "y" },
},
status => "ls",
title => "Custom Elements (V1)",
ucprefix => 0,
},
"customevent" => {
categories => ["DOM", "JS API"],
description => "A DOM event interface that can carry custom application-defined data.",
keywords => "custom events,custom,event",
links => [
{
title => "MDN Web Docs - CustomEvent",
url => "https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent",
},
{
title => "Polyfill based on the MDN snippet",
url => "https://github.com/krambuhl/custom-event-polyfill",
},
{
title => "EventListener polyfill which includes a CustomEvent polyfill",
url => "https://github.com/jonathantneal/EventListener",
},
],
notes => "Not supported in some versions of Android's old WebKit-based WebView.",
notes_by_num => {
1 => "While a `window.CustomEvent` object exists, it cannot be called as a constructor. Instead of `new CustomEvent(...)`, you must use `e = document.createEvent('CustomEvent')` and then `e.initCustomEvent(...)`",
2 => "There is no `window.CustomEvent` object, but `document.createEvent('CustomEvent')` still works.",
},
spec => "https://dom.spec.whatwg.org/#interface-customevent",
stats => {
and_chr => { "2.1" => "n", "3" => "a #1 #2", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1 #2", 10 => "y" },
chrome => { 4 => "n", 5 => "u", 9 => "a #1 #2", 13 => "u", 15 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "12" => "y" },
firefox => { 2 => "n", 6 => "a #1", 11 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => {
"3.2" => "u",
"4.0-4.1" => "n",
"4.2-4.3" => "u",
"5.0-5.1" => "a #1 #2",
"6.0-6.1" => "y",
},
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "a #1", 12 => "y" },
opera => { "9" => "n", "11" => "a #1", "11.6" => "y" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "a #1 #2", "6" => "u", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "CustomEvent",
ucprefix => 0,
},
"datalist" => {
categories => ["HTML5"],
chrome_id => 6090950820495360,
description => "Method of setting a list of options for a user to select in a text field, while leaving the ability to enter a custom value.",
keywords => "list attribute,input",
links => [
{
title => "Mozilla Hacks article",
url => "https://hacks.mozilla.org/2010/11/firefox-4-html5-forms/",
},
{
title => "HTML5 Library including datalist support",
url => "https://afarkas.github.io/webshim/demos/",
},
{
title => "MDN Web Docs - datalist",
url => "https://developer.mozilla.org/en/HTML/Element/datalist",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/datalist",
},
{
title => "Eiji Kitamura's options demos & tests",
url => "https://demo.agektmr.com/datalist/",
},
{
title => "Minimal Datalist polyfill w/tutorial",
url => "https://github.com/thgreasi/datalist-polyfill",
},
{
title => "Minimal and library dependency-free vanilla JavaScript polyfill",
url => "https://github.com/mfranzke/datalist-polyfill",
},
],
notes => "While most commonly used on text fields, datalists can also be used on other input types. IE11 supports the element on `range` fields. Chrome and Opera also support datalists to suggest given values on `range`, `color` and date/time fields. ",
notes_by_num => {
1 => "Partial support refers to [a bug](https://bugs.chromium.org/p/chromium/issues/detail?id=773041) where long lists of items are unscrollable resulting in unselectable options.",
2 => "Partial support in IE refers to [significantly buggy behavior](https://web.archive.org/web/20170121011936/http://playground.onereason.eu/2013/04/ie10s-lousy-support-for-datalists/) (IE11+ does send the input and change events upon selection). ",
3 => "Partial support refers to no support for datalists on non-text fields (e.g. number, [range](https://bugzilla.mozilla.org/show_bug.cgi?id=841942), [color](https://bugzilla.mozilla.org/show_bug.cgi?id=960984), [date and time](https://bugzilla.mozilla.org/show_bug.cgi?id=1905313)).",
4 => "Partial support in Edge refers [to disappearing option elements on focusing the input element via tab](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/20066595/).",
5 => "Supported through WKWebView and Safari but not through UIWebView",
6 => "In Firefox, autocomplete must be set to off to make dynamic datalist work due to [a bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1474137)",
7 => "Partial support refers to no support for datalists on [date and time](https://bugzilla.mozilla.org/show_bug.cgi?id=1905313) fields.",
8 => "If both a value and label are provided for an option iOS will only display the value as suggested selection. (see [bug](https://bugs.webkit.org/show_bug.cgi?id=289668))",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-datalist-element",
stats => {
and_chr => { "2.1" => "p", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p", 10 => "y" },
chrome => { 4 => "p", 20 => "a #1", 69 => "y" },
edge => { "5.5" => "n", "6" => "p", "10" => "a #2", "16" => "a #2 #4", "79" => "y" },
firefox => { 2 => "p", 4 => "a #3 #6", 102 => "a #3", 110 => "a #7" },
ie_mob => { 10 => "p" },
ios_saf => { "12.2-12.5" => "a #5 #8", "3.2" => "p" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { 9 => "y", 15 => "a #1", 64 => "y" },
safari => { "3.1" => "p", "12.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Datalist element",
ucprefix => 0,
},
"dataset" => {
categories => ["HTML5"],
description => "Method of applying and accessing custom data to elements.",
keywords => "DOMStringMap",
links => [
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/html5-custom-data-attributes/",
},
{
title => "Demo using dataset",
url => "https://html5demos.com/dataset",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/dom.js#dom-dataset",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/attributes/data-*",
},
{
title => "MDN Web Docs - dataset",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset",
},
{
title => "MDN Guide - Using data-* attributes",
url => "https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes",
},
],
notes => "Partial support refers to being able to use `data-*` attributes and access them using `getAttribute`. \r\n\r\n\"Supported\" refers to accessing the values using the `dataset` property. Current spec only refers to support on HTML elements, only some browsers also have support for SVG/MathML elements.",
notes_by_num => {
1 => "While the HTML spec doesn't require it, these browsers also support `dataset` and `data-*` attributes on SVG elements, in compliance with [current plans for SVG2](https://www.w3.org/2015/01/15-svg-minutes.html#item03)",
},
spec => "https://html.spec.whatwg.org/multipage/dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes",
stats => {
and_chr => { "2.1" => "a", "3" => "y #1" },
and_ff => { 137 => "y #1" },
and_qq => { "14.9" => "y #1" },
and_uc => { "15.5" => "y #1" },
baidu => { "13.52" => "y #1" },
bb => { 7 => "y #1" },
chrome => { 4 => "a", 7 => "y #1", 45 => "y", 55 => "y #1" },
edge => { "5.5" => "a", "11" => "y", "17" => "y #1" },
firefox => { 2 => "a", 6 => "y", 51 => "y #1" },
ie_mob => { 10 => "a", 11 => "y" },
ios_saf => { "3.2" => "a", "5.0-5.1" => "y #1" },
kaios => { "2.5" => "y", "3.0-3.1" => "y #1" },
op_mini => { all => "a" },
op_mob => { "10" => "a", "11.1" => "y", "80" => "y #1" },
opera => { "9" => "a", "11.1" => "y", "15" => "y #1", "32" => "y", "42" => "y #1" },
safari => { "3.1" => "a", "5.1" => "y #1" },
samsung => { 4 => "y #1" },
},
status => "ls",
title => "dataset & data-* attributes",
ucprefix => 0,
},
"datauri" => {
categories => ["Other"],
description => "Method of embedding images and other files in webpages as a string of text, generally using base64 encoding.",
keywords => "data url,datauris,data uri,dataurl,dataurls,base64",
links => [
{
title => "Information page",
url => "https://css-tricks.com/data-uris/",
},
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/data_URI_scheme",
},
{
title => "Data URL converter",
url => "https://www.websiteoptimization.com/speed/tweak/inline-images/",
},
{
title => "Information on security issues",
url => "https://klevjers.com/papers/phishing.pdf",
},
],
notes_by_num => {
1 => "Support is limited to images and linked resources like CSS files, not HTML or JS files. Max URI length is 32KB.",
2 => "Support is limited to images and linked resources like CSS or JS, not HTML files. Maximum size limit is 4GB.",
3 => "SVGs with XML declarations are not displayed when used in data-urls",
},
spec => "https://tools.ietf.org/html/rfc2397",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => {
"5.5" => "n",
"8" => "a #1",
"9" => "a #2",
"14" => "a #2 #3",
"15" => "a #2",
"79" => "y",
},
firefox => { 2 => "y" },
ie_mob => { 10 => "a #2" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Data URIs",
ucprefix => 0,
},
"date-tolocaledatestring" => {
categories => ["JS"],
description => "Date method to generate a language sensitive representation of a given date, formatted based on a specified locale and options.",
links => [
{
title => "MDN article on Date\x{200B}.prototype\x{200B}.toLocale\x{200B}Date\x{200B}String()",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString",
},
],
notes_by_num => {
1 => "Does not support the `locale` or `options` parameters",
2 => "Does not support all locales correctly",
3 => "Does not support the `timeZone` option ",
},
spec => "https://tc39.es/ecma402/#sup-date.prototype.tolocaledatestring",
stats => {
and_chr => { "2.1" => "u", "4" => "a #1", "4.4" => "a #2 #3", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 24 => "a #2 #3", 38 => "a #2", 70 => "y" },
edge => { "5.5" => "u", "6" => "a #1", "18" => "y" },
firefox => { 2 => "a #1", 29 => "a #2 #3", 52 => "a #2", 56 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "10.3" => "y", "3.2" => "u", "6.0-6.1" => "a #1" },
kaios => { "2.5" => "a #1", "3.0-3.1" => "y" },
op_mini => { all => "a #1" },
op_mob => { "10" => "u", "12.1" => "a #1", "80" => "y" },
opera => { "9" => "u", "12.1" => "a #1", "15" => "a #2 #3", "25" => "a #2", "57" => "y" },
safari => { "3.1" => "u", "5.1" => "a #1", "10.1" => "a #2", "12" => "y" },
samsung => { "4" => "a #2", "9.2" => "y" },
},
status => "other",
title => "Date.prototype.toLocaleDateString",
ucprefix => 0,
},
"declarative-shadow-dom" => {
categories => ["DOM"],
chrome_id => 5191745052606464,
description => "Proposal to allow rendering elements with shadow dom (aka web components) using server-side rendering.",
links => [
{
title => "Declarative Shadow DOM - web.dev article",
url => "https://web.dev/declarative-shadow-dom/",
},
{
title => "A ponyfill of the Declarative Shadow DOM API",
url => "https://www.npmjs.com/package/\@webcomponents/template-shadowroot",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=249513",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1712140",
},
],
notes_by_num => {
1 => "Uses an older non-standard attribute called `shadowroot` instead of the standardized `shadowrootmode` attribute",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#attr-template-shadowrootmode",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 85 => "n d", 90 => "a #1", 111 => "y" },
edge => { "5.5" => "n", "91" => "a #1", "111" => "y" },
firefox => { 2 => "n", 123 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 77 => "a #1", 97 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { "4" => "n", "15.0" => "u", "16.0" => "a #1", "22" => "y" },
},
status => "ls",
title => "Declarative Shadow DOM",
ucprefix => 0,
},
"decorators" => {
categories => ["JS"],
description => "ECMAScript Decorators are an in-progress proposal for extending JavaScript classes. Decorators use a special syntax, prefixed with an `\@` symbol and placed immediately before the code being extended.",
keywords => "decorators,JavaScript Class and Property Decorators",
links => [
{
title => "JavaScript Decorators: What They Are and When to Use Them",
url => "https://www.sitepoint.com/javascript-decorators-what-they-are/",
},
{
title => "A minimal guide to JavaScript (ECMAScript) Decorators and Property Descriptor of the Object",
url => "https://medium.com/jspoint/a-minimal-guide-to-ecmascript-decorators-55b70338215e",
},
{
title => "Decorators in TypeScript",
url => "https://www.typescriptlang.org/docs/handbook/decorators.html",
},
{
title => "Babel plug-in for decorators",
url => "https://babeljs.io/docs/en/babel-plugin-proposal-decorators",
},
{
title => "Bug on Firefox support",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1781212",
},
],
notes => "While not yet supported natively in browsers, decorators are supported by a number of transpiler tools. ",
notes_by_num => {},
spec => "https://github.com/tc39/proposal-decorators",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Decorators",
ucprefix => 0,
},
"details" => {
categories => ["HTML5"],
chrome_id => 5348024557502464,
description => "The <details> element generates a simple no-JavaScript widget to show/hide element contents, optionally by clicking on its child <summary> element.",
links => [
{
title => "jQuery fallback script",
url => "https://mathiasbynens.be/notes/html5-details-jquery",
},
{ title => "Fallback script", url => "https://gist.github.com/370590" },
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/summary-figcaption-element/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-details",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/details",
},
{
title => "Bug on Firefox support",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=591737",
},
{
title => "Details Element Polyfill",
url => "https://github.com/javan/details-element-polyfill",
},
],
notes_by_num => {
1 => "Enabled in Firefox through the `dom.details_element.enabled` flag",
2 => "'toggle' event is not supported",
3 => "<summary> is not keyboard accessible",
4 => "Some versions of Safari display smaller font-size than intended when using `rem` units with system fonts. (See: https://colloq.io/blog/safaris-detailssummary-rem-font-size-issue)",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-details-element",
stats => {
and_chr => { "2.1" => "p", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p", 10 => "y" },
chrome => { 4 => "p", 12 => "y #2 #3", 19 => "y #2", 36 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "n", "79" => "y" },
firefox => { 2 => "n", 3 => "p", 47 => "n d #1", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y #4", "11.3-11.4" => "y", "3.2" => "p", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "p" },
op_mob => { 10 => "p", 80 => "y" },
opera => { "9" => "p", "11.1" => "n", "15" => "y" },
safari => { "3.1" => "p", "6" => "y #2", "10.1" => "y #4", "12" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Details & Summary elements",
ucprefix => 0,
},
"deviceorientation" => {
categories => ["JS API"],
chrome_id => "5874690627207168,5556931766779904",
description => "API for detecting orientation and motion events from the device running the browser.",
keywords => "ondeviceorientation,ondevicemotion",
links => [
{
title => "HTML5 Rocks tutorial",
url => "https://www.html5rocks.com/en/tutorials/device/orientation/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-orientation",
},
{
title => "DeviceOrientation implementation prototype for IE10",
url => "http://html5labs.interoperabilitybridges.com/prototypes/device-orientation-events/device-orientation-events/info",
},
{
title => "Demo",
url => "https://audero.it/demo/device-orientation-api-demo.html",
},
],
notes => "Partial support refers to the lack of compassneedscalibration event. Partial support also refers to the lack of devicemotion event support for Chrome 30- and Opera. Opera Mobile 14 lost the ondevicemotion event support. Firefox 3.6, 4 and 5 support the non-standard [MozOrientation](https://developer.mozilla.org/en/DOM/MozOrientation) event.",
notes_by_num => {
1 => "`compassneedscalibration` supported in IE11 only for compatible devices with Windows 8.1+.",
},
spec => "https://www.w3.org/TR/orientation-event/",
stats => {
and_chr => { "2.1" => "n", "3" => "a" },
and_ff => { 137 => "a" },
and_qq => { "14.9" => "a" },
and_uc => { "15.5" => "a" },
baidu => { "13.52" => "a" },
bb => { 7 => "n", 10 => "a" },
chrome => { 4 => "n", 7 => "a" },
edge => { "5.5" => "n", "11" => "a #1", "12" => "y", "79" => "a" },
firefox => { "2" => "n", "3.6" => "p", "6" => "a" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n", "4.2-4.3" => "a" },
kaios => { "2.5" => "a" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 12 => "y", 80 => "a" },
opera => { 9 => "n", 15 => "a" },
safari => { "3.1" => "n" },
samsung => { 4 => "a" },
},
status => "cr",
title => "DeviceOrientation & DeviceMotion events",
ucprefix => 0,
},
"devicepixelratio" => {
categories => ["CSS", "DOM"],
description => "Read-only property that returns the ratio of the (vertical) size of one physical pixel on the current display device to the size of one CSS pixel.",
keywords => "device,pixel,ratio,size",
links => [
{
title => "MDN Web Docs - devicePixelRatio",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio",
},
],
notes => "As the page is zoomed in the number of device pixels that one CSS pixel covers increases, and therefore the value of devicePixelRatio will also increase.",
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/cssom-view/#dom-window-devicepixelratio",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "n", 18 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 12 => "y" },
opera => { "9" => "n", "11.6" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Window.devicePixelRatio",
ucprefix => 0,
},
"dialog" => {
categories => ["DOM", "HTML5"],
chrome_id => 5770237022568448,
description => "Method of easily creating custom dialog boxes to display to the user with modal or non-modal options. Also includes a `::backdrop` pseudo-element for behind the element.",
keywords => "HTMLDialogElement,showModal,backdrop",
links => [
{
title => "Polyfill",
url => "https://github.com/GoogleChrome/dialog-polyfill",
},
],
notes_by_num => {
1 => "Supported in Firefox by enabling `dom.dialog_element.enabled` in `about:config`",
2 => "Enabled through the \"Experimental Web Platform features\" flag in `chrome://flags`",
3 => "Enabled through the \"Experimental Web Platform features\" flag in `opera://flags`",
4 => "Enabled by default in Firefox Nightly only",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-dialog-element",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 32 => "n d #2", 37 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 53 => "n d #1", 80 => "n d #1 #4", 98 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 19 => "n d #3", 24 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Dialog element",
ucprefix => 0,
},
"dispatchevent" => {
categories => ["DOM"],
description => "Method to programmatically trigger a DOM event.",
keywords => "dispatch,event,target,fire,trigger,dom",
links => [
{
title => "MDN Web Docs - dispatchEvent",
url => "https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent",
},
{
title => "Financial Times IE8 polyfill",
url => "https://github.com/Financial-Times/polyfill-service/blob/master/polyfills/Event/polyfill-ie8.js",
},
{
title => "WebReflection ie8 polyfill",
url => "https://github.com/WebReflection/ie8",
},
],
notes_by_num => {
1 => "Supports Microsoft's proprietary [`EventTarget.fireEvent() method`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/fireEvent).",
},
spec => "https://dom.spec.whatwg.org/#dom-eventtarget-dispatchevent",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "u", "6" => "n #1", "9" => "y #1", "11" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y #1", 11 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "u", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "EventTarget.dispatchEvent",
ucprefix => 0,
},
"dnssec" => {
categories => ["Security"],
description => "Method of validating a DNS response against a trusted root server. Mitigates various attacks that could reroute a user to a fake site while showing the real URL for the original site.",
keywords => "DNS Security Extensions,Domain Name System Security Extensions,DNS based Authentication of Named Entities,TLSA",
links => [
{
title => "Wikipedia - DNSSEC",
url => "https://en.wikipedia.org/wiki/Domain_Name_System_Security_Extensions",
},
{
title => "Chrome implementation bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=50874",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=672600",
},
],
notes => "Browsers have generally decided to not implement DNSSEC validation because the added complexity outweighs the improvements to the browser. DNSSEC is still useful as it is widely used to protect delivery of records between DNS servers, only failing to protect the delivery from the last DNS server to the browser.\r\n\r\n[Certificate transparency](https://developer.mozilla.org/en-US/docs/Web/Security/Certificate_Transparency) is widely used and tries to provide the same security as DNSSEC but by very different means.",
notes_by_num => {
1 => "Does not support DNSSEC but still benefits greatly from it, as most of the security improvements are gained in the DNS-network and not in the browser.",
2 => "Early versions of Chrome [experimented](https://www.imperialviolet.org/2011/06/16/dnssecchrome.html) with browser-level validation.",
},
spec => "https://tools.ietf.org/html/rfc4033",
stats => {
and_chr => { "2.1" => "a #1" },
and_ff => { 137 => "a #1" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "a #1" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 6 => "a #1 #2", 31 => "a #1" },
edge => { "5.5" => "a #1" },
firefox => { 2 => "a #1" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "a #1" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "a #1" },
op_mob => { 10 => "a #1" },
opera => { 9 => "a #1" },
safari => { "3.1" => "a #1" },
samsung => { 4 => "a #1" },
},
status => "other",
title => "DNSSEC and DANE",
ucprefix => 0,
},
"do-not-track" => {
categories => ["JS API"],
description => "API to allow the browser's Do Not Track setting to be queried via `navigator.doNotTrack`. Due to lack of adoption the Do Not Track specification was deprecated in 2018.",
keywords => "DNT",
links => [
{
title => "MDN Web Docs - doNotTrack",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Navigator/doNotTrack",
},
],
notes => "Partial support refers to the doNotTrack field being misnamed, or being attached to an object other than `navigator` (e.g. `window`).",
notes_by_num => {
1 => "IE 9 and 10 are vendor-prefixed as `navigator.msDoNotTrack`",
2 => "IE 11 and Edge 16- use `window.doNotTrack` instead of `navigator.doNotTrack`.",
3 => "Browsers based on Gecko versions prior to 32 used 'yes' and 'no' rather than '1' and '0'.",
4 => "Between versions 6.1.1 and 9.1.3, Safari supported an ultimately-rejected amendment to the spec, using `window.doNotTrack` rather than `navigator.doNotTrack`.",
},
spec => "https://www.w3.org/TR/tracking-dnt/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "a #4" },
chrome => { 4 => "n", 23 => "y" },
edge => { "5.5" => "n", "9" => "a x #1", "11" => "a #2", "17" => "y" },
firefox => { 2 => "n", 9 => "a #3", 32 => "y" },
ie_mob => { 10 => "a x #1", 11 => "a #2" },
ios_saf => { "12.2-12.5" => "n", "3.2" => "n", "7.0-7.1" => "a #4", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "u", "12.1" => "y" },
opera => { 9 => "n", 12 => "y" },
safari => { "3.1" => "n", "5.1" => "y", "6.1" => "a #4", "9.1" => "y", "12.1" => "n" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "Do Not Track API",
ucprefix => 0,
},
"document-currentscript" => {
categories => ["JS API"],
description => "`document.currentScript` returns the `<script>` element whose script is currently being processed.",
links => [
{
title => "Polyfill (IE 6-10 only)",
url => "https://github.com/JamesMGreene/document.currentScript",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/dom.html#dom-document-currentscript",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 29 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 16 => "y" },
safari => { "3.1" => "n", "8" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "document.currentScript",
ucprefix => 0,
},
"document-evaluate-xpath" => {
categories => ["DOM", "JS API"],
description => "Allow nodes in an XML/HTML document to be traversed using XPath expressions. ",
keywords => "dom l3 xpath,dom level 3",
links => [
{
title => "XPath in Javascript: Introduction",
url => "https://timkadlec.com/2008/02/xpath-in-javascript-introduction/",
},
{
title => "MDN Web Docs - XPath introduction",
url => "https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript",
},
{
title => "Edge team article on implementation",
url => "https://blogs.windows.com/msedgedev/2015/03/19/improving-interoperability-with-dom-l3-xpath/",
},
{
title => "DOM XPath - WHATWG Wiki",
url => "https://wiki.whatwg.org/wiki/DOM_XPath",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/DOM-Level-3-XPath/xpath.html#XPathEvaluator-evaluate",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "u", 3 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "document.evaluate & XPath",
ucprefix => 0,
},
"document-execcommand" => {
categories => ["JS API"],
description => "Allows running commands to manipulate the contents of an editable region in a document switched to designMode",
keywords => "document,text,editor,commands,designMode",
links => [
{
title => "MDN Web Docs - execCommand",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand",
},
{
title => "execCommand and queryCommandSupported demo",
url => "https://codepen.io/netsi1964/pen/QbLLGW",
},
],
notes => "To determine what commands are supported, see `Document.queryCommandSupported()`",
notes_by_num => {},
spec => "https://w3c.github.io/editing/execCommand.html#execcommand()",
stats => {
and_chr => { "2.1" => "n", "4.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "y" },
firefox => { 2 => "n", 9 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n", "4.2-4.3" => "u", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "u" },
safari => { "3.1" => "u", "6" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "Document.execCommand()",
ucprefix => 0,
},
"document-policy" => {
categories => ["Other", "Security"],
chrome_id => "5645593894453248,5756689661820928",
description => "A mechanism that allows developers to set certain rules and policies for a given site. The rules can change default browser behaviour, block certain features or set limits on resource usage. Document Policy is useful both for security and performance, and is similar to [Permissions Policy](/permissions-policy).",
keywords => "feature,security,header,policy,attribute,policy attribute,attribute policy,feature-policy,feature policy,document-policy,force-load-at-top",
links => [
{
title => "Firefox position: non-harmful",
url => "https://mozilla.github.io/standards-positions/#document-policy",
},
{
title => "Chromium tracking bug for new policies",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=993790",
},
{
title => "WICG - Document Policy Explainer",
url => "https://github.com/WICG/document-policy/blob/main/document-policy-explainer.md",
},
],
notes => "Standard support includes the HTTP `Document-Policy` header and `policy` attribute on iframes.",
notes_by_num => { 1 => "Chromium browsers only support the HTTP header." },
spec => "https://wicg.github.io/document-policy/",
stats => {
and_chr => { "2.1" => "n", "135" => "a #1" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 85 => "a #1" },
edge => { "5.5" => "n", "85" => "a #1" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 71 => "a #1" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Document Policy",
ucprefix => 0,
},
"document-scrollingelement" => {
categories => ["DOM"],
description => "`document.scrollingElement` refers to the element that scrolls the document.",
links => [
{
title => "Polyfill",
url => "https://github.com/mathiasbynens/document.scrollingElement",
},
{
title => "MDN on scrollingElement",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Document/scrollingElement",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/cssom-view/#dom-document-scrollingelement",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 44 => "y" },
edge => { "5.5" => "n", "12" => "u", "14" => "y" },
firefox => { 2 => "n", 48 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 31 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "document.scrollingElement",
ucprefix => 0,
},
"documenthead" => {
categories => ["DOM"],
description => "Convenience property for accessing the `<head>` element",
keywords => "document,head",
links => [
{
title => "MDN Web Docs - head",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Document/head",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/#dom-document-head",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { 9 => "n", 11 => "y" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "document.head",
ucprefix => 0,
},
"dom-manip-convenience" => {
categories => ["DOM"],
chrome_id => 5723067795898368,
description => "jQuery-like methods on DOM nodes to insert nodes around or within a node, or to replace one node with another. These methods accept any number of DOM nodes or HTML strings as arguments. Includes: `ChildNode.before`, `ChildNode.after`, `ChildNode.replaceWith`, `ParentNode.prepend`, and `ParentNode.append`.",
keywords => "dom,manipulation,convenience,convenient,before,after,replaceWith,prepend,append",
links => [
{
title => "WHATWG DOM Specification for ChildNode",
url => "https://dom.spec.whatwg.org/#interface-childnode",
},
{
title => "WHATWG DOM Specification for ParentNode",
url => "https://dom.spec.whatwg.org/#interface-parentnode",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/fiqacod/edit?html,js,output",
},
{
title => "DOM4 polyfill",
url => "https://github.com/WebReflection/dom4",
},
],
notes_by_num => {
1 => "Enabled through the \"Enable Experimental Web Platform Features\" flag in chrome://flags",
},
spec => "https://dom.spec.whatwg.org/#interface-childnode",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 52 => "n d #1", 54 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { 2 => "n", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 40 => "n d #1", 41 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "ls",
title => "DOM manipulation convenience methods",
ucprefix => 0,
},
"dom-range" => {
categories => ["DOM", "JS API"],
description => "A contiguous range of content in a Document, DocumentFragment or Attr",
keywords => "DOM,range,selection",
links => [
{
title => "MDN Web Docs - Range",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Range",
},
{
title => "QuirksMode",
url => "https://www.quirksmode.org/dom/range_intro.html",
},
{
title => "\"Rangy\" Range library with old IE support",
url => "https://github.com/timdown/rangy",
},
],
notes => "See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Range) for feature support details",
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#ranges",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Document Object Model Range",
ucprefix => 0,
},
"domcontentloaded" => {
categories => ["DOM"],
description => "JavaScript event that fires when the DOM is loaded, but before all page assets are loaded (CSS, images, etc.).",
keywords => "dom,domready,onload,contentloaded,document",
links => [
{
title => "MDN Web Docs - DOMContentLoaded",
url => "https://developer.mozilla.org/en-US/docs/Web/Reference/Events/DOMContentLoaded",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/syntax.html#stop-parsing",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "DOMContentLoaded",
ucprefix => 0,
},
"dommatrix" => {
categories => ["DOM"],
description => "The `DOMMatrix` interface represents 4x4 matrices, suitable for 2D and 3D operations. Supersedes the `WebKitCSSMatrix` and `SVGMatrix` interfaces.",
keywords => "matrix,WebKitCSSMatrix,MSCSSMatrix,CSSMatrix,DOMMatrix,DOMMatrixReadOnly",
links => [
{
title => "WebKitCSSMatrix API Reference",
url => "https://developer.apple.com/reference/webkitjs/webkitcssmatrix",
},
{
title => "WebKitCSSMatrix in Compatibility Standard",
url => "https://compat.spec.whatwg.org/#webkitcssmatrix-interface",
},
{
title => "MDN Web Docs - DOMMatrix",
url => "https://developer.mozilla.org/en-US/docs/Web/API/DOMMatrix",
},
{
title => "Chrome implementation bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=581955",
},
],
notes_by_num => {
1 => "Only supports the `WebKitCSSMatrix` version of the interface, not `DOMMatrix`",
2 => "`WebKitCSSMatrix#skewX`, `WebKitCSSMatrix#skewY` are not supported",
3 => "Only supports the `DOMMatrix` version of the interface, not `WebKitCSSMatrix` (support required by spec for legacy reasons)",
4 => "Only replaces `WebkitCSSMatrix` and not `SVGMatrix`",
5 => "Does not support `fromMatrix()`, `fromFloat32Array()`, `fromFloat64Array()`, and `toJSON()` methods",
},
spec => "https://drafts.fxtf.org/geometry/#dommatrix",
stats => {
and_chr => { "2.1" => "a x #2", "4" => "a #1", "135" => "a #4" },
and_ff => { 137 => "a #4" },
and_qq => { "14.9" => "a #4" },
and_uc => { "15.5" => "a #4" },
baidu => { "13.52" => "a #4" },
bb => { 7 => "u", 10 => "a #1" },
chrome => { 4 => "u", 8 => "a #1 #2", 9 => "a #1", 61 => "a #4" },
edge => { "5.5" => "n", "10" => "a #1", "79" => "a #4" },
firefox => { 2 => "n", 33 => "a #3 #5", 49 => "a #4 #5", 69 => "a #4" },
ie_mob => { 10 => "a #1" },
ios_saf => { "11.0-11.2" => "a #4", "3.2" => "u", "5.0-5.1" => "a #1" },
kaios => { "2.5" => "a #3 #5", "3.0-3.1" => "a #4" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #4" },
opera => { 9 => "n", 15 => "a #1", 48 => "a #4" },
safari => { "3.1" => "u", "5" => "a #1", "11" => "a #4" },
samsung => { 4 => "a #1" },
},
status => "cr",
title => "DOMMatrix",
ucprefix => 0,
},
"download" => {
categories => ["HTML5"],
chrome_id => 6473924464345088,
description => "When used on an anchor, this attribute signifies that the browser should download the resource the anchor points to rather than navigate to it.",
keywords => "download,a.download,a[download],download attribute",
links => [
{
title => "HTML5Rocks post",
url => "https://updates.html5rocks.com/2011/08/Downloading-resources-in-HTML5-a-download",
},
{
title => "IE11 polyfill",
url => "https://github.com/jelmerdemaat/dwnld-attr-polyfill",
},
{
title => "Download attribute on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#downloading-resources",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 14 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 20 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Download attribute",
ucprefix => 0,
},
"dragndrop" => {
categories => ["HTML5"],
description => "Method of easily dragging and dropping elements on a page, requiring minimal JavaScript.",
keywords => "draganddrop, draggable",
links => [
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/native-drag-and-drop/",
},
{
title => "Shopping cart demo",
url => "https://nettutsplus.s3.amazonaws.com/64_html5dragdrop/demo/index.html",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/DragEvent",
},
{
title => "Polyfill for setDragImage in IE",
url => "https://github.com/MihaiValentin/setDragImage-IE",
},
{
title => "iOS/Android shim for HTML 5 drag'n'drop",
url => "https://github.com/timruffles/ios-html5-drag-drop-shim",
},
],
notes => "`dataTransfer.items` only supported by Chrome.\r\n\r\nCurrently no browser supports the `dropzone` attribute.\r\n\r\nFirefox supports any kind of DOM elements for `.setDragImage`. Chrome must have either an `HTMLImageElement` or any kind of DOM Element attached to the DOM _and within the viewport_ of the browser for `.setDragImage`.",
notes_by_num => {
1 => "Partial support refers to no support for the `dataTransfer.files` or `.types` objects",
2 => "Partial support refers to not supporting `.setDragImage`",
3 => "Partial support refers to limited supported formats for `dataTransfer.setData`/`getData`.",
4 => "Not supported in Chromium browsers on Android 6 or older.",
},
spec => "https://html.spec.whatwg.org/multipage/interaction.html#dnd",
stats => {
and_chr => { "2.1" => "n", "135" => "y #4" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y #4" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "y" },
edge => { "5.5" => "a #1 #3", "10" => "a #2 #3", "12" => "a #2", "18" => "y" },
firefox => { "2" => "p", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { "10" => "p", "12.1" => "y", "80" => "y #4" },
opera => { 9 => "p", 12 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "n" },
},
status => "ls",
title => "Drag and Drop",
ucprefix => 0,
},
"element-closest" => {
categories => ["DOM"],
description => "DOM method that returns the current element if it matches the given selector, or else the closest ancestor element that matches the given selector, or else null.",
keywords => "element,closest,dom",
links => [
{
title => "MDN Web Docs - closest",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/closest",
},
{
title => "Polyfill",
url => "https://github.com/jonathantneal/closest",
},
],
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-element-closest",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "y" },
edge => { "5.5" => "n", "15" => "y" },
firefox => { 2 => "n", 35 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 28 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "ls",
title => "Element.closest()",
ucprefix => 0,
},
"element-from-point" => {
categories => ["DOM"],
description => "Given coordinates for a point relative to the viewport, returns the element that a click event would be dispatched at if the user were to click the point (in other words, the element that hit-testing would find).",
keywords => "document,elementFromPoint,element,from,point",
links => [
{
title => "MDN Web Docs - elementFromPoint",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Document/elementFromPoint",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/cssom-view-1/#dom-document-elementfrompoint",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "u", "6" => "y" },
firefox => { 2 => "u", 3 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "u", 12 => "y" },
opera => { 9 => "u", 11 => "y" },
safari => { "3.1" => "u", "5" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "document.elementFromPoint()",
ucprefix => 0,
},
"element-scroll-methods" => {
categories => ["DOM", "JS API"],
description => "Methods to change the scroll position of an element. Similar to setting `scrollTop` & `scrollLeft` properties, but also allows options to be passed to define the scroll behavior.",
keywords => "element.prototype.scroll,element.prototype.scrollTo,element.prototype.scrollBy",
links => [
{
title => "MDN article on scrollTo",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTo",
},
{
title => "MDN article on scrollBy",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollBy",
},
],
notes => "See also the support for the [`scrollIntoView` method](/#feat=scrollintoview).",
notes_by_num => { 1 => "Does not support the `smooth` behavior option." },
spec => "https://www.w3.org/TR/cssom-view-1/#extension-to-the-element-interface",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 61 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 36 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "a #1", "14.5-14.8" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 48 => "y" },
safari => { "3.1" => "n", "10" => "a #1", "14" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "wd",
title => "Scroll methods on elements (scroll, scrollTo, scrollBy)",
ucprefix => 0,
},
"eme" => {
categories => ["JS API", "Security"],
chrome_id => 6578378068983808,
description => "The EncryptedMediaExtenstions API provides interfaces for controlling the playback of content which is subject to a DRM scheme.",
keywords => "requestMediaKeySystemAccess,createMediaKeys",
links => [
{
title => "HTML5rocks article",
url => "https://www.html5rocks.com/en/tutorials/eme/basics/",
},
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Encrypted_Media_Extensions",
},
{
title => "Encrypted Media Extensions API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Encrypted_Media_Extensions_API",
},
],
notes_by_num => { 1 => "Only supports the older event-based specification" },
spec => "https://www.w3.org/TR/encrypted-media/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 35 => "a #1", 42 => "y" },
edge => { "5.5" => "n", "11" => "a x #1", "12" => "y" },
firefox => { 2 => "n", 38 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 22 => "a #1", 29 => "y" },
safari => { "3.1" => "n", "7" => "a x #1", "12" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "rec",
title => "Encrypted Media Extensions",
ucprefix => 0,
},
"eot" => {
categories => ["Other"],
description => "Type of font that can be derived from a regular font, allowing small files and legal use of high-quality fonts. Usage is restricted by the file being tied to the website",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/Embedded_OpenType",
},
{
title => "Example pages",
url => "https://www.microsoft.com/typography/web/embedding/default.aspx",
},
],
notes => "Proposal by Microsoft, being considered for W3C standardization.",
notes_by_num => {},
parent => "fontface",
spec => "https://www.w3.org/Submission/EOT/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "6" => "y", "12" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "EOT - Embedded OpenType fonts",
ucprefix => 0,
},
"es5" => {
categories => ["JS"],
description => "Full support for the ECMAScript 5 specification. Features include `Function.prototype.bind`, Array methods like `indexOf`, `forEach`, `map` & `filter`, Object methods like `defineProperty`, `create` & `keys`, the `trim` method on Strings and many more.",
keywords => "es5,javascript,js,javascriptes5,function.bind,array.foreach,array.indexof,array.map,object.keys,date.now,defineproperties,getprototypeof,keys,seal,freeze,preventextensions,issealed,isfrozen,isextensible,getownpropertydescriptorgetownpropertynames,toisostringc,isarray,lastindexof,every,some,reduce,reduceright,getter,setter",
links => [
{
title => "Detailed compatibility tables & tests",
url => "https://compat-table.github.io/compat-table/es5/",
},
{
title => "Overview of objects & properties",
url => "https://johnresig.com/blog/ecmascript-5-objects-and-properties/",
},
{
title => "ES5 polyfill",
url => "https://github.com/es-shims/es5-shim",
},
{
title => "Polyfill for all possible ES5 features is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript",
},
],
notes => "As the specification includes many JavaScript features, un-numbered partial support varies widely and is shown in detail on the [ECMAScript 5 compatibility tables](https://compat-table.github.io/compat-table/es5/) by Kangax.",
notes_by_num => {
1 => "Does not support `parseInt()` ignoring leading zeros. ",
2 => "Does not support Strict mode",
3 => "Does not support zero-width chars in identifiers & Immutable `undefined`",
4 => "IE8 has virtually no ES5 support, but does support `Object.defineProperty`, `Object.getOwnPropertyDescriptor`, JSON parsing & Property access on strings",
},
spec => "https://www.ecma-international.org/ecma-262/5.1/",
stats => {
and_chr => { "2.1" => "a", "4" => "a #1 #2 #3", "4.1" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a", 10 => "y" },
chrome => { 4 => "a", 19 => "a #1", 23 => "y" },
edge => { "5.5" => "n", "8" => "n #4", "9" => "a #2", "10" => "y" },
firefox => { 2 => "a", 4 => "a #1", 21 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { "10" => "a", "12.1" => "a #1", "80" => "y" },
opera => { "9" => "a", "12.1" => "a #1", "15" => "y" },
safari => { "3.1" => "a", "6" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "ECMAScript 5",
ucprefix => 0,
},
"es6" => {
categories => ["JS"],
description => "Support for the ECMAScript 2015 specification. Features include Promises, Modules, Classes, Template Literals, Arrow Functions, Let and Const, Default Parameters, Generators, Destructuring Assignment, Rest & Spread, Map/Set & WeakMap/WeakSet and many more.",
keywords => "javascript,block-scoped,string.prototype.includes,string.prototype.endswith,string.prototype.repeat,array.prototype.find,array.prototype.findindex,array.prototype.fill,object.assign",
links => [
{
title => "ES6 New features: overview and comparisons",
url => "http://es6-features.org",
},
{
title => "Exploring ES6 (book)",
url => "https://exploringjs.com/es6/",
},
{
title => "Polyfill for all possible ES2015 features is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript",
},
],
notes => "As ES6 refers to a huge specification and browsers have various levels of support, \"Supported\" means at least 95% of the spec is supported. \"Partial support\" refers to at least 10% of the spec being supported. For full details see the [Kangax ES6 support table](https://compat-table.github.io/compat-table/es6/).",
notes_by_num => {
1 => "Notable partial support in IE11 includes (at least some) support for `const`, `let`, block-level function declaration, typed arrays, `Map`, `Set` and `WeakMap`.",
2 => "Does not support [tail call optimization](https://compat-table.github.io/compat-table/es6/#test-proper_tail_calls_%28tail_call_optimisation%29)",
3 => "Only has partial Symbol support and partial support for `RegExp.prototype` properties",
},
spec => "https://tc39.es/ecma262/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a", "135" => "y #2" },
and_ff => { 137 => "y #2" },
and_qq => { "14.9" => "y #2" },
and_uc => { "15.5" => "y #2" },
baidu => { "13.52" => "y #2" },
bb => { 7 => "n", 10 => "a" },
chrome => { 4 => "n", 21 => "a", 51 => "y #2" },
edge => {
"5.5" => "n",
"11" => "a #1 #2",
"12" => "a #2",
"15" => "y #2 #3",
"79" => "y #2",
},
firefox => { 2 => "n", 6 => "a", 54 => "y #2" },
ie_mob => { 10 => "n", 11 => "a #1 #2" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n", "7.0-7.1" => "a" },
kaios => { "2.5" => "a", "3.0-3.1" => "y #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #2" },
opera => { 9 => "n", 15 => "a", 38 => "y #2" },
safari => { "3.1" => "n", "7.1" => "a", "10" => "y" },
samsung => { "4" => "a", "5.0-5.4" => "y #2" },
},
status => "other",
title => "ECMAScript 2015 (ES6)",
ucprefix => 0,
},
"es6-class" => {
categories => ["JS"],
chrome_id => 4633745457938432,
description => "ES6 classes are syntactical sugar to provide a much simpler and clearer syntax to create objects and deal with inheritance.",
keywords => "ES6,JavaScript,class",
links => [
{
title => "MDN Web Docs - ES6 classes",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes",
},
{
title => "Sitepoint deep dive on ES6 classes",
url => "https://www.sitepoint.com/object-oriented-javascript-deep-dive-es6-classes/",
},
{
title => "List of resources critical of ES6 classes",
url => "https://github.com/joshburgess/not-awesome-es6-classes",
},
],
notes_by_num => {
1 => "Requires strict mode. Non-strict mode support is behind the flag 'Enable Experimental JavaScript', disabled by default.",
},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-class-definitions",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 42 => "a #1", 49 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 45 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 29 => "a #1", 36 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "ES6 classes",
ucprefix => 0,
},
"es6-generators" => {
categories => ["JS"],
chrome_id => 4959347197083648,
description => "ES6 Generators are special functions that can be used to control the iteration behavior of a loop. Generators are defined using a `function*` declaration.",
keywords => "yield,iterators",
links => [
{
title => "Exploring JS chapter on generators",
url => "https://exploringjs.com/es6/ch_generators.html",
},
{
title => "MDN article on the `function*` declaration",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*",
},
],
notes_by_num => {},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-generator-function-definitions",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 39 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 26 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 26 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "ES6 Generators",
ucprefix => 0,
},
"es6-module" => {
categories => ["JS"],
chrome_id => 5365692190687232,
description => "Loading JavaScript module scripts (aka ES6 modules) using `<script type=\"module\">` Includes support for the `nomodule` attribute.",
keywords => "es6 module,esmodules,module,import,export,nomodule",
links => [
{
title => "Intro to ES6 modules",
url => "https://strongloop.com/strongblog/an-introduction-to-javascript-es6-modules/",
},
{
title => "MS Edge blog post",
url => "https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond/",
},
{
title => "Mozilla hacks article",
url => "https://hacks.mozilla.org/2015/08/es6-in-depth-modules/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=568953",
},
{
title => "Blog post: Native ECMAScript modules - the first overview",
url => "https://blog.hospodarets.com/native-ecmascript-modules-the-first-overview",
},
{
title => "Counterpart ECMAScript specification for import/export syntax",
url => "https://tc39.es/ecma262/#sec-modules",
},
{
title => "Specification for nomodule attribute",
url => "https://html.spec.whatwg.org/multipage/scripting.html#attr-script-nomodule",
},
{
title => "Blog post on using nomodule",
url => "https://hospodarets.com/native-ecmascript-modules-nomodule",
},
{
title => "Will it double-fetch? Browser behavior with `module` / `nomodule` scripts",
url => "https://gist.github.com/jakub-g/5fc11af85a061ca29cc84892f1059fec",
},
],
notes_by_num => {
1 => "Support can be enabled via `about:flags`",
2 => "Support can be enabled via `about:config`",
3 => "Does not support the `nomodule` attribute",
4 => "A [polyfill is available](https://gist.github.com/samthor/64b114e4a4f539915a95b91ffd340acc) for Safari 10.1/iOS Safari 10.3",
5 => "`nomodule` scripts are not executed, but they're still fetched",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#attr-script-type",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 60 => "n d #1", 61 => "y" },
edge => { "5.5" => "n", "15" => "n d #1 #5", "16" => "y #5", "79" => "y" },
firefox => { 2 => "n", 54 => "n d #2", 60 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "a #3 #4", "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 47 => "n d #1", 48 => "y" },
safari => { "3.1" => "n", "10.1" => "a #3 #4", "11" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "ls",
title => "JavaScript modules via script tag",
ucprefix => 0,
},
"es6-module-dynamic-import" => {
categories => ["JS"],
chrome_id => 5684934484164608,
description => "Loading JavaScript modules dynamically using the import() syntax",
keywords => "es6,javascript,module,import,export",
links => [
{
title => "Counterpart ECMAScript specification for import() syntax",
url => "https://tc39.es/ecma262/#sec-import-calls",
},
{
title => "Blog post: Native ECMAScript modules - dynamic import()",
url => "https://hospodarets.com/native-ecmascript-modules-dynamic-import",
},
{
title => "Dynamic import()",
url => "https://developers.google.com/web/updates/2017/11/dynamic-import",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1342012",
},
{
title => "Integration with the HTML specification",
url => "https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-module-system",
},
],
notes_by_num => {
1 => "Support can be enabled via `javascript.options.dynamicImport` flag. See [bug 1517546](https://bugzil.la/1517546).",
},
parent => "es6-module",
spec => "https://tc39.es/ecma262/#sec-import-calls",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 63 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 66 => "n d #1", 67 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 50 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "other",
title => "JavaScript modules: dynamic import()",
ucprefix => 0,
},
"es6-number" => {
categories => ["JS"],
description => "Extensions to the `Number` built-in object in ES6, including constant properties `EPSILON`, `MIN_SAFE_INTEGER`, and `MAX_SAFE_INTEGER`, and methods ` isFinite`, `isInteger`, `isSafeInteger`, and `isNaN`.",
keywords => "ES6,JavaScript,number,built-in,EPSILON,MIN_SAFE_INTEGER,MAX_SAFE_INTEGER,isFinite,isInteger,isSafeInteger,isNaN",
links => [
{
title => "New number and Math features in ES6",
url => "https://2ality.com/2015/04/numbers-math-es6.html",
},
{
title => "Polyfill for those features is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-number",
},
],
notes_by_num => {
1 => "Partial refers to only supporting the `isFinite`, `isInteger`, and `isNaN` methods.",
2 => "Partial refers to supporting the same as #1 and the addition of the `EPSILON` property.",
3 => "Partial refers to supporting all new features except the `isSafeInteger` method.",
4 => "Partial refers to only supporting the `isFinite` and `isNaN` methods.",
},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-number-objects",
stats => {
and_chr => { "2.1" => "n", "4.1" => "a #4", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 19 => "a #4", 34 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 16 => "a #1", 25 => "a #2", 31 => "a #3", 32 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a #4", 21 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "ES6 Number",
ucprefix => 0,
},
"es6-string-includes" => {
categories => ["JS"],
description => "The includes() method determines whether one string may be found within another string, returning true or false as appropriate.",
keywords => "ES6,JavaScript,String,includes",
links => [
{
title => "MDN: String.prototype.includes()",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-string-and-regexp",
},
],
notes_by_num => {},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-string.prototype.includes",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 40 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 28 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "String.prototype.includes",
ucprefix => 0,
},
"eventsource" => {
categories => ["JS API"],
chrome_id => 5311740673785856,
description => "Method of continuously sending data from a server to the browser, rather than repeatedly requesting it (EventSource interface, used to fall under HTML5)",
keywords => "serversent,s-sent-events,server sent events,server side events",
links => [
{
title => "HTML5 Rocks tutorial",
url => "https://www.html5rocks.com/tutorials/eventsource/basics/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-eventsource",
},
{ title => "Polyfill", url => "https://github.com/Yaffle/EventSource" },
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/comms.html#server-sent-events",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 6 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 6 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "a", "11.1" => "y" },
opera => { 9 => "a", 11 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Server-sent events",
ucprefix => 0,
},
"extended-system-fonts" => {
categories => ["CSS"],
description => "Allows more control when choosing system interface fonts",
keywords => "font-family,ui-serif,ui-sans-serif,ui-monospace,ui-rounded",
links => [
{
title => "WebKit Safari 13.1 announcement",
url => "https://webkit.org/blog/10247/new-webkit-features-in-safari-13-1/",
},
{
title => "ui-serif Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1598879",
},
{
title => "ui-sans-serif Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1598880",
},
{
title => "ui-monospace Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1598881",
},
{
title => "ui-rounded Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1598883",
},
{
title => "Chromium support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1029069",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-fonts-4/#ui-serif-def",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "13.4-13.7" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "13.1" => "y" },
samsung => { 4 => "n" },
},
status => "wd",
title => "ui-serif, ui-sans-serif, ui-monospace and ui-rounded values for font-family",
ucprefix => 0,
},
"feature-policy" => {
categories => ["JS API", "Other", "Security"],
chrome_id => "5694225681219584,5190687460950016",
description => "This specification defines a mechanism that allows developers to selectively enable and disable use of various browser features and APIs. Feature Policy is deprecated and has been replaced with [Permissions Policy](/permissions-policy) and [Document Policy](/document-policy).",
keywords => "feature,security,header,allow,attribute,allow attribute,attribute allow,feature-policy,document.featurePolicy,document.policy",
links => [
{
title => "Feature Policy Kitchen Sink Demos",
url => "https://feature-policy-demos.appspot.com/",
},
{
title => "Introduction to Feature Policy",
url => "https://developers.google.com/web/updates/2018/06/feature-policy",
},
{
title => "Firefox implementation ticket",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1390801",
},
{
title => "Feature Policy Tester (Chrome DevTools Extension)",
url => "https://chrome.google.com/webstore/detail/feature-policy-tester-dev/pchamnkhkeokbpahnocjaeednpbpacop",
},
{
title => "featurepolicy.info (Feature-Policy Playground)",
url => "https://featurepolicy.info/",
},
{
title => "List of known features",
url => "https://github.com/w3c/webappsec-permissions-policy/blob/main/features.md",
},
],
notes => "Standard support includes the HTTP `Feature-Policy` header, `allow` attribute on iframes and the `document.featurePolicy` JS API.",
notes_by_num => {
1 => "Older Chromium browsers did not support the JS API.",
2 => "Safari and Firefox only supports the `allow` attribute on iframes.",
3 => "Safari doesn't support a [list of origins](https://bugs.webkit.org/show_bug.cgi?id=189901) or a [wildcard](https://bugs.webkit.org/show_bug.cgi?id=187816).",
4 => "At least partially supports [Permissions Policy](/permissions-policy), the main replacement for this spec.",
},
spec => "https://www.w3.org/TR/2019/WD-feature-policy-1-20190416/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "a #2" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y #4" },
bb => { 7 => "n" },
chrome => { 4 => "n", 60 => "a #1", 74 => "y", 88 => "y #4" },
edge => { "5.5" => "n", "79" => "y", "88" => "y #4" },
firefox => { 2 => "n", 74 => "a #2" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "a #2 #3", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "a #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #4" },
opera => { 9 => "n", 47 => "a #1", 62 => "y", 75 => "y #4" },
safari => { "3.1" => "n", "11.1" => "a #2 #3" },
samsung => { "11.1-11.2" => "y", "4" => "n", "8.2" => "a #1" },
},
status => "unoff",
title => "Feature Policy",
ucprefix => 0,
},
"fetch" => {
categories => ["JS API"],
chrome_id => 6730533392351232,
description => "A modern replacement for XMLHttpRequest.",
keywords => "fetch,service,workers,xhr,xmlhttprequest",
links => [
{ title => "Polyfill", url => "https://github.com/github/fetch" },
{ title => "Demo", url => "https://addyosmani.com/demos/fetch-api/" },
{
title => "Polyfill (minimal, 500 bytes)",
url => "https://github.com/developit/unfetch",
},
],
notes_by_num => {
1 => "Partial support can be enabled in Firefox with the `dom.fetch.enabled` flag.",
2 => "Only available in Chrome and Opera within ServiceWorkers.",
3 => "Available in Chrome and Opera within Window and Workers by enabling the \"Experimental Web Platform Features\" flag in `chrome://flags`",
4 => "Firefox <40 is not completely conforming to the specs and does not respect the <base> tag for relative URIs in fetch requests. See [bug 1161625](https://bugzilla.mozilla.org/show_bug.cgi?id=1161625).",
},
spec => "https://fetch.spec.whatwg.org/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 40 => "a #2", 41 => "a #2 #3", 42 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 34 => "n d #1 #4", 39 => "y #4", 40 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 27 => "a #2", 28 => "a #2 #3", 29 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Fetch",
ucprefix => 0,
},
"fieldset-disabled" => {
categories => ["DOM", "HTML5"],
description => "Allows disabling all of the form control descendants of a fieldset via a `disabled` attribute on the fieldset element itself.",
keywords => "HTMLFieldSetElement,fieldset,disabled",
links => [
{
title => "JS Bin Testcase/Demo",
url => "https://jsbin.com/bibiqi/1/edit?html,output",
},
],
notes_by_num => {
1 => "Text inputs that are descendants of a disabled fieldset appear disabled but the user can still interact with them. [See IE bug #962368.](https://web.archive.org/web/20170306075528/https://connect.microsoft.com/IE/feedbackdetail/view/962368/can-still-edit-input-type-text-within-fieldset-disabled)",
2 => "File inputs that are descendants of a disabled fieldset appear disabled but the user can still interact with them. [See IE bug #817488.](https://web.archive.org/web/20170306075531/https://connect.microsoft.com/IE/feedbackdetail/view/817488)",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#attr-fieldset-disabled",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 16 => "u", 20 => "y" },
edge => { "5.5" => "u", "6" => "a #1 #2", "8" => "a #1", "10" => "a #1 #2", "12" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y", 11 => "a #2" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1 #2" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "u" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "disabled attribute of the fieldset element",
ucprefix => 0,
},
"fileapi" => {
categories => ["JS API"],
description => "Method of manipulating file objects in web applications client-side, as well as programmatically selecting them and accessing their data.",
keywords => "FileReader",
links => [
{
title => "MDN Web Docs - Using Files",
url => "https://developer.mozilla.org/en/Using_files_from_web_applications",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/file",
},
{ title => "Polyfill", url => "https://github.com/moxiecode/moxie" },
],
notes_by_num => {
1 => "Does not have `FileReader` support. ",
2 => "Does not support the `File` constructor",
},
spec => "https://www.w3.org/TR/FileAPI/",
stats => {
and_chr => { "2.1" => "n", "3" => "a #1 #2", "4.4" => "a #2", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1 #2", 10 => "a #2" },
chrome => { 4 => "n", 6 => "a #1 #2", 13 => "a #2", 38 => "y" },
edge => { "5.5" => "n", "10" => "a #2", "79" => "y" },
firefox => { "2" => "n", "3.6" => "a #2", "28" => "y" },
ie_mob => { 10 => "n", 11 => "a #2" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n", "6.0-6.1" => "a #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "a #2", "80" => "y" },
opera => { "9" => "n", "11.1" => "a #2", "25" => "y" },
safari => { "3.1" => "n", "5.1" => "a #1 #2", "6" => "a #2", "10" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "File API",
ucprefix => 0,
},
"filereader" => {
categories => ["JS API"],
chrome_id => 5171003185430528,
description => "Method of reading the contents of a File or Blob object into memory",
links => [
{
title => "MDN Web Docs - FileReader",
url => "https://developer.mozilla.org/en/DOM/FileReader",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/file/FileReader",
},
],
notes_by_num => {
1 => "Does not support `readAsBinaryString`, but `readAsBinaryString` [can be polyfilled](https://stackoverflow.com/q/31391207)",
},
parent => "fileapi",
spec => "https://www.w3.org/TR/FileAPI/#dfn-filereader",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 6 => "y" },
edge => { "5.5" => "n", "10" => "a #1", "12" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "y" },
opera => { "9" => "n", "11.1" => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "FileReader API",
ucprefix => 0,
},
"filereadersync" => {
categories => ["JS API"],
description => "Allows files to be read synchronously in Web Workers",
links => [
{
title => "MDN Web Docs - FileReaderSync",
url => "https://developer.mozilla.org/en-US/docs/Web/API/FileReaderSync",
},
],
notes_by_num => {},
parent => "filereader",
spec => "https://w3c.github.io/FileAPI/#FileReaderSync",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 8 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11" => "u", "11.5" => "y" },
opera => { "9" => "n", "10.5" => "u", "11.6" => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "FileReaderSync",
ucprefix => 0,
},
"filesystem" => {
categories => ["JS API"],
chrome_id => 5452478162141184,
description => "Method of reading and writing files to a sandboxed file system.",
keywords => "filewriter,requestFileSystem",
links => [
{
title => "HTML5 Rocks tutorial",
url => "https://www.html5rocks.com/en/tutorials/file/filesystem/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/filesystem",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=997471",
},
],
notes => "The File API: Directories and System specification is no longer being maintained and support may be dropped in future versions.",
notes_by_num => {},
spec => "https://www.w3.org/TR/file-system-api/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y x" },
baidu => { "13.52" => "y x" },
bb => { 7 => "n", 10 => "y x" },
chrome => { 4 => "n", 8 => "a x", 13 => "y x" },
edge => { "5.5" => "n", "79" => "y x" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y x" },
opera => { 9 => "n", 15 => "y x" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "y x" },
},
status => "unoff",
title => "Filesystem & FileWriter API",
ucprefix => 0,
},
"flac" => {
categories => ["Other"],
description => "Popular lossless audio compression format",
keywords => "flac,lossless,audio",
links => [
{ title => "Wikipedia", url => "https://en.wikipedia.org/wiki/FLAC" },
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=93887",
},
],
notes => "Support refers to this format's use in the `audio` element, not other conditions.",
notes_by_num => {
1 => "HTMLMediaElement.canPlayType('audio/flac') returns an empty string",
2 => "Only works on ChromeOS",
3 => "Supported only on macOS High Sierra or later",
},
parent => "audio",
spec => "https://xiph.org/flac/format.html",
stats => {
and_chr => { "2.1" => "n", "3" => "u", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 44 => "u", 47 => "a #1 #2", 56 => "y" },
edge => { "5.5" => "n", "16" => "y" },
firefox => { 2 => "n", 51 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "u", "12.1" => "y" },
opera => { 9 => "n", 42 => "y" },
safari => { "3.1" => "n", "11" => "a #3", "13" => "y" },
samsung => { "4" => "y #1", "5.0-5.4" => "y" },
},
status => "other",
title => "FLAC audio format",
ucprefix => 0,
},
"flexbox" => {
categories => ["CSS3"],
chrome_id => 4837301406400512,
description => "Method of positioning elements in horizontal or vertical stacks. Support includes all properties prefixed with `flex`, as well as `display: flex`, `display: inline-flex`, `align-content`, `align-items`, `align-self`, `justify-content` and `order`.",
keywords => "flex-box,displayflex,flex-direction,flex-wrap,flex-flow,flex-grow,flex-shrink,flex-basis,display:flex,justify-content:space-between,justify-content:space-around,align-content:space-between,align-content:space-around,space-between",
links => [
{
title => "Flexbox CSS generator",
url => "https://bennettfeely.com/flexplorer/",
},
{
title => "Article on using the latest spec",
url => "https://www.adobe.com/devnet/html5/articles/working-with-flexbox-the-new-spec.html",
},
{
title => "Tutorial on cross-browser support",
url => "https://dev.opera.com/articles/view/advanced-cross-browser-flexbox/",
},
{
title => "Examples on how to solve common layout problems with flexbox",
url => "https://philipwalton.github.io/solved-by-flexbox/",
},
{
title => "A Complete Guide to Flexbox",
url => "https://css-tricks.com/snippets/css/a-guide-to-flexbox/",
},
{
title => "Flexbox playground and code generator",
url => "https://the-echoplex.net/flexyboxes/",
},
{
title => "Flexbugs: Repo for flexbox bugs",
url => "https://github.com/philipwalton/flexbugs",
},
{
title => "10up Open Sources IE 8 and 9 Support for Flexbox",
url => "https://github.com/10up/flexibility/",
},
{
title => "Ecligrid - Mobile first flexbox grid system",
url => "https://github.com/vadimyer/ecligrid",
},
{
title => "The Difference Between Width and Flex-Basis",
url => "https://mastery.games/post/the-difference-between-width-and-flex-basis/",
},
],
notes => "Most partial support refers to supporting an [older version](https://www.w3.org/TR/2009/WD-css3-flexbox-20090723/) of the specification or an [older syntax](https://www.w3.org/TR/2012/WD-css3-flexbox-20120322/).",
notes_by_num => {
1 => "Only supports the [old flexbox](https://www.w3.org/TR/2009/WD-css3-flexbox-20090723) specification and does not support wrapping.",
2 => "Only supports the [2012 syntax](https://www.w3.org/TR/2012/WD-css3-flexbox-20120322/)",
3 => "Does not support flex-wrap, flex-flow or align-content properties",
4 => "Partial support is due to large amount of bugs present (see known issues)",
},
spec => "https://www.w3.org/TR/css3-flexbox/",
stats => {
and_chr => { "2.1" => "a x #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x #1", 10 => "y" },
chrome => { 4 => "a x #1", 21 => "y x", 29 => "y" },
edge => { "5.5" => "n", "10" => "a x #2 #4", "11" => "a #4", "12" => "y" },
firefox => { 2 => "a x #1", 22 => "a #3", 28 => "y" },
ie_mob => { 10 => "a x #2", 11 => "y" },
ios_saf => { "3.2" => "a x #1", "7.0-7.1" => "y x", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "9" => "n", "12.1" => "y", "15" => "y x", "17" => "y" },
safari => { "3.1" => "a x #1", "6.1" => "y x", "9" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS Flexible Box Layout Module",
ucprefix => 0,
},
"flexbox-gap" => {
categories => ["CSS"],
description => "`gap` for flexbox containers to create gaps/gutters between flex items",
keywords => "flexbox,gaps,gutters,row-gap,column-gap,flexgap",
links => [
{
title => "Spec discussion",
url => "https://github.com/w3c/csswg-drafts/issues/592",
},
{
title => "Chrome bug to track implementation",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=762679",
},
{
title => "MDN browser compatibility",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/gap#Browser_compatibility",
},
{
title => "Workaround using negative margins",
url => "https://gist.github.com/OliverJAsh/7f29d0fa1d35216ec681d2949c3fe8b7",
},
{
title => "Webkit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=206767",
},
],
notes_by_num => {},
parent => "flexbox",
spec => "https://www.w3.org/TR/css-align-3/#gaps",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 84 => "y" },
edge => { "5.5" => "n", "84" => "y" },
firefox => { 2 => "n", 63 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 70 => "y" },
safari => { "3.1" => "n", "14.1" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "wd",
title => "gap property for Flexbox",
ucprefix => 0,
},
"flow-root" => {
categories => ["CSS", "CSS2"],
chrome_id => 5769454877147136,
description => "The element generates a block container box, and lays out its contents using flow layout. It always establishes a new block formatting context for its contents. It provides a better solution to the most use cases of the \"clearfix\" hack.",
keywords => "display,flow-root",
links => [
{
title => "Mozilla bug report",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1322191",
},
{
title => "Chromium bug report",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=672508",
},
{
title => "WebKit bug report",
url => "https://bugs.webkit.org/show_bug.cgi?id=165603",
},
{
title => "Blog post: \"The end of the clearfix hack?\"",
url => "https://rachelandrew.co.uk/archives/2017/01/24/the-end-of-the-clearfix-hack/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-display-3/#valdef-display-flow-root",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 53 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 45 => "y" },
safari => { "3.1" => "n", "13" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "cr",
title => "display: flow-root",
ucprefix => 0,
},
"focusin-focusout-events" => {
categories => ["DOM"],
description => "The `focusin` and `focusout` events fire just before the element gains or loses focus, and they bubble. By contrast, the `focus` and `blur` events fire after the focus has shifted, and don't bubble.",
keywords => "focusin,focusout,focus,event",
links => [
{
title => "MDN Web Docs - focusin",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/focusin",
},
{
title => "MDN Web Docs - focusout",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/focusout",
},
{
title => "Mozilla Bug 687787 - Add support for DOM3 focusin/focusout",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=687787",
},
],
notes => "In browsers that don't support these events, one alternative is to use a capture phase event listener for the `focus` and/or `blur` events.",
notes_by_num => {},
spec => "https://www.w3.org/TR/DOM-Level-3-Events/#event-type-focusin",
stats => {
and_chr => { "2.1" => "n", "3" => "u", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "6" => "y" },
firefox => { 2 => "n", 52 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "u", 12 => "y" },
opera => { "9" => "n", "11" => "u", "11.6" => "y" },
safari => { "3.1" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "focusin & focusout events",
ucprefix => 0,
},
"font-family-system-ui" => {
categories => ["CSS"],
chrome_id => 5640395337760768,
description => "Value for `font-family` that represents the default user interface font.",
links => [
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1226042",
},
{
title => "MDN on the font-family property",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-family",
},
],
notes_by_num => {
1 => "Supported as the `-apple-system` value (only on macOS and iOS)",
2 => "Supported as the `BlinkMacSystemFont` value (only on macOS)",
},
spec => "https://w3c.github.io/csswg-drafts/css-fonts-4/#system-ui-def",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 53 => "a #2", 56 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 43 => "a #1", 92 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n", "9.0-9.2" => "a #1" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 43 => "y" },
safari => { "3.1" => "n", "9" => "u", "9.1" => "a #1", "11" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "wd",
title => "system-ui value for font-family",
ucprefix => 0,
},
"font-feature" => {
categories => ["CSS3"],
description => "Method of applying advanced typographic and language-specific font features to supported OpenType fonts.",
keywords => "font-feature,font-feature-settings,kern,kerning,font-variant-alternates,ligatures,font-variant-ligatures",
links => [
{
title => "Demo pages (IE/Firefox only)",
url => "https://testdrive-archive.azurewebsites.net/Graphics/opentype/",
},
{
title => "Mozilla hacks article",
url => "https://hacks.mozilla.org/2010/11/firefox-4-font-feature-support/",
},
{
title => "Detailed tables on accessibility support",
url => "https://html5accessibility.com/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/font-feature-settings",
},
{
title => "MDN Web Docs - font-feature-settings",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-feature-settings",
},
{
title => "OpenType layout feature tag registry",
url => "https://www.microsoft.com/typography/otspec/featuretags.htm",
},
{
title => "Syntax for OpenType features in CSS (Adobe Typekit Help)",
url => "https://helpx.adobe.com/fonts/using/open-type-syntax.html#salt",
},
],
notes => "Whenever possible, font-variant shorthand property or an associated longhand property, font-variant-ligatures, font-variant-caps, font-variant-east-asian, font-variant-alternates, font-variant-numeric or font-variant-position should be used. This property is a low-level feature designed to handle special cases where no other way to enable or access an OpenType font feature exists. In particular, this CSS property shouldn't be used to enable small caps.",
notes_by_num => {
1 => "From Gecko 2.0 (Firefox 4.0) to Gecko 14.0 (Firefox 14.0) included, Gecko supported an older syntax, slightly different from the modern one: https://hacks.mozilla.org/2010/11/firefox-4-font-feature-support/",
2 => "Partial support in older Chrome versions refers to lacking support in Mac OS X.",
},
spec => "https://w3.org/TR/css3-fonts/#font-rend-props",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y x" },
chrome => { 4 => "n", 16 => "a x #2", 21 => "y x", 48 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "a x #1", 15 => "y x", 34 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "a", "7.0-7.1" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 35 => "y" },
safari => { "3.1" => "n", "4" => "a", "6.1" => "n", "9.1" => "y" },
samsung => { "4" => "y x", "5.0-5.4" => "y" },
},
status => "rec",
title => "CSS font-feature-settings",
ucprefix => 0,
},
"font-kerning" => {
categories => ["CSS3"],
description => "Controls the usage of the kerning information (spacing between letters) stored in the font. Note that this only affects OpenType fonts with kerning information, it has no effect on other fonts.",
links => [
{
title => "MDN Web Docs - CSS font-kerning",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-kerning",
},
],
notes => "Browsers with support for [font feature settings](https://caniuse.com/#feat=font-feature) can also set kerning value.",
notes_by_num => {
1 => "Disabled by default, can be enabled using preference layout.css.font-features.enabled - defaulting to true on Nightly and Aurora only.",
},
spec => "https://www.w3.org/TR/css3-fonts/#font-kerning-prop",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y x" },
chrome => { 4 => "n", 29 => "y x", 33 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 24 => "n d #1", 34 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "y", "3.2" => "n", "8" => "y x" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 16 => "y x", 20 => "y" },
safari => { "3.1" => "n", "7" => "y x", "9.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 font-kerning",
ucprefix => 0,
},
"font-loading" => {
categories => ["CSS3", "JS API"],
chrome_id => 6244676289953792,
description => "This CSS module defines a scripting interface to font faces in CSS, allowing font faces to be easily created and loaded from script. It also provides methods to track the loading status of an individual font, or of all the fonts on an entire page.",
keywords => "fontface,fontfaceset,fontfacesource,document.fonts",
links => [
{
title => "Optimizing with font load events",
url => "https://www.igvita.com/2014/01/31/optimizing-web-font-rendering-performance/#font-load-events",
},
],
notes_by_num => {
1 => "Can be enabled in Firefox using the `layout.css.font-loading-api.enabled` flag. Enabled by default in Firefox 41. See [this bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1149381)",
},
spec => "https://www.w3.org/TR/css-font-loading-3/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 35 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 35 => "n d #1", 41 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 22 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS Font Loading",
ucprefix => 0,
},
"font-size-adjust" => {
categories => ["CSS"],
chrome_id => "5720910061371392,5170570175447040",
description => "Method of adjusting the font size in a matter that relates to the height of lowercase vs. uppercase letters. This makes it easier to set the size of fallback fonts.",
links => [
{
title => "Article on font-size-adjust",
url => "https://webdesignernotebook.com/css/the-little-known-font-size-adjust-css3-property/",
},
{
title => "MDN Web Docs - CSS font-size-adjust",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-size-adjust",
},
{
title => "WebKit support bug #15257",
url => "https://bugs.webkit.org/show_bug.cgi?id=15257",
},
],
notes_by_num => {
1 => "Enabled through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Missing support for two-value syntax. Issue for [Chromium](https://bugs.chromium.org/p/chromium/issues/detail?id=1219875).",
3 => "Missing support for `from-font` value. Issue for [Chromium](https://bugs.chromium.org/p/chromium/issues/detail?id=1219875).",
},
spec => "https://www.w3.org/TR/css-fonts-3/#font-size-adjust-prop",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n d #1" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "n d #1 #2 #3", 120 => "n d #1", 127 => "y" },
edge => { "5.5" => "n", "79" => "n d #1 #2 #3", "117" => "n d #1", "127" => "y" },
firefox => { 2 => "n", 3 => "a #2 #3", 92 => "a #3", 118 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "a #2 #3", "17.0" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "a #3" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 30 => "n d #1 #2 #3", 102 => "n d #1", 113 => "y" },
safari => { "3.1" => "n", "16.4" => "a #2 #3", "17.0" => "y" },
samsung => { 4 => "n" },
},
status => "rec",
title => "CSS font-size-adjust",
ucprefix => 0,
},
"font-smooth" => {
categories => ["CSS3"],
description => "Controls the application of anti-aliasing when fonts are rendered.",
keywords => "font smooth,font smoothing,-webkit-font-smoothing,-moz-osx-font-smoothing",
links => [
{
title => "MDN Web Docs - font-smooth",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-smooth",
},
{
title => "Old version of W3C recommendation containing font-smooth",
url => "https://www.w3.org/TR/WD-font/#font-smooth",
},
{
title => "WHATWG compat issue to spec `-webkit-font-smoothing: antialiased`",
url => "https://github.com/whatwg/compat/issues/115",
},
],
notes => "Though present in early (2002) drafts of CSS3 Fonts, `font-smooth` has been removed from this specification and is currently not on the standard track.",
notes_by_num => {
1 => "WebKit implements something similar with a different name `-webkit-font-smoothing` and different values: `none`, `antialiased` and `subpixel-antialiased`.",
2 => "Firefox implements something similar with a different name `-moz-osx-font-smoothing` and different values: `auto`, `inherit`, `unset`, `grayscale`.",
3 => "Works only on Mac OS X platform.",
4 => "Firefox 128 and later supports `-webkit-font-smoothing: antialiased` (by mapping to `-moz-osx-font-smoothing: grayscale`)",
},
spec => "https://www.w3.org/TR/WD-font/#font-smooth",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 5 => "a x #1 #3" },
edge => { "5.5" => "n", "79" => "a x #1 #3" },
firefox => { 2 => "n", 25 => "a x #2 #3", 128 => "a x #2 #3 #4" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "a x #2 #3" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 15 => "a x #1 #3" },
safari => { "3.1" => "n", "4" => "a x #1 #3" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "CSS font-smooth",
ucprefix => 0,
},
"font-unicode-range" => {
categories => ["CSS3"],
description => "This \@font-face descriptor defines the set of Unicode codepoints that may be supported by the font face for which it is declared. The descriptor value is a comma-delimited list of Unicode range (<urange>) values. The union of these ranges defines the set of codepoints that serves as a hint for user agents when deciding whether or not to download a font resource for a given text run.",
keywords => "font face,unicode,unicode-range",
links => [
{
title => "MDN Web Docs - CSS unicode-range",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/unicode-range",
},
{
title => "Safari CSS Reference: unicode-range",
url => "https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/css/property/unicode-range",
},
{
title => "Web Platform Docs: unicode-range",
url => "https://webplatform.github.io/docs/css/properties/unicode-range",
},
{
title => "Demo",
url => "https://jsbin.com/jeqoguzeye/1/edit?html,output",
},
],
notes => "Partial support indicates that unnecessary code-ranges are downloaded by the browser - see [browser test matrix](https://docs.google.com/a/chromium.org/spreadsheets/d/18h-1gaosu4-KYxH8JUNL6ZDuOsOKmWfauoai3CS3hPY/edit?pli=1#gid=0).",
notes_by_num => {
1 => "Can be enabled in Firefox using the `layout.css.unicode-range.enabled` flag",
},
spec => "https://w3c.github.io/csswg-drafts/css-fonts/#unicode-range-desc",
stats => {
and_chr => { "2.1" => "a", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "a" },
chrome => { 4 => "a", 36 => "y" },
edge => { "5.5" => "n", "9" => "a", "17" => "y" },
firefox => { 2 => "n", 36 => "n d #1", 44 => "y" },
ie_mob => { 10 => "a" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "a" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a", 23 => "y" },
safari => { "3.1" => "a", "10" => "y" },
samsung => { "4" => "a", "5.0-5.4" => "y" },
},
status => "cr",
title => "Font unicode-range subsetting",
ucprefix => 0,
},
"font-variant-alternates" => {
categories => ["CSS3"],
chrome_id => 5070560260784128,
description => "Controls the usage of alternate glyphs associated to alternative names defined in \@font-feature-values for certain types of OpenType fonts.",
keywords => "font-feature,font-feature-settings,font-variant",
links => [
{
title => "MDN Web Docs - font-variant-alternates",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-alternates",
},
{
title => "Chromium support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=716567",
},
],
notes_by_num => {
1 => "Low-level syntax available in [font-feature-settings](/font-feature) property equivalent to OpenType features: salt, ss01 through ss20, cv01 through cv99, swsh, cswh, ornm, nalt",
2 => "Experimental support available by enabling the layout.css.font-features.enabled flag",
},
spec => "https://w3c.github.io/csswg-drafts/css-fonts-4/#propdef-font-variant-alternates",
stats => {
and_chr => { "2.1" => "n", "4.4" => "n #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n #1" },
and_uc => { "15.5" => "n #1" },
baidu => { "13.52" => "n #1" },
bb => { 7 => "n", 10 => "n #1" },
chrome => { 4 => "n", 16 => "n #1", 111 => "y" },
edge => { "5.5" => "n", "10" => "n #1", "111" => "y" },
firefox => { 2 => "n", 4 => "n #1", 24 => "n d #2", 34 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "n #1", "7.0-7.1" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "n #1", 98 => "y" },
safari => { "3.1" => "n", "4" => "n #1", "6.1" => "n", "9.1" => "y" },
samsung => { 4 => "n #1", 22 => "y" },
},
status => "wd",
title => "CSS font-variant-alternates",
ucprefix => 0,
},
"font-variant-numeric" => {
categories => ["CSS"],
description => "CSS property that provides different ways of displaying numbers, fractions, and ordinal markers.",
keywords => "normal,ordinal,slashed-zero,lining-nums,oldstyle-nums,proportional-nums,tabular-nums,diagonal-fractions,stacked-fractions,oldstyle-nums,stacked-fractions",
links => [
{
title => "MDN Web Docs article",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-fonts-3/#propdef-font-variant-numeric",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "u" },
chrome => { 4 => "n", 52 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 34 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 39 => "y" },
safari => { "3.1" => "n", "9.1" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "rec",
title => "CSS font-variant-numeric",
ucprefix => 0,
},
"fontface" => {
categories => ["CSS3"],
description => "Method of displaying fonts downloaded from websites",
keywords => "font face",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/Web_typography",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/atrules/font-face",
},
],
notes => "Not supported by IE Mobile 9 and below.",
notes_by_num => {
1 => "Partial support refers to only supporting EOT fonts.",
2 => "Partial support refers to only supporting SVG fonts.",
},
spec => "https://www.w3.org/TR/css3-webfonts/",
stats => {
and_chr => { "2.1" => "n", "2.2" => "a", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a", 10 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "a #1", "9" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a #2", "4.2-4.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "n" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "\@font-face Web fonts",
ucprefix => 0,
},
"form-attribute" => {
categories => ["HTML5"],
description => "Attribute for associating input and submit buttons with a form.",
keywords => "form,attribute",
links => [
{
title => "Input attribute specification",
url => "https://www.w3.org/TR/html5/forms.html#attr-fae-form",
},
{
title => "Article on usage",
url => "https://www.impressivewebs.com/html5-form-attribute/",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/forms.html#attr-fae-form",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 10 => "y" },
edge => { "5.5" => "n", "16" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Form attribute",
ucprefix => 0,
},
"form-submit-attributes" => {
categories => ["HTML5"],
description => "Attributes for form submission that may be specified on submit buttons. The attributes are: `formaction`, `formenctype`, `formmethod`, `formnovalidate`, and `formtarget`",
links => [
{
title => "Article describing each attribute",
url => "https://html5doctor.com/html5-forms-introduction-and-new-attributes/#formaction",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/forms.html#attributes-for-form-submission",
stats => {
and_chr => { "2.1" => "n", "3" => "u", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "u", 11 => "y" },
opera => { "10.0-10.1" => "u", "10.6" => "y", "9" => "n" },
safari => { "3.1" => "n", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Attributes for form submission",
ucprefix => 0,
},
"form-validation" => {
categories => ["HTML5"],
chrome_id => 6091813840486400,
description => "Method of setting required fields and field types without requiring JavaScript. This includes preventing forms from being submitted when appropriate, the `checkValidity()` method as well as support for the `:invalid`, `:valid`, and `:required` CSS pseudo-classes.",
links => [
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/attributes/required",
},
{
title => "WebKit Blog: HTML Interactive Form Validation",
url => "https://webkit.org/blog/7099/html-interactive-form-validation/",
},
],
notes_by_num => {
1 => "Partial support refers to lack of notice when form with required fields is attempted to be submitted.",
2 => "Partial support in IE10 mobile refers to lack of warning when blocking submission.",
3 => "Partial support in Opera Mini refers to only supporting the CSS pseudo classes.",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#client-side-form-validation",
stats => {
and_chr => { "2.1" => "n", "4" => "a #1", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "a #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1", 10 => "y" },
chrome => { 4 => "n", 10 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "a #2" },
ios_saf => { "10.3" => "y", "3.2" => "n", "4.0-4.1" => "a #1" },
kaios => { "2.5" => "a #1", "3.0-3.1" => "y" },
op_mini => { all => "a #3" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "n" },
safari => { "3.1" => "n", "5" => "a #1", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Form validation",
ucprefix => 0,
},
"fullscreen" => {
categories => ["CSS", "JS API"],
chrome_id => 5259513871466496,
description => "API for allowing content (like a video or canvas element) to take up the entire screen.",
keywords => "full-screen,requestFullScreen,exitFullScreen",
links => [
{
title => "MDN Web Docs - Using Full Screen",
url => "https://developer.mozilla.org/en/DOM/Using_full-screen_mode",
},
{
title => "Mozilla hacks article",
url => "https://hacks.mozilla.org/2012/01/using-the-fullscreen-api-in-web-browsers/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/Element/requestFullscreen",
},
],
notes_by_num => {
1 => "Partial support refers to supporting an earlier draft of the spec.",
2 => "Partial support refers to not supporting `::backdrop`, and supporting the old `:full-screen` syntax rather than the standard `:fullscreen`.",
3 => "Partial support refers to not returning a Promise, as specified in the latest version of the spec.",
4 => "Unprefixed support is available behind the `full-screen-api.unprefix.enabled` flag",
5 => "Partial support refers to supporting only iPad, not iPhone. Shows an overlay button which can not be disabled.",
},
spec => "https://fullscreen.spec.whatwg.org/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "a x #2" },
chrome => { 4 => "n", 15 => "a x #1 #3", 20 => "a x #2 #3", 71 => "y" },
edge => { "5.5" => "n", "11" => "a x #3", "12" => "a #3", "79" => "y" },
firefox => { 2 => "n", 10 => "a x #1 #3", 47 => "a x #1 #3 #4", 64 => "y" },
ie_mob => { 10 => "n", 11 => "a x #3" },
ios_saf => { "12.0-12.1" => "a #5", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "12.1" => "y", "15" => "a x #2 #3", "64" => "y" },
safari => {
"3.1" => "n",
"5.1" => "a x #1 #3",
"6" => "a x #2 #3",
"15.4" => "a x #3",
"16.4" => "y",
},
samsung => { "4" => "a x #2 #3", "10.1" => "y" },
},
status => "ls",
title => "Fullscreen API",
ucprefix => 0,
},
"gamepad" => {
categories => ["JS API"],
chrome_id => 5118776383111168,
description => "API to support input from USB gamepad controllers through JavaScript.",
links => [
{
title => "Controller demo",
url => "https://luser.github.io/gamepadtest/",
},
{
title => "MDN Web Docs - Gamepad",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Gamepad_API",
},
{
title => "HTML5Rocks article",
url => "https://www.html5rocks.com/en/tutorials/doodles/gamepad/",
},
{
title => "Detailed tutorial",
url => "https://gamedevelopment.tutsplus.com/tutorials/using-the-html5-gamepad-api-to-add-controller-support-to-browser-games--cms-21345",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/gamepad/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 21 => "y x", 25 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 29 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 24 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Gamepad API",
ucprefix => 0,
},
"geolocation" => {
categories => ["JS API"],
chrome_id => 6348855016685568,
description => "Method of informing a website of the user's geographical location",
links => [
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-geolocation",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/geolocation",
},
{
title => "Geolocation API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API",
},
],
notes_by_num => { 1 => "Only works on secure (https) servers" },
spec => "https://www.w3.org/TR/geolocation-API/",
stats => {
and_chr => { "2.1" => "y", "135" => "y #1" },
and_ff => { 137 => "y #1" },
and_qq => { "14.9" => "y #1" },
and_uc => { "15.5" => "y #1" },
baidu => { "13.52" => "y #1" },
bb => { 7 => "y" },
chrome => { 4 => "a", 5 => "y", 50 => "y #1" },
edge => { "5.5" => "n", "6" => "p", "9" => "y", "79" => "y #1" },
firefox => { "2" => "p", "3.5" => "y", "55" => "y #1" },
ie_mob => { 10 => "y" },
ios_saf => { "10.0-10.2" => "y #1", "3.2" => "y" },
kaios => { "2.5" => "y", "3.0-3.1" => "y #1" },
op_mini => { all => "n" },
op_mob => { 10 => "p", 11 => "y", 80 => "y #1" },
opera => {
"10.0-10.1" => "p",
"10.6" => "y",
"15" => "n",
"16" => "y",
"39" => "y #1",
"9" => "n",
},
safari => { "3.1" => "p", "5" => "y", "10" => "y #1", "10.1" => "y" },
samsung => { "4" => "y", "5.0-5.4" => "y #1" },
},
status => "rec",
title => "Geolocation",
ucprefix => 0,
},
"getboundingclientrect" => {
categories => ["JS API"],
description => "Method to get the size and position of an element's bounding box, relative to the viewport.",
keywords => "getBoundingClientRect,bounding,client,rect,DOMRect,box,cssom",
links => [
{
title => "MDN Web Docs - getBoundingClientRect",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect",
},
{
title => "Microsoft Developer Network",
url => "https://msdn.microsoft.com/en-us/library/ms536433(VS.85).aspx",
},
],
notes_by_num => {
1 => "The returned object lacks `width` and `height` properties.",
2 => "Returns incorrect values for elements which have had CSS `transform`s applied to them.",
3 => "The returned object cannot have new properties added to it; it's not extensible.",
4 => "Existing properties of the returned object are immutable.",
5 => "The returned object lacks `x` & `y` values, though existing `top` & `left` values can be used instead.",
},
spec => "https://www.w3.org/TR/cssom-view/#dom-element-getboundingclientrect",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "a #1 #3", "8" => "a #1 #3 #5", "9" => "y #5", "79" => "y" },
firefox => {
"2" => "n",
"3" => "a #1 #4",
"3.5" => "a #2 #4",
"3.6" => "a #2 #3 #4",
"4" => "a #2",
"12" => "y",
},
ie_mob => { 10 => "y #5" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "a #1", 11 => "y" },
opera => { "10.0-10.1" => "a #1", "10.6" => "y", "9" => "u" },
safari => { "3.1" => "u", "4" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Element.getBoundingClientRect()",
ucprefix => 0,
},
"getcomputedstyle" => {
categories => ["CSS3", "DOM", "JS API"],
description => "API to get the current computed CSS styles applied to an element. This may be the current value applied by an animation or as set by a stylesheet.",
links => [
{
title => "MDN Web Docs - getComputedStyle",
url => "https://developer.mozilla.org/en/DOM/window.getComputedStyle",
},
{
title => "Demo",
url => "https://testdrive-archive.azurewebsites.net/HTML5/getComputedStyle/",
},
{ title => "Polyfill for IE", url => "https://snipplr.com/view/13523" },
],
notes_by_num => {
1 => "Partial support refers to requiring the second parameter to be included.",
2 => "Partial support refers to not supporting getComputedStyle on pseudo-elements.",
},
spec => "https://www.w3.org/TR/cssom/#dom-window-getcomputedstyle",
stats => {
and_chr => { "2.1" => "a #2", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #2", 10 => "y" },
chrome => { 4 => "a #2", 11 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 3 => "a #1", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a #2", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #2" },
op_mob => { 10 => "a #2", 11 => "y" },
opera => { "9" => "a #2", "10.6" => "y" },
safari => { "3.1" => "a #2", "5" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "getComputedStyle",
ucprefix => 0,
},
"getelementsbyclassname" => {
categories => ["DOM", "HTML5"],
description => "Method of accessing DOM elements by class name",
keywords => "byclassname",
links => [
{
title => "Test page",
url => "https://www.quirksmode.org/dom/tests/basics.html#getElementsByClassName",
},
{
title => "getElementsByClassName on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/getElementsByClassName",
},
],
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-document-getelementsbyclassname",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "y" },
firefox => { 2 => "p", 3 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "getElementsByClassName",
ucprefix => 0,
},
"getrandomvalues" => {
categories => ["JS API", "Security"],
description => "Method of generating cryptographically random values.",
links => [
{
title => "MDN Web Docs - crypto.getRandomValues",
url => "https://developer.mozilla.org/en-US/docs/Web/API/window.crypto.getRandomValues",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/WebCryptoAPI/#Crypto-method-getRandomValues",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 11 => "y" },
edge => { "5.5" => "n", "11" => "y x", "12" => "y" },
firefox => { 2 => "n", 21 => "y" },
ie_mob => { 10 => "n", 11 => "y x" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "crypto.getRandomValues()",
ucprefix => 0,
},
"gyroscope" => {
categories => ["JS API"],
chrome_id => 5698781827825664,
description => "Defines a concrete sensor interface to monitor the rate of rotation around the device\x{2019}s local three primary axes.",
links => [
{
title => "Demo",
url => "https://intel.github.io/generic-sensor-demos/",
},
{
title => "Article",
url => "https://developers.google.com/web/updates/2017/09/sensors-for-the-web#gyroscope-sensor",
},
],
notes_by_num => {
1 => "Available by enabling the \"Generic Sensor\" experimental flag in `about:flags`",
},
spec => "https://www.w3.org/TR/gyroscope/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #1", 67 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "Gyroscope",
ucprefix => 0,
},
"hardwareconcurrency" => {
categories => ["JS API"],
chrome_id => 6248386202173440,
description => "Returns the number of logical cores of the user's CPU. The value may be reduced to prevent device fingerprinting or because it exceeds the allowed number of simultaneous web workers.",
keywords => "navigator,cores,hardware,concurrency,hardwareConcurrency",
links => [
{
title => "MDN Web Docs - navigator.hardwareConcurrency",
url => "https://developer.mozilla.org/en-US/docs/Web/API/NavigatorConcurrentHardware/hardwareConcurrency",
},
{
title => "Original Proposal",
url => "https://wiki.whatwg.org/wiki/Navigator_HW_Concurrency",
},
{
title => "WebKit implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=132588",
},
{
title => "WebKit reinstatement bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=233381",
},
],
notes_by_num => {
1 => "WebKit browsers clamp the maximum value returned to 2 on iOS devices and 8 on all others. Disabled in Safari behind the ENABLE_NAVIGATOR_HWCONCURRENCY build option.",
2 => "Safari clamps this property to 4 or 8 cores, to prevent device fingerprinting.",
},
spec => "https://html.spec.whatwg.org/multipage/workers.html#navigator.hardwareconcurrency",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 37 => "y" },
edge => { "5.5" => "n", "15" => "y" },
firefox => { 2 => "n", 48 => "y" },
ie_mob => { 10 => "n" },
ios_saf => {
"10.3" => "y #1",
"11.0-11.2" => "n",
"15.4" => "y #2",
"3.2" => "n",
"8" => "n d #1",
},
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 24 => "y" },
safari => { "3.1" => "n", "8" => "n d #1", "10.1" => "y #1", "11" => "n", "15.4" => "y #2" },
samsung => { 4 => "y" },
},
status => "ls",
title => "navigator.hardwareConcurrency",
ucprefix => 0,
},
"hashchange" => {
categories => ["HTML5", "JS API"],
description => "Event triggered in JavaScript when the URL's hash has changed (for example: page.html#foo to page.html#bar) ",
keywords => "onhashchange,HashChangeEvent",
links => [
{
title => "MDN Web Docs - onhashchange",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Window/hashchange_event",
},
{
title => "Simple demo",
url => "https://www.quirksmode.org/dom/events/tests/hashchange.html",
},
{ title => "Polyfill", url => "https://github.com/3nr1c/jUri.js" },
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/Element/hashchange",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/browsers.html#the-hashchangeevent-interface",
stats => {
and_chr => { "2.1" => "n", "2.2" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "p", 5 => "y" },
edge => { "5.5" => "p", "8" => "y" },
firefox => { "2" => "p", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "p", 11 => "y" },
opera => { "9" => "p", "10.6" => "y" },
safari => { "3.1" => "p", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Hashchange event",
ucprefix => 0,
},
"heif" => {
categories => ["Other"],
description => "A modern image format based on the [HEVC video format](/hevc). HEIC generally has better compression than [WebP](/webp), JPEG, PNG and GIF. It is hard for browsers to support HEIC because it is [complex and expensive to license](https://en.wikipedia.org/wiki/High_Efficiency_Video_Coding#Patent_licensing). [AVIF](/avif) and [JPEG XL](/jpegxl) provide free licenses and are designed to supersede HEIC.",
keywords => "heic,hevc",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/High_Efficiency_Image_File_Format",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=HEIF",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=230035",
},
],
notes_by_num => {
1 => "Was supported natively in macOS/iOS, but was not supported in Safari.",
},
spec => "https://nokiatech.github.io/heif/technical.html",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "n #1", "16.6-16.7" => "n", "17.0" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "11" => "n #1", "17.0" => "y" },
samsung => { 4 => "n" },
},
status => "other",
title => "HEIF/HEIC image format",
ucprefix => 0,
},
"hevc" => {
categories => ["Other"],
description => "The High Efficiency Video Coding (HEVC) compression standard is a video compression format intended to succeed H.264. It is hard for browsers to universally support HEVC because it is [complex and expensive to license](https://en.wikipedia.org/wiki/High_Efficiency_Video_Coding#Patent_licensing). HEVC competes with [AV1](/av1) which has similar compression quality and provides a free license.",
keywords => "h265",
links => [
{
title => "Firefox support bug (WONTFIX)",
url => "https://bugzilla.mozilla.org/show_bug.cgi?format=default&id=1332136",
},
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/High_Efficiency_Video_Coding",
},
{
title => "Chrome support bug (WontFix)",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=684382",
},
{
title => "Firefox support via OS API bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1842838",
},
],
notes_by_num => {
1 => "Supported only for devices with [hardware support](https://answers.microsoft.com/en-us/insider/forum/insider_apps-insider_wmp/windows-10-hevc-playback-yes-or-no/3c1ab780-a6b2-4b77-ac0f-9faeefd4680d)",
2 => "Reported to work in certain Android devices with hardware support",
3 => "Supported only on macOS High Sierra or later",
4 => "Supported for all devices on macOS (>= Big Sur 11.0) and Android (>= 5.0) if Edge >= 107, for devices with [hardware support](https://techcommunity.microsoft.com/t5/discussions/updated-dev-channel-build-77-0-211-3-is-live/m-p/745801#M6548) on Windows (>= Windows 10 1709) when [HEVC video extensions from the Microsoft Store](https://apps.microsoft.com/store/detail/hevc-video-extension/9NMZLZ57R3T7) is installed",
5 => "Supported for all devices on macOS (>= Big Sur 11.0) and Android (>= 5.0), for devices with [hardware support](https://github.com/StaZhu/enable-chromium-hevc-hardware-decoding) on Windows (>= Windows 8), and for devices with hardware support powered by VAAPI on Linux and ChromeOS",
6 => "Supported for devices with hardware support (the range is the same as Edge) on Windows in Nightly only. 10-bit or higher colors are not supported.",
7 => "Supported for devices with hardware support (the range is the same as Edge) on Windows only. Enabled by default in Nightly and can be enabled via the `media.wmf.hevc.enabled` pref in `about:config`. 10-bit or higher colors are not supported.",
8 => "Supported for devices with hardware support, software fallback in some cases. See [details here on MDN](https://developer.mozilla.org/en-US/docs/Web/Media/Guides/Formats/Video_codecs#hevc_h.265).",
},
parent => "video",
spec => "https://www.itu.int/rec/T-REC-H.265",
stats => {
and_chr => { "2.1" => "n", "135" => "a #5" },
and_ff => { 137 => "a #8" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 107 => "a #5" },
edge => { "5.5" => "n", "11" => "a #1", "79" => "a #4" },
firefox => { 2 => "n", 120 => "n #6", 121 => "n d #7", 137 => "a #8" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "n #2" },
opera => { 9 => "n", 94 => "a #5" },
safari => { "3.1" => "n", "11" => "a #3", "13" => "y" },
samsung => { "21" => "y", "4" => "n", "5.0-5.4" => "n #2" },
},
status => "other",
title => "HEVC/H.265 video format",
ucprefix => 0,
},
"hidden" => {
categories => ["HTML5"],
description => "The `hidden` attribute may be applied to any element, and effectively hides elements similar to `display: none` in CSS.",
links => [
{
title => "Article on hidden attribute",
url => "https://davidwalsh.name/html5-hidden",
},
],
notes => "The hidden state can be easily overridden with a CSS `display` property set to anything other than `none`.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/interaction.html#the-hidden-attribute",
stats => {
and_chr => { "2.1" => "n", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 6 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "11.1" => "y" },
opera => { "9" => "n", "11.1" => "y" },
safari => { "3.1" => "n", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "hidden attribute",
ucprefix => 0,
},
"high-resolution-time" => {
categories => ["JS API"],
chrome_id => 5349124069130240,
description => "Method to provide the current time in sub-millisecond resolution and such that it is not subject to system clock skew or adjustments. Called using `performance.now()`",
keywords => "performance,now,testing",
links => [
{
title => "MDN Web Docs - Performance.now",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Performance.now()",
},
{
title => "HTML5Rocks article",
url => "https://developer.chrome.com/blog/when-milliseconds-are-not-enough-performance-now/",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/discovering-the-high-resolution-time-api/",
},
{
title => "Demo",
url => "https://audero.it/demo/high-resolution-time-api-demo.html",
},
],
notes => "The timestamp is not actually high-resolution. To mitigate security threats such as Spectre, browsers currently round the result to varying degrees.",
notes_by_num => {
1 => "In Firefox 55-57, the `privacy.resistFingerprinting` preference can be enabled to change the precision to 100ms.",
2 => "In Firefox, the `privacy.resistFingerprinting` preference can be enabled to change the precision to 100ms or the value of `privacy.resistFingerprinting.reduceTimerPrecision.microseconds`, whichever is larger.",
3 => "In Firefox 58-59, the `privacy.reduceTimerPrecision` preference is enabled by default and defaults to 20us.",
4 => "In Firefox, the `privacy.reduceTimerPrecision` preference is enabled by default and defaults to 2ms.",
},
spec => "https://www.w3.org/TR/hr-time/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 20 => "y x", 24 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 15 => "y", 55 => "y #1", 58 => "y #2 #3", 60 => "y #2 #4" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "8" => "y", "8.1-8.4" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "8" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "High Resolution Time API",
ucprefix => 0,
},
"history" => {
categories => ["HTML5"],
description => "Method of manipulating the user's browser's session history in JavaScript using `history.pushState`, `history.replaceState` and the `popstate` event.",
keywords => "onpushstate,onreplacestate",
links => [
{
title => "Introduction to history management",
url => "https://www.adequatelygood.com/Saner-HTML5-History-Management.html",
},
{
title => "MDN Web Docs - Manipulating the browser history",
url => "https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history",
},
{ title => "Demo page", url => "https://html5demos.com/history" },
{
title => "History.js polyfill",
url => "https://github.com/browserstate/history.js",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-history-state",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/History",
},
],
notes => "Older iOS versions and Android 4.0.4 claim support, but implementation is too buggy to be useful.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/browsers.html#dom-history-pushstate",
stats => {
and_chr => { "2.1" => "n", "2.2" => "y", "3" => "n", "4.2-4.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 5 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.2-4.3" => "a", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "y" },
opera => { "9" => "n", "11.5" => "y" },
safari => { "3.1" => "n", "5" => "a", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Session history management",
ucprefix => 0,
},
"html-media-capture" => {
categories => ["HTML5"],
description => "Facilitates user access to a device's media capture mechanism, such as a camera, or microphone, from within a file upload control.",
keywords => "htmlmediacapture, html media capture, media capture, mediacapture",
links => [
{
title => "Correct Syntax for HTML Media Capture",
url => "https://addpipe.com/blog/correct-syntax-html-media-capture/",
},
{
title => "Programming the Mobile Web: File upload compatibility table",
url => "https://books.google.com.au/books?id=gswdarRZVUoC&pg=PA263&dq=%22file+upload+compatibility+table%22",
},
{
title => "HTML Media Capture Test Bench",
url => "https://addpipe.com/html-media-capture-demo/",
},
],
notes_by_num => {
1 => "Does not support the capture attribute used to force capture straight from the device's camera or microphone. Also note that default video dimensions are 480x320 (4:3).",
2 => "Android 2.2-2.3 do not support the capture attribute",
3 => "Supports a \"capture\" button for any `<input type=\"file\"> field, regardless of whether the capture attribute is used.",
},
spec => "https://w3c.github.io/html-media-capture/",
stats => {
and_chr => { "2.1" => "n", "2.2" => "y #2", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "a #3" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "y" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y #1" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "y" },
},
status => "rec",
title => "HTML Media Capture",
ucprefix => 0,
},
"html5semantic" => {
categories => ["HTML5"],
description => "HTML5 offers some new elements, primarily for semantic purposes. The elements include: `section`, `article`, `aside`, `header`, `footer`, `nav`, `figure`, `figcaption`, `time`, `mark` & `main`.",
keywords => "section,article,aside,header,footer,nav,figure,figcaption,time,mark,main,<section>,<article>,<aside>,<header>,<footer>,<nav>,<figure>,<figcaption>,<time>,<mark>,<main>",
links => [
{
title => "Workaround for IE",
url => "https://blog.whatwg.org/supporting-new-elements-in-ie",
},
{
title => "Alternate workaround",
url => "https://blog.whatwg.org/styling-ie-noscript",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/dom.js#dom-html5-elements",
},
{
title => "Chrome Platform Status: `<time>` element",
url => "https://www.chromestatus.com/feature/5633937149788160",
},
],
notes_by_num => {
1 => "Partial support refers to missing the default styling, as technically the elements are considered \"[unknown](https://developer.mozilla.org/en-US/docs/Web/API/HTMLUnknownElement)\". This is easily taken care of by manually setting the default `display` value for each tag.",
2 => "Partial support refers to only the `<main>` element (added later to the spec) being \"unknown\", though it can still be used and styled.",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#sections",
stats => {
and_chr => { "2.1" => "a #1", "2.2" => "a #2", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #2" },
chrome => { 4 => "a #1", 6 => "a #2", 26 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "a #2", "12" => "y" },
firefox => { 2 => "n", 3 => "a #1", 4 => "a #2", 21 => "y" },
ie_mob => { 10 => "a #2" },
ios_saf => { "3.2" => "a #1", "4.0-4.1" => "a #2", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { 10 => "a #1", 11 => "a #2", 80 => "y" },
opera => { "9" => "a #1", "11.1" => "a #2", "15" => "y" },
safari => { "3.1" => "a #1", "5" => "a #2", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "HTML5 semantic elements",
ucprefix => 0,
},
"http-live-streaming" => {
categories => ["Other"],
description => "HTTP-based media streaming communications protocol",
keywords => "apple http live streaming,m3u8",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/HTTP_Live_Streaming",
},
{
title => "Apple developer article",
url => "https://developer.apple.com/streaming/",
},
],
notes => "HLS can be used with a JavaScript library in browsers that doesn't support it natively as long as they support [Media Source Extensions](/mediasource).",
notes_by_num => {},
spec => "https://tools.ietf.org/html/rfc8216",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "12" => "y", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "HTTP Live Streaming (HLS)",
ucprefix => 0,
},
"http2" => {
categories => ["Other"],
chrome_id => 5152586365665280,
description => "Networking protocol for low-latency transport of content over the web. Originally started out from the SPDY protocol, now standardized as HTTP version 2.",
keywords => "https/2",
links => [
{
title => "Wikipedia article about HTTP/2",
url => "https://en.wikipedia.org/wiki/HTTP/2",
},
{
title => "Browser support test",
url => "https://http2.akamai.com/demo",
},
],
notes => "HTTP/2 is only supported over TLS (HTTPS). See also the precursor of HTTP/2, [the SPDY protocol](https://caniuse.com/#feat=spdy), which has been deprecated and removed from most browsers, in favor of HTTP/2.",
notes_by_num => {
1 => "Partial support in Internet Explorer refers to being limited to Windows 10.",
2 => "Partial support in Safari refers to being limited to OS X 10.11 El Capitan and newer.",
3 => "Only supports HTTP/2 if the server supports protocol negotiation via ALPN.",
},
spec => "https://tools.ietf.org/html/rfc7540",
stats => {
and_chr => { "2.1" => "n", "135" => "y #3" },
and_ff => { 137 => "y #3" },
and_qq => { "14.9" => "y #3" },
and_uc => { "15.5" => "y #3" },
baidu => { "13.52" => "y #3" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "y", 51 => "y #3" },
edge => { "5.5" => "n", "11" => "a #1", "12" => "y", "79" => "y #3" },
firefox => { 2 => "n", 36 => "y", 53 => "y #3" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y", "3.0-3.1" => "y #3" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #3" },
opera => { 9 => "n", 28 => "y", 38 => "y #3" },
safari => { "3.1" => "n", "9" => "a #2", "11" => "y" },
samsung => { "4" => "y", "5.0-5.4" => "y #3" },
},
status => "other",
title => "HTTP/2 protocol",
ucprefix => 0,
},
"http3" => {
categories => ["Other"],
chrome_id => 5338403830759424,
description => "Third version of the HTTP networking protocol which uses QUIC as transport protocol. Previously known as HTTP-over-QUIC, now standardized as HTTP/3.",
keywords => "https/3",
links => [
{
title => "Wikipedia article about HTTP/3",
url => "https://en.wikipedia.org/wiki/HTTP/3",
},
],
notes_by_num => {
1 => "Can be enabled in Firefox via the `network.http.http3.enabled` pref in `about:config`.",
2 => "Can be enabled in Chrome(Chromium) via the `--enable-quic` & `--quic-version=h3-23` command line arguments.",
3 => "Can be enabled in Chrome(Chromium) via the `--enable-quic` & `--quic-version=h3-29` command line arguments.",
4 => "Requires macOS 11 Big Sur or later.",
5 => "Since Sept 2024, HTTP3 is enabled for all users of Safari 16 and newer. Before then, it was enabled for a subset of users. Enabling the feature flag ensured support.",
},
spec => "https://datatracker.ietf.org/doc/rfc9114/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 79 => "n d #2", 85 => "n d #3", 87 => "y" },
edge => { "5.5" => "n", "79" => "n d #2", "85" => "n d #3", "87" => "y" },
firefox => { 2 => "n", 72 => "n d #1", 88 => "y" },
ie_mob => { 10 => "n" },
ios_saf => {
"14.0-14.4" => "a d #5",
"16.0" => "y d #5",
"16.4" => "y #5",
"18.0" => "y",
"3.2" => "n",
},
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 73 => "n d #3", 74 => "y" },
safari => {
"3.1" => "n",
"14" => "a d #4 #5",
"16.0" => "y d #5",
"16.4" => "y #5",
"18.0" => "y",
},
samsung => { "4" => "n", "14.0" => "y" },
},
status => "other",
title => "HTTP/3 protocol",
ucprefix => 0,
},
"iframe-sandbox" => {
categories => ["HTML5", "Security"],
chrome_id => 5715536319086592,
description => "Method of running external site pages with reduced privileges (e.g. no JavaScript) in iframes.",
links => [
{
title => "Chromium blog article",
url => "https://blog.chromium.org/2010/05/security-in-depth-html5s-sandbox.html",
},
{
title => "MSDN article",
url => "https://msdn.microsoft.com/en-us/hh563496",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/attributes/sandbox",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/iframe-embed-object.html#attr-iframe-sandbox",
stats => {
and_chr => { "2.1" => "n", "2.2" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 5 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 17 => "a", 28 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "sandbox attribute for iframes",
ucprefix => 0,
},
"iframe-seamless" => {
categories => ["HTML5"],
chrome_id => 6630329993396224,
description => "The seamless attribute makes an iframe's contents actually part of a page, and adopts the styles from its hosting page. The attribute has been removed from both [the WHATWG](https://github.com/whatwg/html/issues/331) and [the W3C](https://github.com/w3c/html/pull/325) HTML5 specifications.",
links => [
{
title => "Experimental polyfill",
url => "https://github.com/ornj/seamless-polyfill",
},
{
title => "Article",
url => "https://labs.ft.com/2013/01/seamless-iframes-not-quite-seamless/",
},
{
title => "Bug on Firefox support: wontfix",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=631218",
},
],
notes => "Chrome 20-26 had partial support behind a flag, though this was [later removed](https://bugs.chromium.org/p/chromium/issues/detail?id=229421).",
notes_by_num => {
1 => "Hides the border of seamless iframes and recognizes the 'seamless' DOM property, but does not provide actual support.",
},
spec => "https://www.w3.org/TR/2011/WD-html5-20110525/the-iframe-element.html#attr-iframe-seamless",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 20 => "n d", 27 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "n #1", "8" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "7" => "n #1", "8" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "seamless attribute for iframes",
ucprefix => 0,
},
"iframe-srcdoc" => {
categories => ["HTML5"],
chrome_id => 5222955109842944,
description => "Override the content specified in the `src` attribute (if present) with HTML content within the attribute.",
links => [
{
title => "MDN Web Docs - iframe",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe",
},
{
title => "Srcdoc Polyfill",
url => "https://github.com/jugglinmike/srcdoc-polyfill",
},
{
title => "Article",
url => "https://bocoup.com/weblog/third-party-javascript-development-future/",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#attr-iframe-srcdoc",
stats => {
and_chr => { "2.1" => "p", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p", 10 => "y" },
chrome => { 4 => "n", 14 => "p", 20 => "y" },
edge => { "5.5" => "n", "6" => "p", "79" => "y" },
firefox => { 2 => "n", 3 => "p", 25 => "y" },
ie_mob => { 10 => "p" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "p", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "p", "80" => "y" },
opera => { "9" => "n", "11.1" => "p", "15" => "y" },
safari => { "3.1" => "n", "4" => "p", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "srcdoc attribute for iframes",
ucprefix => 0,
},
"imagecapture" => {
categories => ["DOM", "JS API"],
description => "The Image Capture API provides access to the Video Camera for taking photos while configuring picture-specific settings such as e.g. zoom or auto focus metering area.",
keywords => "camera,device,photos,media stream,mediastream,Image Capture API",
links => [
{
title => "Minimal code pen",
url => "https://codepen.io/miguelao/pen/ZOkOQw",
},
{
title => "Extended demo",
url => "https://rawgit.com/Miguelao/demos/master/imagecapture.html",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=888177",
},
],
notes => "Firefox supports the `takePhoto()` method only (when flag is enabled).",
notes_by_num => {
1 => "Can be enabled via the about:config entry dom.imagecapture.enabled.",
2 => "Can be enabled via the Experimental Web Platform Features flag.",
3 => "Partial support refers to not supporting `grabFrame()`.",
},
parent => "stream",
spec => "https://w3c.github.io/mediacapture-image/#imagecaptureapi",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 53 => "n d #2", 59 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 35 => "n d #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 40 => "n d #2", 46 => "y" },
safari => { "3.1" => "n", "TP" => "a #3" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "ImageCapture API",
ucprefix => 0,
},
"ime" => {
categories => ["JS API"],
chrome_id => 6366722080636928,
description => "Provides scripted access to the Input Method Editor (IME). An IME is often used to input characters from East Asian languages by typing roman characters and selecting from the resulting suggestions.",
keywords => "ime,cjk,input,internationalization,inputMethodContext,candidatewindow,composition",
links => [
{
title => "Building Better Input Experience for East Asian Users with the IME API in IE11",
url => "https://web.archive.org/web/20140403042251/http://blogs.msdn.com/b/ie/archive/2014/03/31/building-better-input-experience-for-east-asian-users-with-the-ime-api-in-ie11.aspx",
},
],
notes_by_num => {
1 => "Prefixed implementation uses `msGetInputContext()` method from an earlier version of the spec to get the `InputMethodContext`, rather than the `inputMethodContext` attribute. Also includes support for `getCompositionAlternatives()` from the latest Editor'",
},
spec => "https://www.w3.org/TR/ime-api/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "11" => "y x #1", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n", 11 => "y x #1" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Input Method Editor API",
ucprefix => 0,
},
"img-naturalwidth-naturalheight" => {
categories => ["DOM", "HTML5"],
description => "Properties defining the intrinsic width and height of the image, rather than the displayed width & height.",
links => [
{
title => "Blog post on support in IE",
url => "https://www.jacklmoore.com/notes/naturalwidth-and-naturalheight-in-ie/",
},
{
title => "gist on getting natural width & height in older IE",
url => "https://gist.github.com/jalbertbowden/5273983",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#dom-img-naturalwidth",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "naturalWidth & naturalHeight image properties",
ucprefix => 0,
},
"import-maps" => {
categories => ["JS"],
chrome_id => 5315286962012160,
description => "Import maps allow control over what URLs get fetched by JavaScript `import` statements and `import()` expressions.",
keywords => "importmap",
links => [
{
title => "Proposal information",
url => "https://github.com/WICG/import-maps#readme",
},
{
title => "Using ES modules in browsers with import-maps",
url => "https://blog.logrocket.com/es-modules-in-browsers-with-import-maps/",
},
{
title => "Firefox feature request bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1688879",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=220823",
},
],
notes_by_num => {
1 => "Can be enabled via the \"Experimental Web Platform features\" flag at `about:flags`.",
2 => "Can be enabled via the `dom.importMaps.enabled` pref in `about:config`.",
},
spec => "https://wicg.github.io/import-maps/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "n d #1", 89 => "y" },
edge => { "5.5" => "n", "79" => "n d #1", "89" => "y" },
firefox => { 2 => "n", 102 => "n d #2", 108 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "n d #1", 76 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { "4" => "n", "15.0" => "y" },
},
status => "unoff",
title => "Import maps",
ucprefix => 0,
},
"imports" => {
categories => ["DOM", "HTML5"],
chrome_id => 5144752345317376,
description => "Deprecated method of including and reusing HTML documents in other HTML documents. Superseded by ES modules.",
keywords => "webcomponents",
links => [
{
title => "HTML5Rocks - HTML Imports: #include for the web",
url => "https://www.html5rocks.com/tutorials/webcomponents/imports/",
},
{
title => "Chromium tracking bug: Implement HTML Imports",
url => "https://code.google.com/p/chromium/issues/detail?id=240592",
},
{
title => "Firefox tracking bug: Implement HTML Imports",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=877072",
},
{
title => "IE Web Platform Status and Roadmap: HTML Imports",
url => "https://developer.microsoft.com/en-us/microsoft-edge/status/htmlimports/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/html-imports/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "p" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 30 => "n d", 35 => "p d", 36 => "y", 80 => "n" },
edge => { "5.5" => "n", "10" => "p", "79" => "y", "80" => "n" },
firefox => { 2 => "n", 30 => "p", 32 => "p d", 56 => "p" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "p" },
kaios => { "2.5" => "y", "3.0-3.1" => "p" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 17 => "n d", 22 => "p d", 23 => "y", 67 => "n" },
safari => { "3.1" => "n", "6" => "p" },
samsung => { "4" => "y", "13.0" => "n" },
},
status => "wd",
title => "HTML Imports",
ucprefix => 0,
},
"indeterminate-checkbox" => {
categories => ["DOM", "HTML5"],
description => "Indeterminate checkboxes are displayed in a state which is distinct both from being checked or being unchecked. They are commonly used in hierarchical checkboxes to indicate that only some of the checkbox's descendants are checked.",
links => [
{
title => "CSS-Tricks article",
url => "https://css-tricks.com/indeterminate-checkboxes/",
},
{
title => "iOS versions below 12 don't support indeterminate checkboxes (WebKit Bug 160484)",
url => "https://bugs.webkit.org/show_bug.cgi?id=160484",
},
],
notes => "Indeterminacy does not affect a checkbox's checkedness state. It merely affects how the checkbox is displayed.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/#dom-input-indeterminate",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 28 => "y" },
edge => { "5.5" => "u", "6" => "y" },
firefox => { "2" => "n", "3.5" => "u", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "12.2-12.5" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "11.6" => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "indeterminate checkbox",
ucprefix => 0,
},
"indexeddb" => {
categories => ["JS API"],
chrome_id => 6507459568992256,
description => "Method of storing data client-side, allows indexed database queries.",
keywords => "indexdb",
links => [
{
title => "Mozilla Hacks article",
url => "https://hacks.mozilla.org/2010/06/comparing-indexeddb-and-webdatabase/",
},
{
title => "Polyfill for browsers supporting WebSQL",
url => "https://github.com/axemclion/IndexedDBShim",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-indexeddb",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/indexeddb",
},
],
notes_by_num => {
1 => "Partial support in IE 10 & 11 refers to a number of subfeatures [not being supported](https://indexdb-support-test.glitch.me/). Edge does not support IndexedDB inside blob web workers. [See issue](https://web.archive.org/web/20171213082727/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/5942817/)",
2 => "Partial support in Safari 7.1 \x{2013} 9.3 refers to [seriously buggy behavior](http://www.raymondcamden.com/2014/09/25/IndexedDB-on-iOS-8-Broken-Bad/) as well as a lack of support in WebViews.",
3 => "Partial support [refers to a bug](https://bugs.webkit.org/show_bug.cgi?id=226547) in Safari 14.1.1 that causes indexedDB to not load when the browser is initially opened.",
},
spec => "https://www.w3.org/TR/IndexedDB/",
stats => {
and_chr => { "2.1" => "p", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p", 10 => "y" },
chrome => { 4 => "p", 10 => "n", 11 => "a x", 23 => "y x", 24 => "y" },
edge => { "5.5" => "n", "10" => "a #1", "79" => "y" },
firefox => { 2 => "n", 4 => "a x", 10 => "y x", 16 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => {
"10.0-10.2" => "y",
"14.5-14.8" => "a #3",
"15.0-15.1" => "y",
"3.2" => "p",
"8" => "a #2",
},
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "p", 80 => "y" },
opera => { "9" => "n", "10.5" => "p", "15" => "y" },
safari => { "3.1" => "p", "7.1" => "a #2", "10" => "y", "14.1" => "a #3", "15" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "IndexedDB",
ucprefix => 0,
},
"indexeddb2" => {
categories => ["JS API"],
chrome_id => "5812621622116352,6571252802125824,6537756637396992",
description => "Improvements to Indexed DB, including getAll(), renaming stores and indexes, and binary keys.",
keywords => "indexdb,indexeddb,idb",
links => [
{
title => "Mozilla Hacks: What's new in IndexedDB 2.0?",
url => "https://hacks.mozilla.org/2016/10/whats-new-in-indexeddb-2-0/",
},
{
title => "MDN Web Docs - IndexedDB API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API",
},
],
notes_by_num => {
1 => "Missing: IDBKeyRange includes(), renaming stores/indexes, binary keys, IDBObjectStore getKey(), IDBCursor continuePrimaryKey()",
2 => "Missing: Renaming stores/indexes, binary keys, IDBObjectStore getKey(), IDBCursor continuePrimaryKey()",
},
spec => "https://www.w3.org/TR/IndexedDB-2/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 48 => "a #1", 52 => "a #2", 58 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 44 => "a #1", 47 => "a #2", 51 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "u", "10.3" => "y", "3.2" => "n" },
kaios => { "2.5" => "a #2", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 35 => "a #1", 39 => "a #2", 45 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a #2", "7.2-7.4" => "y" },
},
status => "rec",
title => "IndexedDB 2.0",
ucprefix => 0,
},
"inline-block" => {
categories => ["CSS2"],
description => "Method of displaying an element as a block while flowing it with text. ",
keywords => "inlineblock,display:inline-block",
links => [
{
title => "Blog post w/info",
url => "https://robertnyman.com/2010/02/24/css-display-inline-block-why-it-rocks-and-why-it-sucks/",
},
{
title => "Info on cross browser support",
url => "https://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/display",
},
],
notes_by_num => {
1 => "Only supported in IE6 and IE7 on elements with a display of \"inline\" by default. [Alternative properties](http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/) are available to provide complete cross-browser support.",
},
spec => "https://www.w3.org/TR/CSS21/visuren.html#fixed-positioning",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "a", "6" => "a #1", "8" => "y" },
firefox => { 2 => "a x", 3 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS inline-block",
ucprefix => 0,
},
"innertext" => {
categories => ["DOM"],
description => "A property representing the text within a DOM element and its descendants. As a getter, it approximates the text the user would get if they highlighted the contents of the element with the cursor and then copied to the clipboard.",
keywords => "inner,text,content",
links => [
{
title => "MDN Web Docs - innerText",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/innerText",
},
{
title => "WHATWG Compatibility Standard issue #5: spec innerText",
url => "https://github.com/whatwg/compat/issues/5",
},
{
title => "Rangy, a JS range and selection library which contains an innerText implementation",
url => "https://github.com/timdown/rangy",
},
{
title => "Standardizing innerText \x{2013} Web Incubator Community Group (WICG) discussion",
url => "https://discourse.wicg.io/t/standardizing-innertext/799",
},
],
notes => "This test only checks that the property exists and works correctly in a very simple case.\r\n[This blog post by kangax](http://perfectionkills.com/the-poor-misunderstood-innerText/) explains the history of this property, gives much more detailed cross-browser compatibility information, and gives a detailed strawman specification for the property.\r\n`HTMLElement.innerText` is similar to, but has some important differences from, the standard [`Node.textContent`](https://caniuse.com/#feat=textcontent) property.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/dom.html#the-innertext-idl-attribute",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "u", "6" => "y" },
firefox => { 2 => "n", 45 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "u", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "HTMLElement.innerText",
ucprefix => 0,
},
"input-autocomplete-onoff" => {
categories => ["DOM"],
description => "The `autocomplete` attribute for `input` elements indicates to the browser whether a value should or should not be autofilled when appropriate.",
links => [
{
title => "MDN Web Docs - autocomplete attribute",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete",
},
],
notes => "This support information does not include support for other `autocomplete` values.\r\n\r\nAs described in detail below, many modern browsers ignore the `off` value on certain fields in certain cases intentionally in order to give the user more control over autofilling fields. One example is the use of password managers.",
notes_by_num => {
1 => "Partial support refers to ignoring the `off` value for password fields. [see related blog post](http://blogs.msdn.com/b/ieinternals/archive/2009/09/10/troubleshooting-stored-login-problems-in-ie.aspx)",
2 => "Partial support in Chrome refers to the browser intentionally ignoring `autocomplete=\"off\"` when the user uses the browser's autofill functionality. [see bug](https://code.google.com/p/chromium/issues/detail?id=468153#c29)",
3 => "Partial support in Firefox refers to ignoring `autocomplete=\"off\"` for login forms. [see bug](https://bugzilla.mozilla.org/show_bug.cgi?id=956906)",
4 => "Browser does not display previously submitted values as options with `on` value.",
5 => "Safari ignores the `off` value for [username, email and password fields](https://stackoverflow.com/questions/22661977/disabling-safari-autofill-on-usernames-and-passwords)",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#autofill",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #2" },
and_uc => { "15.5" => "y #4" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 17 => "y", 27 => "a #1", 41 => "a #2" },
edge => { "5.5" => "y", "11" => "a #1", "79" => "a #2" },
firefox => { 2 => "y", 30 => "a #3" },
ie_mob => { 10 => "a #5" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y #4" },
kaios => { "2.5" => "a #3" },
op_mini => { all => "y #4" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "n", "5.1" => "y", "7" => "a #5" },
samsung => { 4 => "y" },
},
status => "ls",
title => "autocomplete attribute: on & off values",
ucprefix => 0,
},
"input-color" => {
categories => ["HTML5"],
description => "Form field allowing the user to select a color.",
keywords => "colour,input type=\"color\"",
links => [
{
title => "Polyfill",
url => "https://github.com/jonstipe/color-polyfill",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/input/type/color",
},
{
title => "MDN web docs",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/color",
},
],
notes_by_num => {
1 => "Supported through WKWebView and Safari but not through UIWebView",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#color-state-(type=color)",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 20 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 29 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.2-12.5" => "y #1", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { 9 => "n", 11 => "y", 15 => "n", 17 => "y" },
safari => { "3.1" => "n", "12.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Color input type",
ucprefix => 0,
},
"input-datetime" => {
categories => ["HTML5"],
chrome_id => 6640933999214592,
description => "Form field widgets to easily allow users to enter a date, time or both, generally by using a calendar/time input widget. Refers to supporting the following input types: `date`, `time`, `datetime-local`, `month` & `week`.",
keywords => "datepicker,timepicker,inputdate,input type=\"date\",input type=\"time\",input date,datetime-local",
links => [
{
title => "Datepicker tutorial w/polyfill",
url => "https://code.tutsplus.com/tutorials/quick-tip-create-cross-browser-datepickers-in-minutes--net-20236",
},
{
title => "Polyfill for HTML5 forms",
url => "https://github.com/zoltan-dulac/html5Forms.js",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/form.js#input-type-datetime-local",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/input/type/date",
},
{
title => "Bug on Firefox support",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=888320",
},
{
title => "Bug for WebKit/Safari",
url => "https://bugs.webkit.org/show_bug.cgi?id=119175",
},
{
title => "Bug for WebKit/Safari",
url => "https://bugs.webkit.org/show_bug.cgi?id=214946",
},
],
notes => "There used to also be a `datetime` type, but it was [dropped from the HTML spec](https://github.com/whatwg/html/issues/336).",
notes_by_num => {
1 => "Partial support in Microsoft Edge refers to supporting `date`, `week`, and `month` input types, and not `time` and `datetime-local`.",
2 => "Partial support in iOS Safari refers to not supporting the `week` input type, nor the `min`, `max` or `step` attributes.",
3 => "Some modified versions of the Android 4.x browser do have support for date/time fields.",
4 => "Can be enabled in Firefox using the `dom.forms.datetime` flag.",
5 => "Partial support refers to supporting `date` and `time` input types, but not `datetime-local`, `month` or `week`.",
6 => "Partial support refers to not supporting the `week` and `month` input type.",
7 => "Does not support the `min`, `max` or `step` attributes on date inputs.",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#date-state-(type=date)",
stats => {
and_chr => { "2.1" => "n", "4" => "n #3", "4.4" => "y" },
and_ff => { 137 => "a #6" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 20 => "a #5", 25 => "y" },
edge => { "5.5" => "n", "12" => "a #1", "13" => "y" },
firefox => { 2 => "n", 53 => "n d #4", 57 => "a #5", 93 => "a #6" },
ie_mob => { 10 => "n" },
ios_saf => { "18.2" => "y #7", "3.2" => "n", "5.0-5.1" => "a #2" },
kaios => { "2.5" => "a #5" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "n", "14.1" => "a #6" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Date and time input types",
ucprefix => 0,
},
"input-email-tel-url" => {
categories => ["HTML5"],
description => "Text input fields intended for email addresses, telephone numbers or URLs. Particularly useful in combination with [form validation](https://caniuse.com/#feat=form-validation)",
keywords => "input[type=email],input[type=tel],input[type=url],input type=\"email\",input type=\"tel\",input type=\"url\"",
links => [
{
title => "Article on usage",
url => "https://www.htmlgoodies.com/guides/html5-forms-how-to-use-the-new-email-url-and-telephone-input-types/#fbid=c9PEy7_9RZb",
},
],
notes => "Browsers without support for these types will fall back to using the \"text\" type.",
notes_by_num => {
1 => "Does not provide an email-specific keyboard for email addresses",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#telephone-state-(type=tel)",
stats => {
and_chr => { "2.1" => "a #1", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1", 10 => "y" },
chrome => { 4 => "n", 5 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Email, telephone & URL input types",
ucprefix => 0,
},
"input-event" => {
categories => ["DOM", "HTML5"],
description => "The `input` event is fired when the user changes the value of an `<input>` element, `<select>` element, or `<textarea>` element. By contrast, the \"change\" event usually only fires after the form control has lost focus.",
keywords => "oninput",
links => [
{
title => "Specification for `<select>` elements firing the `input` event",
url => "https://html.spec.whatwg.org/multipage/forms.html#send-select-update-notifications",
},
{
title => "MDN Web Docs - input event",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/input",
},
],
notes_by_num => {
1 => "Doesn't fire an `input` event when deleting text (via Backspace, Delete, Cut, etc.).",
2 => "Doesn't fire an `input` event when drag-and-dropping text into an `<input>` or `<textarea>`.",
3 => "`<select>` doesn't fire `input` events. See [MS Edge bug](https://developer.microsoft.com/microsoft-edge/platform/issues/4660045/) and [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1024350).",
4 => "Doesn't fire an `input` event when (un)checking a checkbox or radio button, or when changing the selected file(s) of an `<input type=\"file\">`. See [Chrome bug](https://code.google.com/p/chromium/issues/detail?id=534245), [WebKit bug #149398](https://bugs.webkit.org/show_bug.cgi?id=149398), [WebKit bug #190223](https://bugs.webkit.org/show_bug.cgi?id=190223) and [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1206616).",
5 => "Doesn't fire an `input` event when (un)checking a checkbox or radio button. See [MS Edge bug](https://web.archive.org/web/20160328154136/https://connect.microsoft.com/IE/feedback/details/1883692/edge-input-of-type-radio-or-type-checkbox-doesnt-fire-input-events).",
6 => "Doesn't fire an `input` event when changing the selected file(s) of an `<input type=\"file\">`. See [WebKit bug #149398](https://bugs.webkit.org/show_bug.cgi?id=149398) and [WebKit bug #204292](https://bugs.webkit.org/show_bug.cgi?id=204292).",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#event-input-input",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y #3 #4", "4.4.3-4.4.4" => "y #4" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y #3 #4", 10 => "y #4" },
chrome => { 4 => "u", 15 => "y #3 #4", 35 => "y #4", 66 => "y" },
edge => { "5.5" => "n", "9" => "a #1 #3 #5", "10" => "y #3 #5", "79" => "y" },
firefox => { "2" => "u", "3" => "a #2 #3 #4", "3.6" => "y #3 #4", "49" => "y" },
ie_mob => { 10 => "y #3 #5" },
ios_saf => {
"12.2-12.5" => "y #6",
"13.2" => "y",
"3.2" => "u",
"5.0-5.1" => "y #3 #4",
"8" => "y #4",
},
kaios => { "2.5" => "y #3 #4", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => {
"9" => "u",
"11.6" => "a #2",
"12" => "u",
"12.1" => "y",
"15" => "y #3 #4",
"22" => "y #4",
"52" => "y",
},
safari => {
"3.1" => "u",
"5.1" => "y #3 #4",
"6" => "u",
"6.1" => "y #4",
"12.1" => "y #6",
"13.1" => "y",
},
samsung => { 4 => "y #4" },
},
status => "ls",
title => "input event",
ucprefix => 0,
},
"input-file-accept" => {
categories => ["HTML5"],
description => "Allows a filter to be defined for what type of files a user may pick with from an `<input type=\"file\">` dialog",
links => [
{
title => "Demo & information",
url => "https://www.wufoo.com/html5/attributes/07-accept.html",
},
],
notes => "Not supported means any file can be picked as if the `accept` attribute was not set, unless otherwise noted.\r\n\r\nOn Windows, files that do not apply are hidden. On OSX they are grayed out and disabled.",
notes_by_num => {
1 => "Supports the type format (e.g. `image/*`) but not the extension format (e.g. `.png`)",
2 => "Offers appropriate file locations/input based on format type, but does not prevent other files from being selected.",
3 => "Does not allow any files to be picked at all",
4 => "Supports the type format but does not allow any file to be picked when using the extension format",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#attr-input-accept",
stats => {
and_chr => { "2.1" => "n", "3" => "a #2", "4.4" => "n #3" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "a #2" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "a #2" },
bb => { 7 => "a #2", 10 => "a #1" },
chrome => { 4 => "n", 5 => "u", 9 => "a #1", 21 => "u", 26 => "y" },
edge => { "5.5" => "n", "10" => "y", "12" => "n", "79" => "y" },
firefox => { 2 => "n", 4 => "a #1", 37 => "y" },
ie_mob => { 10 => "n #3", 11 => "a #4" },
ios_saf => { "3.2" => "n #3", "6.0-6.1" => "n", "8" => "a #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "n #3" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "a #1", "11.1" => "y" },
samsung => { 4 => "a #2" },
},
status => "ls",
title => "accept attribute for file input",
ucprefix => 0,
},
"input-file-directory" => {
categories => ["DOM", "JS API"],
description => "The `webkitdirectory` attribute on the `<input type=\"file\">` element allows entire directory with file contents (and any subdirectories) to be selected.",
keywords => "mozdirectory,webkitRelativePath",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory",
},
],
notes => "Lack of support in mobile browsers may be due to the OS file picker not having support for selecting a directory.",
notes_by_num => {},
spec => "https://wicg.github.io/entries-api/#dom-htmlinputelement-webkitdirectory",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 30 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 50 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 17 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Directory selection from file input",
ucprefix => 0,
},
"input-file-multiple" => {
categories => ["HTML5"],
description => "Allows users to select multiple files in the file picker.",
links => [
{
title => "Chrome bug (for Android)",
url => "https://code.google.com/p/chromium/issues/detail?id=348912",
},
{
title => "Article",
url => "https://www.raymondcamden.com/2012/02/28/Working-with-HTML5s-multiple-file-upload-support",
},
],
notes_by_num => {
1 => "Not supported on Android 4.x and below, presumably an OS limitation. Only seems to work in Android 5.x for the Chrome browser.",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#attr-input-multiple",
stats => {
and_chr => { "2.1" => "n #1" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "n #1" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 5 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n #1" },
op_mob => { 10 => "n #1", 80 => "y" },
opera => { "9" => "n", "10.6" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { "4" => "n #1", "5.0-5.4" => "a #1" },
},
status => "ls",
title => "Multiple file selection",
ucprefix => 0,
},
"input-inputmode" => {
categories => ["DOM", "HTML5"],
chrome_id => 6225984592281600,
description => "The `inputmode` attribute specifies what kind of input mechanism would be most helpful for users entering content into the form control.",
links => [
{
title => "Demo on Wufoo (old)",
url => "https://www.wufoo.com/html5/attributes/23-inputmode.html",
},
{
title => "Everything You Ever Wanted to Know About inputmode (CSS Tricks)",
url => "https://css-tricks.com/everything-you-ever-wanted-to-know-about-inputmode/",
},
],
notes_by_num => {
1 => "Support can be enabled via the `dom.forms.inputmode` flag",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#input-modalities:-the-inputmode-attribute",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 56 => "n d", 66 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 17 => "a", 21 => "n d #1", 95 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.2-12.5" => "y", "3.2" => "n" },
kaios => { "2.5" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 43 => "n d", 53 => "y" },
safari => { "3.1" => "n", "12.1" => "y" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "ls",
title => "inputmode attribute",
ucprefix => 0,
},
"input-minlength" => {
categories => ["HTML5"],
chrome_id => 6023370181181440,
description => "Declares a lower bound on the number of characters a user can input.",
links => [
{
title => "W3C usage example",
url => "https://www.w3.org/TR/html5/forms.html#setting-minimum-input-length-requirements:-the-minlength-attribute",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=932755",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=149832",
},
],
notes => "The [`pattern` attribute](https://caniuse.com/#feat=input-pattern) can be used [as an alternative](https://stackoverflow.com/a/10294291) solution for browsers without support.",
notes_by_num => {},
parent => "form-validation",
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-maxlength-and-minlength-attributes",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 40 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { 2 => "n", 51 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 27 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "ls",
title => "Minimum length attribute for input fields",
ucprefix => 0,
},
"input-number" => {
categories => ["HTML5"],
description => "Form field type for numbers.",
keywords => "spinner,input type=\"number\"",
links => [
{
title => "Polyfill",
url => "https://github.com/jonstipe/number-polyfill",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/form.js#input-type-number",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/input/type/number",
},
{
title => "Poor browser support for localized decimal marks, commas",
url => "https://www.ctrl.blog/entry/html5-input-number-localization.html",
},
],
notes_by_num => {
1 => "Does not support increment/decrement, either via buttons in UI or via arrow up & down keys.",
2 => "UI widget does not take the \"step\", \"min\" or \"max\" attributes into account.",
3 => "Firefox doesn't support [autocomplete content via datalist](https://codepen.io/graste/pen/bNoVKW) elements.",
4 => "Does not include increment/decrement buttons, but does support increment/decrement via arrow up & down keys.",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#number-state-(type=number)",
stats => {
and_chr => { "2.1" => "n", "4" => "a #1 #2" },
and_ff => { 137 => "y #1 #3" },
and_qq => { "14.9" => "a #1 #2" },
and_uc => { "15.5" => "a #1 #2" },
baidu => { "13.52" => "a #1 #2" },
bb => { 7 => "n", 10 => "a #1 #2" },
chrome => { 4 => "n", 6 => "y" },
edge => { "5.5" => "n", "10" => "y #1", "14" => "y #4", "79" => "y" },
firefox => { 2 => "n", 29 => "y #3" },
ie_mob => { 10 => "a #1 #2" },
ios_saf => { "3.2" => "a #1 #2" },
kaios => { "2.5" => "y #3" },
op_mini => { all => "n" },
op_mob => { 10 => "y", 80 => "a #1 #2" },
opera => { 9 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "a #1 #2" },
},
status => "ls",
title => "Number input type",
ucprefix => 0,
},
"input-pattern" => {
categories => ["HTML5"],
description => "Allows validation of an input field based on a given regular expression pattern.",
links => [
{
title => "Site with common sample patterns",
url => "https://www.html5pattern.com/",
},
{
title => "MDN Web Docs - input element: pattern attribute",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-pattern",
},
],
notes_by_num => {
1 => "Partial support refers to not displaying a message for invalid patterns",
2 => "Safari browsers support the `pattern` attribute but will still allow forms to be submitted if the pattern is incorrect. See the [form validation data](https://caniuse.com/#feat=form-validation) for details.",
},
parent => "form-validation",
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-pattern-attribute",
stats => {
and_chr => { "2.1" => "n", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 10 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "10.3" => "y", "3.2" => "u", "5.0-5.1" => "a #1 #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "a #1 #2", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Pattern attribute for input fields",
ucprefix => 0,
},
"input-placeholder" => {
categories => ["HTML5"],
description => "Method of setting placeholder text for text-like input fields, to suggest the expected inserted information.",
links => [
{
title => "Article on usage",
url => "https://www.zachleat.com/web/placeholder/",
},
{
title => "Polyfill",
url => "https://github.com/mathiasbynens/jquery-placeholder",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/form.js#input-attr-placeholder",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/attributes/placeholder",
},
{
title => "Issue 24626: Placeholder text for an input type=",
url => "https://code.google.com/p/android/issues/detail?id=24626",
},
],
notes_by_num => {
1 => "Partial support refers to lacking placeholder support on textarea elements.",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#attr-input-placeholder",
stats => {
and_chr => { "2.1" => "y", "4" => "a", "4.2-4.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "11" => "a #1", "11.5" => "y" },
safari => { "3.1" => "a #1", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "input placeholder attribute",
ucprefix => 0,
},
"input-range" => {
categories => ["HTML5"],
description => "Form field type that allows the user to select a value using a slider widget.",
keywords => "input type=\"range\"",
links => [
{
title => "Polyfill for Firefox",
url => "https://github.com/fryn/html5slider",
},
{
title => "Cross-browser polyfill",
url => "https://github.com/freqdec/fd-slider",
},
{
title => "Tutorial",
url => "http://tutorialzine.com/2011/12/what-you-need-to-know-html5-range-input/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/form.js#input-type-range",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/input/type/range",
},
{
title => "rangeslider.js polyfill",
url => "https://github.com/andreruffert/rangeslider.js",
},
{
title => "MDN web docs",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range",
},
{
title => "Tutorial",
url => "https://tutorialzine.com/2011/12/what-you-need-to-know-html5-range-input",
},
],
notes => "Currently all Android browsers with partial support hide the slider input field by default. However, the element [can be styled](https://tiffanybbrown.com/2012/02/input-typerange-and-androids-stock-browser/) to be made visible and usable.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/forms.html#range-state-(type=range)",
stats => {
and_chr => { "2.1" => "a", "4.2-4.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 23 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Range input type",
ucprefix => 0,
},
"input-search" => {
categories => ["HTML5"],
description => "Search field form input type. Intended to look like the underlying platform's native search field widget (if there is one). Other than its appearance, it's the same as an `<input type=\"text\">`.",
keywords => "input,type,search",
links => [
{
title => "CSS-Tricks article",
url => "https://css-tricks.com/webkit-html5-search-inputs/",
},
{
title => "Wufoo's The Current State of HTML5 Forms: The search Type",
url => "https://www.wufoo.com/html5/types/5-search.html",
},
],
notes_by_num => {
1 => "Does not use a special search-specific UI for the field, just the same UI as a regular `<input type=\"text\">`.",
},
spec => "https://html.spec.whatwg.org/multipage/forms.html#text-(type=text)-state-and-search-state-(type=search)",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y #1", "4.4" => "y" },
and_ff => { 137 => "y #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y", 10 => "y #1" },
chrome => { 4 => "u", 15 => "y #1", 21 => "u", 26 => "y" },
edge => { "5.5" => "n", "10" => "y #1", "79" => "y" },
firefox => { 2 => "n", 4 => "y #1" },
ie_mob => { 10 => "y #1" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y #1" },
op_mini => { all => "y #1" },
op_mob => { "10" => "n", "11" => "u", "12" => "y", "12.1" => "y #1", "80" => "y" },
opera => { "9" => "n", "11" => "u", "11.6" => "y" },
safari => { "3.1" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Search input type",
ucprefix => 0,
},
"input-selection" => {
categories => ["HTML5", "JS API"],
description => "Controls for setting and getting text selection via `setSelectionRange()` and the `selectionStart` & `selectionEnd` properties.",
links => [
{
title => "MDN article on setSelectionRange",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#dom-textarea/input-setselectionrange",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "9" => "u", "10.6" => "y" },
safari => { "3.1" => "u", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Selection controls for input & textarea",
ucprefix => 0,
},
"insert-adjacent" => {
categories => ["DOM"],
description => "Methods for inserting an element or text before or after a given element, or appending or prepending an element or text to a given element's list of children.",
keywords => "insertAdjacentElement,insertAdjacentText,insert,adjacent,element,text",
links => [
{
title => "WHATWG DOM Specification for Element.insertAdjacentText()",
url => "https://dom.spec.whatwg.org/#dom-element-insertadjacenttext",
},
{
title => "MDN Web Docs - Element.insertAdjacentElement()",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentElement",
},
{
title => "MDN Web Docs - Element.insertAdjacentText()",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentText",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/yanadu/edit?html,js,output",
},
],
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-element-insertadjacentelement",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "u", "6" => "y" },
firefox => { 2 => "n", 48 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Element.insertAdjacentElement() & Element.insertAdjacentText()",
ucprefix => 0,
},
"insertadjacenthtml" => {
categories => ["JS API"],
description => "Inserts a string of HTML into a specified position in the DOM relative to the given element.",
keywords => "element,insert,adjacent,HTML",
links => [
{
title => "MDN Web Docs - insertAdjacentHTML",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML",
},
{
title => "Polyfill",
url => "https://gist.github.com/eligrey/1276030",
},
],
notes_by_num => {
1 => "Throws an \"Invalid target element for this operation.\" error [when called on a table, tbody, thead, or tr element.](https://johnresig.com/blog/dom-insertadjacenthtml/)",
},
spec => "https://www.w3.org/TR/DOM-Parsing/#widl-Element-insertAdjacentHTML-void-DOMString-position-DOMString-text",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "u", "6" => "a #1", "10" => "y" },
firefox => { 2 => "n", 8 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "u" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Element.insertAdjacentHTML()",
ucprefix => 0,
},
"internationalization" => {
categories => ["JS", "JS"],
description => "Locale-sensitive collation (string comparison), number formatting, and date and time formatting.",
keywords => "Intl,Collator,NumberFormat,DateTimeFormat",
links => [
{
title => "MDN Web Docs - Internationalization",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl",
},
{
title => "The ECMAScript Internationalization API",
url => "https://norbertlindenberg.com/2012/12/ecmascript-internationalization-api/",
},
{
title => "Working With Intl",
url => "https://code.tutsplus.com/tutorials/working-with-intl--cms-21082",
},
{
title => "WebKit tracking bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=90906",
},
{
title => "Firefox for Android tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1344625",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma402/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 24 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "n", 29 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Internationalization API",
ucprefix => 0,
},
"intersectionobserver" => {
categories => ["DOM", "JS API"],
chrome_id => 5695342691483648,
description => "API that can be used to understand the visibility and position of DOM elements relative to a containing element or to the top-level viewport. The position is delivered asynchronously and is useful for understanding the visibility of elements and implementing pre-loading and deferred loading of DOM content.",
links => [
{
title => "MDN Web Docs - Intersection Observer",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API",
},
{
title => "Polyfill",
url => "https://github.com/w3c/IntersectionObserver",
},
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2016/04/intersectionobserver",
},
],
notes_by_num => {
1 => "Enabled in Firefox by setting the `about:config` preference `dom.IntersectionObserver.enabled` to true",
2 => "`isIntersecting` property of `IntersectionObserverEntry` was not implemented, returning `undefined`",
3 => "IntersectionObserver does not trigger its callback in a Chrome background tab",
},
spec => "https://www.w3.org/TR/intersection-observer/",
stats => {
and_chr => { "2.1" => "n", "135" => "y #3" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y #3" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "a #2", 58 => "y", 65 => "y #3" },
edge => { "5.5" => "n", "15" => "a #2", "16" => "y", "79" => "y #3" },
firefox => { 2 => "n", 52 => "n d #1", 55 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.2-12.5" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #3" },
opera => { 9 => "n", 38 => "a #2", 45 => "y", 64 => "y #3" },
safari => { "3.1" => "n", "12.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a #2", "7.2-7.4" => "y" },
},
status => "wd",
title => "IntersectionObserver",
ucprefix => 0,
},
"intersectionobserver-v2" => {
categories => ["DOM", "JS API", "Security"],
chrome_id => 5878481493688320,
description => "Iteration on the original API that also reports if the element is covered by another element or has filters applied to it. Useful for blocking clickjacking attempts or tracking ad exposure.",
keywords => ".isVisible,isVisible",
links => [
{
title => "Google Web Docs - Intersection Observer V2",
url => "https://developers.google.com/web/updates/2019/02/intersectionobserver-v2",
},
{
title => "Request for Mozilla Position on IntersectionObserver V2",
url => "https://github.com/mozilla/standards-positions/issues/109",
},
{
title => "Safari support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=251586",
},
],
notes_by_num => {},
parent => "intersectionobserver",
spec => "https://szager-chromium.github.io/IntersectionObserver/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "y" },
safari => { "3.1" => "n" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "unoff",
title => "IntersectionObserver V2",
ucprefix => 0,
},
"intl-pluralrules" => {
categories => ["JS", "JS"],
chrome_id => 5653874773852160,
description => "API for plural sensitive formatting and plural language rules.",
keywords => "Intl,PluralRules",
links => [
{
title => "MDN Web Docs: Intl.PluralRules",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/PluralRules",
},
{
title => "Google Developers blog: The Intl.PluralRules API",
url => "https://developers.google.com/web/updates/2017/10/intl-pluralrules",
},
],
notes_by_num => {
1 => "Intl.PluralRules exists, but methods are not implemented.",
},
parent => "internationalization",
spec => "https://tc39.es/ecma402/#sec-intl-pluralrules-constructor",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 63 => "y" },
edge => { "5.5" => "n", "18" => "n #1", "79" => "y" },
firefox => { 2 => "n", 58 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 50 => "y" },
safari => { "3.1" => "n", "13" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "other",
title => "Intl.PluralRules API",
ucprefix => 0,
},
"intrinsic-width" => {
categories => ["CSS3"],
chrome_id => 5901353784180736,
description => "Allows for the heights and widths to be specified in intrinsic values using the `max-content`, `min-content`, `fit-content` and `stretch` (formerly `fill`) properties.",
keywords => "fill,fill-available,max-content,min-content,fit-content,contain-floats,intrinsic,extrinsic,sizing",
links => [
{
title => "Min-Content tutorial",
url => "https://thenewcode.com/662/Design-From-the-Inside-Out-With-CSS-Min-Content",
},
],
notes => "Prefixes are on the values, not the property names (e.g. -webkit-min-content)\r\n\r\nOlder webkit browsers also support the unofficial `intrinsic` value which acts the same as `max-content`.",
notes_by_num => {
1 => "Firefox does not support the `height`/`min-height`/`max-height` properties, only `width`. See [test case](https://codepen.io/shshaw/pen/Kiwaz), [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=567039).",
2 => "Firefox supports the `-moz-available` keyword rather than `stretch`. [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1495868).",
3 => "Does not support the `flex-basis` property. See [specs](https://www.w3.org/TR/2015/WD-css-flexbox-1-20150514/#flex-basis-property), [Blink bug](https://bugs.chromium.org/p/chromium/issues/detail?id=240765), [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1055887).",
4 => "Chrome does not yet unprefix `stretch` (aka `fill`/`fill-available`), because the [CSSWG](https://lists.w3.org/Archives/Public/www-style/2015Aug/0127.html) is not ready for that yet. See [Chromium bug](https://bugs.chromium.org/p/chromium/issues/detail?id=611857).",
5 => "While still being affected by note 1, it is only for `-moz-fit-content` and `-moz-available`.",
},
spec => "https://www.w3.org/TR/css3-sizing/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x #3", "135" => "y #4" },
and_ff => { 137 => "a #2 #5" },
and_qq => { "14.9" => "y #3 #4" },
and_uc => { "15.5" => "y #3 #4" },
baidu => { "13.52" => "y #3 #4" },
bb => { 7 => "n", 10 => "y x #3" },
chrome => { 4 => "n", 22 => "y x #3", 46 => "y #3 #4", 94 => "y #4" },
edge => { "5.5" => "n", "79" => "y #3 #4", "94" => "y #4" },
firefox => { 2 => "n", 3 => "a x #1 #2 #3", 66 => "a #2 #5" },
ie_mob => { 10 => "n" },
ios_saf => {
"14.0-14.4" => "a #3",
"16.0" => "y",
"3.2" => "n",
"7.0-7.1" => "a x #1 #3",
"9.0-9.2" => "a x #3",
},
kaios => { "2.5" => "a x #1 #2 #3", "3.0-3.1" => "a #2 #5" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #4" },
opera => {
9 => "n",
15 => "y x #3",
33 => "y #3 #4",
34 => "y #3",
35 => "y #3 #4",
95 => "y #4",
},
safari => {
"3.1" => "n",
"6.1" => "a x #1 #3",
"9" => "a x #3",
"11" => "a #3",
"16.0" => "y",
},
samsung => { "17.0" => "y #4", "4" => "y x #3", "5.0-5.4" => "y #3 #4" },
},
status => "wd",
title => "Intrinsic & Extrinsic Sizing",
ucprefix => 0,
},
"jpeg2000" => {
categories => ["Other"],
description => "JPEG 2000 was built to supersede the original JPEG format by having better compression and more features. [WebP](/webp), [AVIF](/avif) and [JPEG XL](/jpegxl) are all designed to supersede JPEG 2000.",
keywords => "jp2,jpeg2000,jpeg 2000,jpg2000",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/JPEG_2000",
},
],
notes_by_num => { 1 => "Not supported by Safari for Windows" },
spec => "https://www.itu.int/rec/T-REC-T.800-200208-I",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "18.0" => "n", "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "5" => "y #1", "6" => "y", "18.0" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "JPEG 2000 image format",
ucprefix => 0,
},
"jpegxl" => {
categories => ["Other"],
chrome_id => 5188299478007808,
description => "A modern image format optimized for web environments. JPEG XL generally has better compression than [WebP](/webp), JPEG, PNG and GIF and is designed to supersede them. JPEG XL competes with [AVIF](/avif) which has similar compression quality but fewer features overall.",
keywords => ".jxl,jpeg-xl,jpg",
links => [
{
title => "Official website",
url => "https://jpeg.org/jpegxl/index.html",
},
{
title => "Comparison to other formats",
url => "https://cloudinary.com/blog/how_jpeg_xl_compares_to_other_image_codecs",
},
{ title => "Chromium support bug", url => "https://crbug.com/1178058" },
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1539075",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=208235",
},
{
title => "Request for Mozilla position on JPEG XL",
url => "https://github.com/mozilla/standards-positions/issues/522",
},
{
title => "2024 update on the request for Mozilla position on JPEG XL",
url => "https://github.com/mozilla/standards-positions/pull/1064",
},
],
notes_by_num => {
1 => "Can be enabled via the `enable-jxl` flag.",
2 => "Can be enabled via the `image.jxl.enabled` flag in `about:config` in Nightly only. This flag is configurable but has no effect in the other builds.",
3 => "Can be enabled via the `--enable-features=JXL` runtime flag.",
4 => "Supports still images. Animated image sequences are not supported.",
},
spec => "https://jpeg.org/jpegxl/documentation.html",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 91 => "n d #1", 110 => "n" },
edge => { "5.5" => "n", "91" => "n d #3", "110" => "n" },
firefox => { 2 => "n", 90 => "n d #2" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.0" => "y #4" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 77 => "n d #1", 96 => "n" },
safari => { "3.1" => "n", "17.0" => "y #4" },
samsung => { 4 => "n" },
},
status => "other",
title => "JPEG XL image format",
ucprefix => 0,
},
"jpegxr" => {
categories => ["Other"],
description => "JPEG XR was built to supersede the original JPEG format by having better compression and more features. [WebP](/webp), [AVIF](/avif) and [JPEG XL](/jpegxl) are all designed to supersede JPEG XR.",
keywords => "jpeg-xr,jxr",
links => [
{
title => "Microsoft JPEG XR Codec Overview",
url => "https://docs.microsoft.com/en-us/windows/win32/wic/jpeg-xr-codec",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=500500",
},
{
title => "Chrome support bug (marked as WONTFIX)",
url => "https://code.google.com/p/chromium/issues/detail?id=56908",
},
],
notes_by_num => {},
spec => "https://www.itu.int/rec/T-REC-T.832",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "9" => "y", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "JPEG XR image format",
ucprefix => 0,
},
"js-regexp-lookbehind" => {
categories => ["JS"],
description => "The positive lookbehind (`(?<= )`) and negative lookbehind (`(?<! )`) zero-width assertions in JavaScript regular expressions can be used to ensure a pattern is preceded by another pattern.",
links => [
{
title => "Blog post on lookbehind assertions",
url => "https://2ality.com/2017/05/regexp-lookbehind-assertions.html",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1225665",
},
{
title => "MDN: Regular Expressions Assertions",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions/Assertions",
},
{
title => "Safari implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=174931",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-assertion",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 62 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 78 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 49 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "other",
title => "Lookbehind in JS regular expressions",
ucprefix => 0,
},
"json" => {
categories => ["JS"],
description => "Method of converting JavaScript objects to JSON strings and JSON back to objects using JSON.stringify() and JSON.parse()",
links => [
{
title => "MDN Web Docs - Working with JSON",
url => "https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/JSON",
},
{
title => "JSON in JS (includes script w/support)",
url => "https://www.json.org/json-en.html",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/json.js#json",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/json",
},
{ title => "JSON explainer", url => "https://www.json.org/" },
],
notes_by_num => {
1 => "Requires document to be in IE8+ [standards mode](http://msdn.microsoft.com/en-us/library/cc288325%28VS.85%29.aspx) to work in IE8.",
},
parent => "es5",
spec => "https://www.ecma-international.org/ecma-262/5.1/#sec-15.12",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "y #1", "9" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "JSON parsing",
ucprefix => 0,
},
"justify-content-space-evenly" => {
categories => ["CSS"],
description => "The \"space-evenly\" value for the `justify-content` property distributes the space between items evenly. It is similar to space-around but provides equal instead of half-sized space on the edges. Can be used in both CSS flexbox & grid.",
links => [
{
title => "MDN on justify-content property",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content",
},
{
title => "Edge support bug",
url => "https://web.archive.org/web/20190401105606/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/15947692/",
},
],
notes_by_num => { 1 => "Supported in CSS Grid, but not Flexbox" },
spec => "https://w3c.github.io/csswg-drafts/css-align-3/#valdef-align-content-space-evenly",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 57 => "a #1", 60 => "y" },
edge => { "5.5" => "n", "16" => "a #1", "79" => "y" },
firefox => { 2 => "n", 52 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "a #1", "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "a #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 44 => "a #1", 47 => "y" },
safari => { "3.1" => "n", "10.1" => "a #1", "11" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "a #1", "8.2" => "y" },
},
status => "wd",
title => "CSS justify-content: space-evenly",
ucprefix => 0,
},
"kerning-pairs-ligatures" => {
categories => ["CSS"],
description => "When used in HTML, the unofficial `text-rendering: optimizeLegibility` CSS property enables high-quality kerning and ligatures in certain browsers. Newer browsers have this behavior enabled by default.",
keywords => "optimizeLegibility,optimizeSpeed,geometricPrecision",
links => [
{
title => "MDN Web Docs - CSS text-rendering",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-rendering",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/properties/t/text-rendering/",
},
],
notes => "The `text-rendering` property is specified in SVG, though behavior there is not related to kerning pairs & ligatures.",
notes_by_num => {
1 => "Partial support in Android browser versions is due to a serious bug where `text-rendering: optimizeLegibility` causes custom web fonts to not render.",
},
spec => "https://www.w3.org/TR/SVG2/painting.html#TextRendering",
stats => {
and_chr => { "2.1" => "n", "3" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "18" => "y" },
firefox => { 2 => "n", 3 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "4.2-4.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "High-quality kerning pairs & ligatures",
ucprefix => 0,
},
"keyboardevent-charcode" => {
categories => ["DOM"],
description => "A legacy `KeyboardEvent` property that gives the Unicode codepoint number of a character key pressed during a `keypress` event.",
keywords => "keyboard,event,key,char,character,code,charCode",
links => [
{
title => "MDN Web Docs - charCode",
url => "https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/charCode",
},
],
notes => "This property is legacy and deprecated.\n[\"Some key events, or their values, might be suppressed by the IME in use\"](https://www.w3.org/TR/2019/WD-uievents-20190530/#keys-IME). On mobile (virtual keyboard), all keys are reported as 0.",
notes_by_num => { 1 => "Does not appear to support the `keypress` event at all" },
spec => "https://w3c.github.io/uievents/#dom-keyboardevent-charcode",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "n #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "u", 3 => "y" },
ie_mob => { 10 => "n #1" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12" => "u", "12.1" => "y" },
opera => { "9" => "n", "12" => "u", "12.1" => "y" },
safari => { "3.1" => "u", "4" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "KeyboardEvent.charCode",
ucprefix => 0,
},
"keyboardevent-code" => {
categories => ["DOM"],
chrome_id => 5228092293382144,
description => "A `KeyboardEvent` property representing the physical key that was pressed, ignoring the keyboard layout and ignoring whether any modifier keys were active.",
keywords => "keyboard,event,code",
links => [
{
title => "MDN Web Docs - code",
url => "https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code",
},
{
title => "Chrome tracking bug",
url => "https://code.google.com/p/chromium/issues/detail?id=227231",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=149584",
},
],
notes => "[\"Some key events, or their values, might be suppressed by the IME in use\"](https://www.w3.org/TR/2019/WD-uievents-20190530/#keys-IME). On mobile (virtual keyboard), all keys are reported as empty (\"\").",
notes_by_num => {
1 => "Enabled in Chrome & Opera through the \"experimental Web Platform features\" flag",
},
spec => "https://www.w3.org/TR/uievents/#dom-keyboardevent-code",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n d #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 42 => "n d #1", 48 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 38 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 29 => "n d #1", 35 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "n d #1" },
},
status => "wd",
title => "KeyboardEvent.code",
ucprefix => 0,
},
"keyboardevent-getmodifierstate" => {
categories => ["DOM"],
description => "`KeyboardEvent` method that returns the state (whether the key is pressed/locked or not) of the given modifier key.",
keywords => "keyboard,event,get,modifier,state",
links => [
{
title => "MDN Web Docs - getModifierState",
url => "https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/getModifierState",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=40999",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/uievents/#dom-keyboardevent-getmodifierstate",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 30 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12" => "u", "12.1" => "y" },
opera => { "9" => "n", "12" => "u", "12.1" => "y", "15" => "n", "17" => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "KeyboardEvent.getModifierState()",
ucprefix => 0,
},
"keyboardevent-key" => {
categories => ["DOM"],
chrome_id => 4748790720364544,
description => "A `KeyboardEvent` property whose value is a string identifying the key that was pressed. Covers character keys, non-character keys (e.g. arrow keys), and dead keys.",
keywords => "keyboard,event,key",
links => [
{
title => "MDN Web Docs - key",
url => "https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key",
},
{
title => "Chrome tracking bug",
url => "https://code.google.com/p/chromium/issues/detail?id=227231",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=69029",
},
{
title => "Spec listing all key string values",
url => "https://www.w3.org/TR/DOM-Level-3-Events-key/",
},
{
title => "Edge bug report",
url => "https://web.archive.org/web/20190401104951/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8860571/",
},
{
title => "shim-keyboard-event-key: shim for non-standard key identifiers for IE & Edge",
url => "https://github.com/shvaikalesh/shim-keyboard-event-key",
},
],
notes => "[\"Some key events, or their values, might be suppressed by the IME in use\"](https://www.w3.org/TR/2019/WD-uievents-20190530/#keys-IME). On mobile (virtual keyboard), for every key Blink and WebKit based browsers report \"Unidentified\", Gecko reports \"Process\".",
notes_by_num => {
1 => "Partial support refers to these versions of Firefox returning `\"MozPrintableKey\"` for all character keys.",
2 => "Has non-standard key identifiers and incorrect behaviour with AltGraph.",
},
spec => "https://www.w3.org/TR/uievents/#dom-keyboardevent-key",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "y" },
edge => { "5.5" => "n", "9" => "a #2", "79" => "y" },
firefox => { 2 => "n", 23 => "a #1", 29 => "y" },
ie_mob => { 10 => "a #2" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "12" => "u", "12.1" => "y" },
opera => { "9" => "n", "12" => "u", "12.1" => "y", "15" => "n", "38" => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "KeyboardEvent.key",
ucprefix => 0,
},
"keyboardevent-location" => {
categories => ["DOM"],
description => "A `KeyboardEvent` property that indicates the location of the key on the input device. Useful when there are more than one physical key for the same logical key (e.g. left or right \"Control\" key; main or numpad \"1\" key).",
keywords => "keyboard,event,key,location,keyLocation,numpad",
links => [
{
title => "MDN Web Docs - location",
url => "https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/location",
},
],
notes_by_num => {
1 => "Only supports `KeyboardEvent.keyLocation` from an older draft of the DOM Level 3 Events spec instead.",
},
spec => "https://www.w3.org/TR/uievents/#dom-keyboardevent-location",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 30 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "a #1", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12" => "u", "12.1" => "y" },
opera => { "9" => "n", "12" => "u", "12.1" => "y", "15" => "a #1", "17" => "y" },
safari => { "3.1" => "u", "4" => "a #1", "6" => "u", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "KeyboardEvent.location",
ucprefix => 0,
},
"keyboardevent-which" => {
categories => ["DOM"],
description => "A legacy `KeyboardEvent` property that is equivalent to either `KeyboardEvent.keyCode` or `KeyboardEvent.charCode` depending on whether the key is alphanumeric.",
keywords => "keyboard,event,which",
links => [
{
title => "MDN Web Docs - which",
url => "https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/which",
},
],
notes => "This property is legacy and deprecated.\n[\"Some key events, or their values, might be suppressed by the IME in use\"](https://www.w3.org/TR/2019/WD-uievents-20190530/#keys-IME). On mobile (virtual keyboard), all keys are reported as 229.",
notes_by_num => {
1 => "`event.which` number for keys does not always match expected value (difference may be dependent on hardware vs. on-screen keyboard?). ",
},
spec => "https://w3c.github.io/uievents/#dom-uievent-which",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y", "4.4" => "a #1", "135" => "y" },
and_ff => { 137 => "a #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "u" },
safari => { "3.1" => "n", "5" => "u", "5.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a #1" },
},
status => "unoff",
title => "KeyboardEvent.which",
ucprefix => 0,
},
"lazyload" => {
categories => ["DOM"],
description => "Gives a hint to the browser to lower the loading priority of a resource. Please note that this is a legacy attribute, see the [`loading`](/loading-lazy-attr) attribute for the new standardized API.",
links => [
{
title => "lazyload attribute | lazyload property",
url => "https://msdn.microsoft.com/en-us/ie/dn369270(v=vs.94)",
},
{
title => "Discussion on standardization",
url => "https://github.com/whatwg/html/issues/2806",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/web-performance/specs/ResourcePriorities/Overview.html",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "11" => "y", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Resource Hints: Lazyload",
ucprefix => 0,
},
"let" => {
categories => ["JS"],
chrome_id => 4645595339816960,
description => "Declares a variable with block level scope",
keywords => "ES6,variable,block,scope",
links => [
{
title => "Variables and Constants in ES6",
url => "https://generatedcontent.org/post/54444832868/variables-and-constants-in-es6",
},
{
title => "MDN Web Docs - let",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let",
},
],
notes_by_num => {
1 => "Supports a non-standard version that can only be used in script elements with a type attribute of `application/javascript;version=1.7`. As other browsers do not support these types of `script` tags this makes support useless for cross-browser support.",
2 => "Requires the \x{2018}Experimental JavaScript features\x{2019} flag to be enabled",
3 => "Only supported in strict mode",
4 => "`let` bindings in for loops are incorrectly treated as function-scoped instead of block scoped.",
5 => "`let` variables are not bound separately to each iteration of `for` loops",
},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-let-and-const-declarations",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 19 => "n d #2", 41 => "a #3", 49 => "y" },
edge => { "5.5" => "n", "11" => "a #5", "12" => "y" },
firefox => { 2 => "n d #1", 44 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "10.0-10.2" => "a #4", "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "n d #2", 28 => "a #3", 36 => "y" },
safari => { "3.1" => "n", "10" => "a #4", "11" => "y" },
samsung => { "4" => "a #3", "5.0-5.4" => "y" },
},
status => "other",
title => "let",
ucprefix => 0,
},
"link-icon-png" => {
categories => ["HTML5"],
description => "Icon used by browsers to identify a webpage or site. While all browsers support the `.ico` format, the PNG format can be preferable.",
links => [
{
title => "How to favicon in 2021",
url => "https://dev.to/masakudamatsu/favicon-nightmare-how-to-maintain-sanity-3al7",
},
],
notes => "Favicon support is a complicated topic. See [this guide](https://dev.to/masakudamatsu/favicon-nightmare-how-to-maintain-sanity-3al7) for more information.\r\n\r\nSee also [SVG favicons](/link-icon-svg).",
notes_by_num => {
1 => "Does not use favicons at all (but may have alternative for bookmarks, etc.).",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#rel-icon",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y", 10 => "n #1" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "n #1" },
ios_saf => { "12.0-12.1" => "y", "3.2" => "n #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "n #1" },
op_mob => { 10 => "n #1", 80 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "PNG favicons",
ucprefix => 0,
},
"link-icon-svg" => {
categories => ["HTML5", "SVG"],
chrome_id => 5180316371124224,
description => "Icon used by browsers to identify a webpage or site. While all browsers support the `.ico` format, the SVG format can be preferable to more easily support higher resolutions or larger icons.",
links => [
{
title => "Chrome bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=294179",
},
{
title => "Firefox bug, highlights comment that confirms note #4",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=366324#c50",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=136059",
},
{
title => "How to favicon in 2021",
url => "https://dev.to/masakudamatsu/favicon-nightmare-how-to-maintain-sanity-3al7",
},
{
title => "WebKit position 2024: Support",
url => "https://github.com/WebKit/standards-positions/issues/367",
},
],
notes => "Favicon support is a complicated topic. See [this guide](https://dev.to/masakudamatsu/favicon-nightmare-how-to-maintain-sanity-3al7) for more information.\r\n\r\nSee also [PNG favicons](/link-icon-png).",
notes_by_num => {
1 => "Does not use favicons at all (but may have alternative for bookmarks, etc.).",
2 => "Partial support in Firefox before version 41 refers to only loading the SVG favicon the first time, but not [on subsequent loads](https://bugzilla.mozilla.org/show_bug.cgi?id=366324#c14).",
3 => "Requires the served mime-type to be `image/svg+xml`.",
4 => "Chromium browsers serve the SVG in [secure static mode](https://svgwg.org/svg2-draft/conform.html#secure-static-mode), but apply SMIL animations using the document start time (0).",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#rel-icon",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "y #3 #4" },
bb => { 7 => "n", 10 => "n #1" },
chrome => { 4 => "n", 80 => "y #3 #4" },
edge => { "5.5" => "n", "80" => "y #3 #4" },
firefox => { 2 => "n", 4 => "a #2", 41 => "y #3" },
ie_mob => { 10 => "n #1" },
ios_saf => { "12.0-12.1" => "n", "3.2" => "n #1" },
kaios => { "2.5" => "y #3" },
op_mini => { all => "n #1" },
op_mob => { 10 => "n #1", 80 => "y #3 #4" },
opera => { 9 => "n", 44 => "y", 54 => "n", 67 => "y #3 #4" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "13.0" => "y #3 #4" },
},
status => "ls",
title => "SVG favicons",
ucprefix => 0,
},
"link-rel-dns-prefetch" => {
categories => ["DOM"],
description => "Gives a hint to the browser to perform a DNS lookup in the background to improve performance. This is indicated using `<link rel=\"dns-prefetch\" href=\"https://example.com/\">`",
links => [
{
title => "Prerender and prefetch support",
url => "https://msdn.microsoft.com/en-us/library/dn265039(v=vs.85).aspx",
},
{
title => "Controlling DNS prefetching",
url => "https://developer.mozilla.org/en-US/docs/Web/HTTP/Controlling_DNS_prefetching",
},
{
title => "What to <link rel=dns-prefetch> and when to use `preconnect` instead",
url => "https://www.ctrl.blog/entry/dns-prefetch-preconnect.html",
},
],
notes_by_num => {
1 => "IE9 [supported `dns-prefetch` as `prefetch`](https://blogs.msdn.com/b/ieinternals/archive/2012/03/01/ie10-beta-consumer-preview-minor-changes-changelist.aspx) as the former wasn\x{2019}t defined yet.",
2 => "Firefox < 127 only supports `dns-prefetch` on HTTP origins. HTTPS is unsupported.",
},
spec => "https://www.w3.org/TR/resource-hints/#dns-prefetch",
stats => {
and_chr => { "2.1" => "u" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "10" => "y" },
firefox => { "2" => "n", "3.5" => "a #2", "127" => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "u" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "u", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { "4" => "u", "5.0-5.4" => "y" },
},
status => "wd",
title => "Resource Hints: dns-prefetch",
ucprefix => 0,
},
"link-rel-modulepreload" => {
categories => ["DOM"],
chrome_id => 5762805915451392,
description => "Using `<link rel=\"modulepreload\">`, browsers can be informed to prefetch module scripts without having to execute them, allowing fine-grained control over when and how module resources are loaded.",
links => [
{
title => "Gecko implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1425310",
},
{
title => "WebKit implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=180574",
},
{
title => "Preloading modules",
url => "https://developers.google.com/web/updates/2017/12/modulepreload",
},
{
title => "Modern Script Loading",
url => "https://jasonformat.com/modern-script-loading/",
},
],
notes => "Unlike some other link relations, changing the relevant attributes (such as as, crossorigin, and referrerpolicy) of such a link does not trigger a new fetch. This is because the document's module map has already been populated by a previous fetch, and so re-fetching would be pointless.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/links.html#link-type-modulepreload",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 66 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 115 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 53 => "y" },
safari => { "3.1" => "n", "17.0" => "y" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "ls",
title => "Resource Hints: modulepreload",
ucprefix => 0,
},
"link-rel-preconnect" => {
categories => ["DOM"],
chrome_id => 5560623895150592,
description => "Gives a hint to the browser to begin the connection handshake (DNS, TCP, TLS) in the background to improve performance. This is indicated using `<link rel=\"preconnect\" href=\"https://example-domain.com/\">`",
keywords => "preconnect, resource hints",
links => [
{
title => "Eliminating Roundtrips with Preconnect",
url => "https://www.igvita.com/2015/08/17/eliminating-roundtrips-with-preconnect/",
},
],
notes_by_num => {
1 => "Firefox 39 did not support 'crossorigin' attribute and preconnects were not processed by the preload parser. Both of these features were enabled in Firefox 41.",
2 => "Partial support in Edge 15+ refers to support for only the HTTP header format, not the `<link rel>` format.",
3 => "Firefox support regressed from versions 71 - 114. See [bug 1543990](https://bugzilla.mozilla.org/show_bug.cgi?id=1543990) for details.",
},
spec => "https://www.w3.org/TR/resource-hints/#preconnect",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 46 => "y" },
edge => { "5.5" => "n", "15" => "a #2", "79" => "y" },
firefox => { 2 => "n", 39 => "y #1", 40 => "y", 71 => "n #3", 115 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 33 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "Resource Hints: preconnect",
ucprefix => 0,
},
"link-rel-prefetch" => {
categories => ["DOM"],
description => "Informs the browsers that a given resource should be prefetched so it can be loaded more quickly. This is indicated using `<link rel=\"prefetch\" href=\"(url)\">`",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Link_prefetching",
},
{
title => "Article on prefetch and other hints",
url => "https://medium.com/\@luisvieira_gmr/html5-prefetch-1e54f6dda15d",
},
],
notes_by_num => {
1 => "Can be enabled in Safari as `LinkPrefetch` in the developer menu",
},
spec => "https://www.w3.org/TR/resource-hints/#dfn-prefetch",
stats => {
and_chr => { "2.1" => "n", "4" => "y", "4.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 8 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "13.4-13.7" => "n d #1", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "13.1" => "n d #1" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Resource Hints: prefetch",
ucprefix => 0,
},
"link-rel-preload" => {
categories => ["DOM"],
chrome_id => 5757468554559488,
description => "Using `<link rel=\"preload\">`, browsers can be informed to prefetch resources without having to execute them, allowing fine-grained control over when and how resources are loaded. Only the following `as` values are supported: fetch, image, font, script, style, track.",
links => [
{
title => "Preload: What Is It Good For?",
url => "https://www.smashingmagazine.com/2016/02/preload-what-is-it-good-for/",
},
{
title => "MDN Web Docs - Preloading content with rel=\"preload\"",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content",
},
{
title => "Firefox meta support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=Rel%3Dpreload",
},
],
notes_by_num => {
1 => "Only cachable resources can be preloaded.",
2 => "Can be enabled via the \"Experimental Features\" developer menu",
3 => "Disabled by default behind the `network.preload` flag.",
4 => "Partial support in Edge 17+ refers to support for only the HTML `<link rel>` format, not the HTTP header format.",
},
spec => "https://w3c.github.io/preload/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 50 => "y" },
edge => { "5.5" => "n", "17" => "a #4", "79" => "y" },
firefox => { 2 => "n", 56 => "a #1", 57 => "n d #3", 85 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "n d #2", "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 37 => "y" },
safari => { "3.1" => "n", "11" => "n d #2", "11.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "cr",
title => "Resource Hints: preload",
ucprefix => 0,
},
"link-rel-prerender" => {
categories => ["DOM"],
description => "Gives a hint to the browser to render the specified page in the background, speeding up page load if the user navigates to it. This is indicated using `<link rel=\"prerender\" href=\"(url)\">`",
links => [
{
title => "Prerender and prefetch support",
url => "https://msdn.microsoft.com/en-us/library/dn265039(v=vs.85).aspx",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=730101",
},
],
notes => "Chrome treats the prerender hint as a [NoState Prefetch](https://developers.google.com/web/updates/2018/07/nostate-prefetch) instead, and unlike a full prerender it won't execute JavaScript or render any part of the page in advance.",
notes_by_num => {},
spec => "https://www.w3.org/TR/resource-hints/#prerender",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 13 => "y" },
edge => { "5.5" => "n", "11" => "y", "12" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Resource Hints: prerender",
ucprefix => 0,
},
"loading-lazy-attr" => {
categories => ["HTML5"],
chrome_id => 5645767347798016,
description => "The `loading` attribute on images & iframes gives authors control over when the browser should start loading the resource. ",
keywords => "lazy-loading,lazyloading,loading=\"lazy\",loading=\"eager\",loading=\"auto\",loading,attribute,lazily,lazy image loading,lazy img loading,iframe loading,native lazyload",
links => [
{
title => "Blog post",
url => "https://addyosmani.com/blog/lazy-loading/",
},
{
title => "Explainer",
url => "https://github.com/scott-little/lazyload",
},
{ title => "WebKit support bug", url => "https://webkit.org/b/196698" },
{
title => "Firefox support bug for lazy loading iframes",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1622090",
},
{
title => "Polyfill",
url => "https://github.com/mfranzke/loading-attribute-polyfill",
},
],
notes_by_num => {
1 => "Firefox only supports lazy loading for images",
2 => "Can be enabled in Settings under the Safari > Advanced > Experimental Features menu.",
3 => "Safari supports lazy image loading. Lazy iframes loading can be enabled under the Experimental Features menu.",
},
spec => "https://html.spec.whatwg.org/multipage/urls-and-fetching.html#lazy-loading-attributes",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 75 => "n d", 77 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 75 => "a #1", 121 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.4-13.7" => "n d #2", "15.4" => "a d #3", "16.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "n d", 64 => "y" },
safari => { "3.1" => "n", "13.1" => "n d #2", "15.4" => "a d #3", "16.4" => "y" },
samsung => { "4" => "n", "12.0" => "y" },
},
status => "ls",
title => "Lazy loading via attribute for images & iframes",
ucprefix => 0,
},
"localecompare" => {
categories => ["JS"],
description => "The `localeCompare()` method returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare",
},
],
notes_by_num => {
1 => "Only supports basic support without locale & options parameters.",
},
spec => "https://tc39.es/ecma402/#sup-String.prototype.localeCompare",
stats => {
and_chr => { "2.1" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 24 => "y" },
edge => { "5.5" => "u", "6" => "a #1", "11" => "y" },
firefox => { 2 => "a #1", 29 => "y" },
ie_mob => { 10 => "a #1", 11 => "y" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "a #1" },
kaios => { "2.5" => "a", "3.0-3.1" => "y" },
op_mini => { all => "a #1" },
op_mob => { "10" => "u", "12.1" => "a #1", "80" => "y" },
opera => { "9" => "u", "12.1" => "a #1", "15" => "y" },
safari => { "3.1" => "a #1", "10" => "y" },
samsung => { "4" => "a #1", "5.0-5.4" => "y" },
},
status => "other",
title => "localeCompare()",
ucprefix => 0,
},
"magnetometer" => {
categories => ["JS API"],
chrome_id => 5698781827825664,
description => "Defines a concrete sensor interface to measure magnetic field in the X, Y and Z axis.",
links => [
{
title => "Demo",
url => "https://intel.github.io/generic-sensor-demos/vr-button/build/bundled/",
},
{
title => "Article",
url => "https://developers.google.com/web/updates/2017/09/sensors-for-the-web",
},
],
notes_by_num => {
1 => "Available by enabling the \"Generic Sensor Extra Classes\" experimental flag in `about:flags`",
},
spec => "https://www.w3.org/TR/magnetometer/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #1" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 44 => "n d #1" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "Magnetometer",
ucprefix => 0,
},
"matchesselector" => {
categories => ["DOM", "JS API"],
description => "Method of testing whether or not a DOM element matches a given selector. Formerly known (and largely supported with prefix) as matchesSelector.",
keywords => " matchesSelector",
links => [
{
title => "MDN Web Docs - Element matches",
url => "https://developer.mozilla.org/en/docs/Web/API/Element/matches",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/HTMLElement/matches",
},
],
notes => "Partial support refers to supporting the older specification's \"matchesSelector\" name rather than just \"matches\".",
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-element-matches",
stats => {
and_chr => { "2.1" => "n", "2.2" => "a x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a x" },
chrome => { 4 => "a x", 34 => "y" },
edge => { "5.5" => "n", "9" => "a x", "15" => "y" },
firefox => { "2" => "n", "3.6" => "a x", "34" => "y" },
ie_mob => { 10 => "a x" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "a x", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11.1" => "a x", "80" => "y" },
opera => { "9" => "n", "11.5" => "a x", "21" => "y" },
safari => { "3.1" => "n", "5" => "a x", "7.1" => "y" },
samsung => { "4" => "a x", "5.0-5.4" => "y" },
},
status => "ls",
title => "matches() DOM method",
ucprefix => 0,
},
"matchmedia" => {
categories => ["DOM", "JS API"],
chrome_id => 4677872220372992,
description => "API for finding out whether or not a media query applies to the document.",
keywords => "mediaquerylist",
links => [
{
title => "matchMedia.js polyfill",
url => "https://github.com/paulirish/matchMedia.js/",
},
{
title => "MDN Web Docs - matchMedia",
url => "https://developer.mozilla.org/en/DOM/window.matchMedia",
},
{
title => "MDN Web Docs - Using matchMedia",
url => "https://developer.mozilla.org/en/CSS/Using_media_queries_from_code",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/media_queries/apis/matchMedia",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/cssom-view/#dom-window-matchmedia",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 9 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 6 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "9" => "n", "12.1" => "y" },
safari => { "3.1" => "n", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "matchMedia",
ucprefix => 0,
},
"mathml" => {
categories => ["Other"],
chrome_id => 5240822173794304,
description => "Special tags that allow mathematical formulas and notations to be written on web pages.",
links => [
{ title => "Wikipedia", url => "https://en.wikipedia.org/wiki/MathML" },
{
title => "Cross-browser support script",
url => "https://www.mathjax.org",
},
{
title => "MDN Web Docs - MathML",
url => "https://developer.mozilla.org/en-US/docs/Web/MathML",
},
{
title => "MathML torture test",
url => "https://fred-wang.github.io/MathFonts/mozilla_mathml_test/",
},
{
title => "MathML in Chromium Project Roadmap",
url => "https://mathml.igalia.com/project/",
},
],
notes => "Support was added in Chrome 24, but temporarily removed afterwards due to instability.",
notes_by_num => {
1 => "Before version 4, Firefox only supports the XHTML notation",
2 => "Before version 10, Safari had issues rendering significant portions of the MathML torture test",
3 => "Can be enabled via the `#enable-experimental-web-platform-features` flag in `chrome://flags`",
4 => "Browsers based on Chromium 109+ specifically support [MathML Core](https://www.w3.org/TR/mathml-core/). While there is significant support overlap with other MathML implementations there are some differences ([see details](https://groups.google.com/a/chromium.org/g/blink-dev/c/n4zf_3FWmAA/m/oait3tsMAQAJ)).",
5 => "Opera's support is limited to a CSS profile of MathML",
},
spec => "https://www.w3.org/TR/MathML/",
stats => {
and_chr => { "2.1" => "p", "135" => "y #4" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "p" },
and_uc => { "15.5" => "p" },
baidu => { "13.52" => "p" },
bb => { 7 => "p", 10 => "y" },
chrome => { 4 => "p", 24 => "y", 25 => "p", 97 => "p d #3", 109 => "y #4" },
edge => {
"5.5" => "n",
"6" => "p",
"9" => "n",
"79" => "p",
"97" => "p d #3",
"109" => "y #4",
},
firefox => { 2 => "y #1", 4 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "p", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "p" },
op_mob => { 10 => "p", 80 => "y #4" },
opera => { "15" => "p", "83" => "p d #3", "9" => "n", "9.5-9.6" => "a #5", "95" => "y #4" },
safari => { "3.1" => "a #2", "10" => "y" },
samsung => { 4 => "p", 21 => "y" },
},
status => "rec",
title => "MathML",
ucprefix => 0,
},
"maxlength" => {
categories => ["DOM", "HTML5", "JS API"],
description => "Declares an upper bound on the number of characters the user can input. Normally the UI ignores attempts by the user to type in additional characters beyond this limit.",
keywords => "maximum,length,input,textarea,too,long,validity,state",
links => [
{
title => "MDN Web Docs - attribute maxlength",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-maxlength",
},
],
notes_by_num => {
1 => "`<textarea>`'s' UI does not prevent the user from typing additional characters beyond the `maxlength` limit.",
2 => "Does not support the `HTMLTextAreaElement.maxLength` DOM property.",
3 => "Does not support [`ValidityState.tooLong`](https://developer.mozilla.org/en-US/docs/Web/API/ValidityState/tooLong). In some cases, this is because `.validity` is not supported in the first place.",
4 => "Does not support `ValidityState.tooLong` correctly in the (unlikely) case of the value being initially set too long, then changed by the user to a still incorrect state. See [Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1203844) and [MS Edge bug](https://web.archive.org/web/20171210191653/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/4678527/).",
5 => "`<input>`'s UI does not prevent the user from typing additional characters beyond the `maxlength` limit between two existing characters of the string.",
6 => "Allows text beyond maxlength to be entered at first, but removes all characters past the maxlength when focus is lost.",
},
parent => "form-validation",
spec => "https://html.spec.whatwg.org/multipage/forms.html#attr-input-maxlength",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y", "135" => "y #6" },
and_ff => { 137 => "y #6" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "u", "6" => "a #1 #2 #3", "10" => "y", "12" => "y #4", "79" => "y" },
firefox => { 2 => "a #1 #2 #3", 4 => "y #4", 51 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y", "8" => "a #5", "9.0-9.2" => "y" },
kaios => { "2.5" => "y #4" },
op_mini => { all => "a #1" },
op_mob => { 10 => "a #1", 80 => "y #6" },
opera => { "15" => "y", "9" => "u", "9.5-9.6" => "a #1" },
safari => { "3.1" => "u", "3.2" => "a #1 #2 #3", "5" => "u", "5.1" => "y" },
samsung => { 4 => "y #6" },
},
status => "ls",
title => "maxlength attribute for input and textarea elements",
ucprefix => 0,
},
"media-fragments" => {
categories => ["DOM"],
description => "Allows only part of a resource to be shown, based on the fragment identifier in the URL. Currently support is primarily limited to video track ranges.",
links => [
{
title => "Media fragments on MDN",
url => "https://developer.mozilla.org/de/docs/Web/HTML/Using_HTML5_audio_and_video#Specifying_playback_range",
},
],
notes_by_num => {
1 => "Only appears to support the `#t=n,n` control for selecting a range of video, and possibly `track=(name)` & `id=(name)` (not yet tested)",
},
spec => "https://www.w3.org/TR/media-frags/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a #1" },
and_ff => { 137 => "a #1" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "a #1" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 18 => "a #1" },
edge => { "5.5" => "n", "79" => "a #1" },
firefox => { 2 => "n", 34 => "a #1" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "n", "8" => "a #1" },
kaios => { "2.5" => "a #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 15 => "a #1" },
safari => { "3.1" => "n", "6" => "a #1" },
samsung => { "4" => "n", "6.2-6.4" => "a #1" },
},
status => "rec",
title => "Media Fragments",
ucprefix => 0,
},
"mediacapture-fromelement" => {
categories => ["DOM", "JS API"],
chrome_id => "5522768674160640,4817998447640576",
description => "API to capture Real-Time video and audio from a DOM element, such as a `<video>`, `<audio>`, or `<canvas>` element via the `captureStream` method, in the form of a `MediaStream`",
keywords => "canvas,mediastream,capturestream,canvas.capturestream",
links => [
{
title => "MDN Web Docs - capture from <canvas>",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/captureStream",
},
{
title => "MDN Web Docs - capture from <video>/<audio>",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/captureStream",
},
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2016/10/capture-stream",
},
],
notes_by_num => {
1 => "Does not support capture from `<video>`/`<audio>`",
2 => "Capture from `<video>`/`<audio>` can be enabled via the Experimental Web Platform Features flag.",
},
parent => "stream",
spec => "https://w3c.github.io/mediacapture-fromelement/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "a #2" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "a d #2", 62 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 43 => "a #2" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "a #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "a d #2", 48 => "y" },
safari => { "3.1" => "n", "11" => "a #1" },
samsung => { "4" => "n", "5.0-5.4" => "a #1", "8.2" => "y" },
},
status => "wd",
title => "Media Capture from DOM Elements API",
ucprefix => 0,
},
"mediarecorder" => {
categories => ["DOM", "JS API"],
chrome_id => 5929649028726784,
description => "The MediaRecorder API (MediaStream Recording) aims to provide a really simple mechanism by which developers can record media streams from the user's input devices and instantly use them in web apps, rather than having to perform manual encoding operations on raw PCM data, etc.",
links => [
{
title => "MDN Web Docs - MediaRecorder",
url => "https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder_API",
},
],
notes_by_num => {
1 => "Can be enabled via the experimental Web Platform features flag. Does not support audio recording, only video.",
2 => "Can be enabled using the Develop > Experimental Features menu.",
3 => "Can be enabled using the Advanced > Experimental Features menu.",
},
parent => "stream",
spec => "https://w3c.github.io/mediacapture-record/MediaRecorder.html",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 47 => "n d #1", 49 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 29 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "n d #3", "14.5-14.8" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 34 => "n d #1", 36 => "y" },
safari => { "3.1" => "n", "12.1" => "n d #2", "14.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "MediaRecorder API",
ucprefix => 0,
},
"mediasource" => {
categories => ["DOM", "JS API"],
chrome_id => 4563797888991232,
description => "API allowing media data to be accessed from HTML `video` and `audio` elements.",
keywords => "sourcebuffer,endofstream,mse",
links => [
{
title => "MDN Web Docs - MediaSource",
url => "https://developer.mozilla.org/en-US/docs/Web/API/MediaSource",
},
{
title => "MSDN article",
url => "https://msdn.microsoft.com/en-us/library/dn594470%28v=vs.85%29.aspx",
},
{ title => "MediaSource demo", url => "https://simpl.info/mse/" },
],
notes_by_num => {
1 => "Partial support in IE11 refers to only working in Windows 8+",
2 => "Fully supported only in iPadOS, 13 and later",
},
spec => "https://www.w3.org/TR/media-source/",
stats => {
and_chr => { "2.1" => "n", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 17 => "n d", 23 => "y x", 31 => "y" },
edge => { "5.5" => "n", "11" => "a #1", "12" => "y" },
firefox => { 2 => "n", 25 => "n d", 42 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "13.0-13.1" => "a #2", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "8" => "y" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "rec",
title => "Media Source Extensions",
ucprefix => 0,
},
"menu" => {
categories => ["HTML5"],
description => "Method of defining a context menu item, now deprecated and [removed from the HTML specification](https://github.com/whatwg/html/issues/2730). ",
keywords => "contextmenu,<menuitem>,command",
links => [
{
title => "Demo",
url => "https://bug617528.bugzilla.mozilla.org/attachment.cgi?id=554309",
},
{
title => "jQuery polyfill",
url => "https://github.com/swisnl/jQuery-contextMenu",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/events.js#event-contextmenu",
},
{
title => "Bug on Firefox support",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=746087",
},
{
title => "Chromium support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=87553",
},
],
notes_by_num => {
1 => "Partial support in Firefox refers to being limited to context menus, not toolbar menus.",
2 => "Can be enabled with the `dom.menuitem.enabled` preference in `about:config`.",
},
spec => "https://www.w3.org/TR/2016/REC-html51-20161101/interactive-elements.html#context-menus",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n d #1 #2" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "n d", 61 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n", 8 => "a #1", 85 => "n d #1 #2" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 35 => "n d", 47 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Context menu item (menuitem element)",
ucprefix => 0,
},
"meta-theme-color" => {
categories => ["DOM", "Other"],
chrome_id => 5398016231997440,
description => "Meta tag to define a suggested color that browsers should use to customize the display of the page or of the surrounding user interface. The meta tag overrides any theme-color set in the web app manifest.",
links => [
{
title => "Firefox for Android implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1098544",
},
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2014/11/Support-for-theme-color-in-Chrome-39-for-Android?hl=en",
},
],
notes => "Vivaldi browser (Chromium based) supports this feature in both mobile and desktop version. Also supported in the (now discontinued) Firefox OS.",
notes_by_num => {
1 => "Desktop Chrome only uses the color on installed `progressive web apps`.",
2 => "Desktop Chrome 39-72 claimed to have support, but did not actually use the color anywhere. Chrome for Android did use the color in the toolbar.",
3 => "Chrome for Android does not use the color on devices with native `dark-mode` enabled before Chrome 92 unless it's an installed `progressive web app` or a `trusted web activity`.",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#meta-theme-color",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 39 => "n #2", 73 => "a #1" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n", "15" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "u", "6.2-6.4" => "y" },
},
status => "ls",
title => "theme-color Meta Tag",
ucprefix => 0,
},
"meter" => {
categories => ["HTML5"],
description => "Method of indicating the current level of a gauge.",
keywords => "<meter>",
links => [
{
title => "MDN Web Docs - Element meter",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meter",
},
{
title => "HTML5 Doctor on meter element",
url => "https://html5doctor.com/measure-up-with-the-meter-tag/",
},
{
title => "Dev.Opera article",
url => "https://dev.opera.com/articles/new-form-features-in-html5/#newoutput",
},
{
title => "Examples of progress and meter elements",
url => "https://peter.sh/examples/?/html/meter-progress.html",
},
{
title => "The HTML `<meter>` element and its (undefined) segment boundaries",
url => "https://www.ctrl.blog/entry/html-meter-segment-boundaries.html",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-meter-element",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 8 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 16 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { 9 => "n", 11 => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "meter element",
ucprefix => 0,
},
"midi" => {
categories => ["JS API"],
chrome_id => 4923613069180928,
description => "The Web MIDI API specification defines a means for web developers to enumerate, manipulate and access MIDI devices",
keywords => "webmidi",
links => [
{
title => "Polyfill",
url => "https://github.com/cwilso/WebMIDIAPIShim",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=836897",
},
{
title => "Test/demo page",
url => "https://www.onlinemusictools.com/webmiditest/",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=107250",
},
],
notes_by_num => {},
spec => "https://webaudio.github.io/web-midi-api/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 108 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 30 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Web MIDI API",
ucprefix => 0,
},
"minmaxwh" => {
categories => ["CSS2"],
description => "Method of setting a minimum or maximum width or height to an element. ",
keywords => "min-width,min-height,max-width,max-height",
links => [
{
title => "JS library with support",
url => "https://code.google.com/archive/p/ie7-js/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/min-width",
},
{
title => "CSS Basics post",
url => "https://www.impressivewebs.com/min-max-width-height-css/",
},
],
notes_by_num => {
1 => "IE7 does not support `inherit` as a value on any of these properties.",
2 => "IE8 has some bugs with `max-width`/`height` combined with `overflow: auto`/`scroll`.",
},
spec => "https://www.w3.org/TR/CSS21/visudet.html#min-max-widths",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "p", "7" => "y #1", "8" => "y #2", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS min/max-width/height",
ucprefix => 0,
},
"mp3" => {
categories => ["Other"],
description => "Popular lossy audio compression format",
keywords => "mpeg",
links => [
{ title => "Wikipedia", url => "https://en.wikipedia.org/wiki/MP3" },
],
notes => "Support refers to this format's use in the `audio` element, not other conditions.",
notes_by_num => {
1 => "Partial support in older Firefox refers to being limited to certain operating systems.",
},
parent => "audio",
spec => "http://mpgedit.org/mpgedit/mpeg_format/MP3Format.html",
stats => {
and_chr => { "2.1" => "n", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.5" => "a #1", "22" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "MP3 audio format",
ucprefix => 0,
},
"mpeg-dash" => {
categories => ["Other"],
description => "HTTP-based media streaming communications protocol, an alternative to HTTP Live Streaming (HLS).",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Dynamic_Adaptive_Streaming_over_HTTP",
},
{
title => "JavaScript implementation",
url => "https://github.com/Dash-Industry-Forum/dash.js/",
},
],
notes => "DASH can be used with a JavaScript library in browsers that doesn't support it natively as long as they support [Media Source Extensions](/mediasource).",
notes_by_num => {
1 => "Can be enabled via the `media.dash.enabled` flag.",
2 => "Only WebM video is supported.",
},
spec => "https://www.iso.org/standard/65274.html",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "12" => "y", "79" => "n" },
firefox => { 2 => "n", 21 => "n #1 #2", 23 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "Dynamic Adaptive Streaming over HTTP (MPEG-DASH)",
ucprefix => 0,
},
"mpeg4" => {
categories => ["Other"],
description => "Commonly used video compression format.",
keywords => "avc,mp4,mpv,mov,aac,h264",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/H.264/MPEG-4_AVC",
},
{
title => "Firefox extension allowing support in Win7",
url => "http://www.interoperabilitybridges.com/html5-extension-for-wmp-plugin",
},
],
notes => "Firefox supports H.264 on Windows 7 and later since version 21. Firefox supports H.264 on Linux since version 26 if the appropriate system libraries are installed.\r\n\r\nPartial support for older Firefox versions refers to the lack of support in OS X & some non-Android Linux platforms.",
notes_by_num => {
1 => "The Android 2.3 browser requires [specific handling](https://www.broken-links.com/2010/07/08/making-html5-video-work-on-android-phones/) to play videos.",
},
parent => "video",
spec => "http://ip.hhi.de/imagecom_G1/assets/pdfs/csvt_overview_0305.pdf",
stats => {
and_chr => { "2.1" => "a", "2.3" => "a #1", "3" => "a", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 21 => "a", 35 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { 9 => "n", 25 => "y" },
safari => { "3.1" => "n", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "MPEG-4/H.264 video format",
ucprefix => 0,
},
"multibackgrounds" => {
categories => ["CSS3"],
description => "Method of using multiple images as a background",
links => [
{
title => "Demo & information page",
url => "https://www.css3.info/preview/multiple-backgrounds/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/background-image",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-background/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 Multiple backgrounds",
ucprefix => 0,
},
"multicolumn" => {
categories => ["CSS3"],
chrome_id => "6526151266664448,5630943616303104",
description => "Method of flowing information in multiple columns",
keywords => "column-count,column-width,column-gap,column-rule,column-rule-type,column-span,column-fill,break-before,break-after,break-inside",
links => [
{
title => "Dev.Opera article",
url => "https://dev.opera.com/articles/view/css3-multi-column-layout/",
},
{
title => "Introduction page",
url => "https://webdesign.tutsplus.com/articles/an-introduction-to-the-css3-multiple-column-layout-module--webdesign-4934",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/column-width",
},
{
title => "Polyfill",
url => "https://github.com/hamsterbacke23/multicolumn-polyfill",
},
{
title => "Chrome platform status for CSS column-fill",
url => "https://www.chromestatus.com/feature/6298909664083968",
},
],
notes_by_num => {
1 => "Does not support the properties `break-after`, `break-before`, and `break-inside`. WebKit- and Blink-based browsers have equivalent support with the non-standard `-webkit-column-break-*` properties, but only for the values `auto` and `always`. Firefox does not support the `break-*` properties but supports the now-obsolete `page-break-*` properties in the paging (printing) context.",
2 => "Does not support the `column-fill` property.",
3 => "Does not support the values `avoid` (in the column context), `avoid-column`, and `avoid-page` for the properties `break-after`, `break-before`, and `break-inside`; does not support the value `column` for the properties `break-after` and `break-before`.",
4 => "Does not support the values `avoid` (in the column context) for the properties `break-after`, `break-before`, and `break-inside`; does not support the values `avoid-column`, `avoid-page`, and `column` for the properties `break-before` and `break-after`.",
},
spec => "https://www.w3.org/TR/css3-multicol/",
stats => {
and_chr => { "2.1" => "a x #1 #2", "135" => "a #3" },
and_ff => { 137 => "a #4" },
and_qq => { "14.9" => "a #3" },
and_uc => { "15.5" => "a #3" },
baidu => { "13.52" => "a #3" },
bb => { 7 => "a x #1 #2" },
chrome => { 4 => "a x #1 #2", 50 => "a #3" },
edge => { "5.5" => "n", "10" => "y", "79" => "a #3" },
firefox => { 2 => "a x #1", 52 => "a #1", 65 => "a #3", 92 => "a #4" },
ie_mob => { 10 => "y" },
ios_saf => {
"10.0-10.2" => "y",
"3.2" => "a x #1 #2",
"7.0-7.1" => "a x #1",
"9.0-9.2" => "a #1",
},
kaios => { "2.5" => "a x #1" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "11.1" => "y", "80" => "a #3" },
opera => { "9" => "n", "11.1" => "y", "15" => "a x #1 #2", "37" => "a #3" },
safari => { "3.1" => "a x #1 #2", "7" => "a x #1", "9" => "a #1", "10" => "y" },
samsung => { "4" => "a x #1 #2", "5.0-5.4" => "a #3" },
},
status => "cr",
title => "CSS3 Multiple column layout",
ucprefix => 0,
},
"mutation-events" => {
categories => ["DOM"],
chrome_id => 5083947249172480,
description => "Deprecated mechanism for listening to changes made to the DOM, replaced by Mutation Observers.",
keywords => "DOMAttrModified,DOMCharacterDataModified,DOMNodeInserted,DOMNodeInsertedIntoDocument,DOMNodeRemoved,DOMNodeRemovedFromDocument,DOMSubtreeModified",
links => [
{
title => "MDN Web Docs - MutationEvent",
url => "https://developer.mozilla.org/en-US/docs/Web/API/MutationEvent",
},
],
notes => "Mutation events are deprecated and have been removed from the spec as of 2024-09-07. Instead see support for [Mutation Observer](/mutationobserver), which replaces mutation events and does not have the same performance drawbacks.",
notes_by_num => {
1 => "Does not support `DOMAttrModified`",
2 => "Does not support `DOMNodeInsertedIntoDocument` & `DOMNodeRemovedFromDocument`",
},
spec => "https://www.w3.org/TR/2024/WD-uievents-20240906/#legacy-mutationevent-events",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "135" => "n d" },
and_ff => { 137 => "a #2" },
and_qq => { "14.9" => "a #1" },
and_uc => { "15.5" => "a #1" },
baidu => { "13.52" => "a #1" },
bb => { 7 => "a #1" },
chrome => { 4 => "u", 15 => "a #1", 127 => "n d" },
edge => { "5.5" => "n", "9" => "a #2", "79" => "a #1", "127" => "n d" },
firefox => { 2 => "n", 6 => "a #2" },
ie_mob => { 10 => "a #2" },
ios_saf => { "3.2" => "u", "4.2-4.3" => "a #1" },
kaios => { "2.5" => "a #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "u", 12 => "y", 80 => "a #1" },
opera => { "9" => "n", "11" => "u", "11.6" => "y", "15" => "a #1", "113" => "n d" },
safari => { "3.1" => "u", "4" => "a #1" },
samsung => { 4 => "a #1" },
},
status => "unoff",
title => "Mutation events",
ucprefix => 0,
},
"mutationobserver" => {
categories => ["DOM", "JS API"],
chrome_id => 5021194726146048,
description => "Method for observing and reacting to changes to the DOM. Replaces MutationEvents, which is deprecated.",
keywords => "MutationObserver",
links => [
{
title => "MutationObserver from MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver",
},
{
title => "Polyfill",
url => "https://github.com/webcomponents/webcomponentsjs",
},
],
notes => "When changing the `innerHTML` content of a node containing a single `CharacterData` node, resulting in a single-but-different `CharacterData` child node, WebKit browsers consider this a `characterData` mutation of the child `CharacterData` node, while other browsers consider it a `childList` mutation of the parent node.",
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#mutation-observers",
stats => {
and_chr => { "2.1" => "n", "4" => "p", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 18 => "y x", 27 => "y" },
edge => { "5.5" => "n", "9" => "p", "11" => "y" },
firefox => { 2 => "n", 14 => "y" },
ie_mob => { 10 => "p", 11 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y x", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "y x", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Mutation Observer",
ucprefix => 0,
},
"namevalue-storage" => {
categories => ["JS API"],
chrome_id => 5345825534246912,
description => "Method of storing data locally like cookies, but for larger amounts of data (sessionStorage and localStorage, used to fall under HTML5).",
keywords => "webstorage,local storage",
links => [
{
title => "MDN Web Docs - Web Storage",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API",
},
{
title => "Support library",
url => "https://code.google.com/archive/p/sessionstorage/downloads",
},
{ title => "Simple demo", url => "https://html5demos.com/storage" },
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-localstorage;native-sessionstorage",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/web-storage/Storage/localStorage",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/webstorage.html#storage",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "8" => "y" },
firefox => { "2" => "a", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Web Storage - name/value pairs",
ucprefix => 0,
},
"native-filesystem-api" => {
categories => ["JS API"],
chrome_id => 6284708426022912,
description => "API for manipulating files in the device's local file system (not in a sandbox).",
keywords => "File System,File System API,chooseFileSystemEntries,getFile",
links => [
{
title => "Explainer",
url => "https://github.com/WICG/file-system-access/blob/master/EXPLAINER.md",
},
{
title => "Web.dev blog post",
url => "https://web.dev/file-system-access/",
},
{
title => "Firefox position: harmful",
url => "https://mozilla.github.io/standards-positions/#file-system-access",
},
{
title => "Chrome blog post",
url => "https://developers.google.com/web/updates/2019/08/native-file-system",
},
],
notes_by_num => {
1 => "Can be enabled in desktop Chromium browsers with the `#native-file-system-api` flag.",
2 => "Parts of the API are still missing.",
},
spec => "https://wicg.github.io/file-system-access/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "n d #1", 86 => "a #2", 105 => "y" },
edge => { "5.5" => "n", "79" => "n d #1", "86" => "a #2", "105" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 62 => "n d #1", 72 => "a #2", 91 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "File System Access API",
ucprefix => 0,
},
"nav-timing" => {
categories => ["DOM", "JS API"],
chrome_id => 5584144679567360,
description => "API for accessing timing information related to navigation and elements.",
keywords => "performance,performance.timing,performancenavigation",
links => [
{
title => "MDN Web Docs - Navigation Timing",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Navigation_timing_API",
},
{
title => "HTML5 Rocks tutorial",
url => "https://www.html5rocks.com/en/tutorials/webperformance/basics/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/navigation_timing",
},
],
notes => "Removed in iOS 8.1 due to poor performance.",
notes_by_num => {},
spec => "https://www.w3.org/TR/navigation-timing/",
stats => {
and_chr => { "2.1" => "n", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 6 => "y x", 13 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 7 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "8" => "y", "8.1-8.4" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "8" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "Navigation Timing API",
ucprefix => 0,
},
"netinfo" => {
categories => ["DOM", "JS API"],
chrome_id => 6338383617982464,
description => "The Network Information API enables web applications to access information about the network connection in use by the device. Accessed via `navigator.connection`",
keywords => "performance,network,network information,netinfo",
links => [
{
title => "(NetInfo) Capability reporting with ServiceWorker",
url => "https://www.igvita.com/2014/12/15/capability-reporting-with-service-worker/",
},
],
notes_by_num => {
1 => "Supports only the `navigator.connection.type` value which doesn't match the latest spec. [see details](https://www.davidbcalhoun.com/2010/optimizing-based-on-connection-speed-using-navigator.connection-on-android-2.2-/)",
2 => "Only supports the `type` value.",
3 => "Only supports the `type` and `downlinkMax` values.",
4 => "Only supports the `downlink`, `effectiveType` & `rtt` values.",
},
spec => "https://wicg.github.io/netinfo/",
stats => {
and_chr => { "2.1" => "n", "2.2" => "a #1", "4.4" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 61 => "a #4" },
edge => { "5.5" => "n", "79" => "a #4" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "a #2", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 48 => "a #4" },
safari => { "3.1" => "n" },
samsung => { "4" => "a #1", "5.0-5.4" => "a #3", "8.2" => "y" },
},
status => "unoff",
title => "Network Information API",
ucprefix => 0,
},
"notifications" => {
categories => ["JS API"],
chrome_id => 5064350557536256,
description => "Method of alerting the user outside of a web page by displaying notifications (that do not require interaction by the user).",
links => [
{
title => "HTML5 Rocks tutorial",
url => "https://www.html5rocks.com/tutorials/notifications/quick/",
},
{
title => "Chromium API",
url => "https://www.chromium.org/developers/design-documents/desktop-notifications/api-specification/",
},
{
title => "Add-on",
url => "https://addons.mozilla.org/en-us/firefox/addon/221523/",
},
{
title => "MDN Web Docs - Notification",
url => "https://developer.mozilla.org/en-US/docs/Web/API/notification",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/introduction-web-notifications-api/",
},
{
title => "Demo",
url => "https://audero.it/demo/web-notifications-api-demo.html",
},
{
title => "Plug-in for support in IE",
url => "https://ie-web-notifications.github.io/",
},
],
notes_by_num => {
1 => "Supports notifications via the [Push API](https://caniuse.com/#feat=push-api) but not the Web Notifications API.",
2 => "Chrome for Android requires the call to be made with a [service worker registration](https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API#Service_worker_additions)",
3 => "Requires website to first be [added to the Home Screen](/web-app-manifest)",
},
spec => "https://notifications.spec.whatwg.org/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a x" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n #1" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 5 => "a x", 22 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 22 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "a #3" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a x" },
opera => { 9 => "n", 25 => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { "4" => "a x", "5.0-5.4" => "n #1" },
},
status => "ls",
title => "Web Notifications",
ucprefix => 0,
},
"object-entries" => {
categories => ["JS"],
description => "The `Object.entries()` method creates a multi-dimensional array of key value pairs from the given object.",
keywords => "ecmascript 2017,javascript",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries",
},
{
title => "ES2017 spec-compliant shim for Object.entries",
url => "https://github.com/es-shims/Object.entries",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-object",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-object.entries",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "u" },
chrome => { 4 => "n", 54 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 47 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 41 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "other",
title => "Object.entries",
ucprefix => 0,
},
"object-fit" => {
categories => ["CSS3"],
chrome_id => 5302669702856704,
description => "Method of specifying how an object (image or video) should fit inside its box. object-fit options include \"contain\" (fit according to aspect ratio), \"fill\" (stretches object to fill) and \"cover\" (overflows box but maintains ratio), where object-position allows the object to be repositioned like background-image does.",
keywords => "objectfit,objectposition",
links => [
{
title => "Dev.Opera article",
url => "https://dev.opera.com/articles/view/css3-object-fit-object-position/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/object-fit",
},
{
title => "object-fit-images Polyfill for IE & Edge",
url => "https://github.com/bfred-it/object-fit-images/",
},
{
title => "MDN (object-fit)",
url => "https://developer.mozilla.org/docs/Web/CSS/object-fit",
},
{
title => "MDN (object-position)",
url => "https://developer.mozilla.org/docs/Web/CSS/object-position",
},
],
notes_by_num => {
1 => "Partial support in Safari refers to support for `object-fit` but not `object-position`.",
2 => "Partial support in Edge refers to `object-fit` only supporting `<img>` ([see this comment](https://web.archive.org/web/20171208010253/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/13603873/#comment-0))",
},
spec => "https://www.w3.org/TR/css3-images/",
stats => {
and_chr => { "2.1" => "n", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 32 => "y" },
edge => { "5.5" => "n", "16" => "a #2", "79" => "y" },
firefox => { 2 => "n", 36 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n", "8" => "a #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "y x" },
op_mob => { 10 => "n", 11 => "y x", 80 => "y" },
opera => { "9" => "n", "10.6" => "y x", "15" => "n", "19" => "y" },
safari => { "3.1" => "n", "7.1" => "a #1", "10" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 object-fit/object-position",
ucprefix => 0,
},
"object-observe" => {
categories => ["JS"],
chrome_id => 6147094632988672,
description => "Method for data binding, a now-withdrawn ECMAScript 7 proposal",
links => [
{
title => "Data-binding Revolutions with Object.observe()",
url => "https://www.html5rocks.com/en/tutorials/es7/observe/",
},
{
title => "Polyfill",
url => "https://github.com/MaxArt2501/object-observe",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=800355",
},
{
title => "An update on Object.observe",
url => "https://esdiscuss.org/topic/an-update-on-object-observe",
},
],
notes => "Support in Blink-based browsers is expected to be removed in future versions.",
notes_by_num => {},
spec => "http://wiki.ecmascript.org/doku.php?id=harmony:observe",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 36 => "y", 50 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 23 => "y", 37 => "n" },
safari => { "3.1" => "n" },
samsung => { "4" => "y", "5.0-5.4" => "n" },
},
status => "unoff",
title => "Object.observe data binding",
ucprefix => 0,
},
"object-values" => {
categories => ["JS"],
description => "The `Object.values()` method returns an array of a given object's own enumerable property values.",
keywords => "object,values",
links => [
{
title => "Object.values() on MDN Web Docs",
url => "https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Object/values",
},
{
title => "Polyfill",
url => "https://github.com/es-shims/Object.values",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-object",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-object.values",
stats => {
and_chr => { "2.1" => "p", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p" },
chrome => { 4 => "p", 54 => "y" },
edge => { "5.5" => "p", "12" => "n", "14" => "y" },
firefox => { 2 => "p", 47 => "y" },
ie_mob => { 10 => "p" },
ios_saf => { "3.2" => "p", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "p" },
op_mob => { 10 => "p", 80 => "y" },
opera => { 9 => "p", 41 => "y" },
safari => { "3.1" => "p", "10.1" => "y" },
samsung => { "4" => "p", "6.2-6.4" => "y" },
},
status => "other",
title => "Object.values method",
ucprefix => 0,
},
"objectrtc" => {
categories => ["JS API"],
description => "Enables mobile endpoints to talk to servers and web browsers with Real-Time Communications (RTC) capabilities via native and simple JavaScript APIs",
keywords => "RTC,WebRTC,ORTC,ObjectRTC,RTCIceTransport,RTCIceGatherer,RTCRtpSender,RTCRtpReceiver,Real Time,video,webcam",
links => [
{
title => "Related blog posts by Microsoft",
url => "https://blogs.windows.com/msedgedev/tag/object-rtc/",
},
],
notes => "ORTC is often dubbed WebRTC 1.1. It is possible to make ORTC communicate with WebRTC 1.0 endpoints. See [WebRTC 1.0](https://caniuse.com/#feat=rtcpeerconnection) for support details for that API.",
notes_by_num => {},
spec => "https://www.w3.org/community/ortc/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "13" => "y", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "Object RTC (ORTC) API for WebRTC",
ucprefix => 0,
},
"offline-apps" => {
categories => ["HTML5"],
chrome_id => 6192449487634432,
description => "Now deprecated method of defining web page files to be cached using a cache manifest file, allowing them to work offline on subsequent visits to the page. ",
keywords => "appcache,applicationcache,app cache,application cache,online",
links => [
{
title => "Sitepoint tutorial",
url => "https://www.sitepoint.com/offline-web-application-tutorial/",
},
{
title => "Dive Into HTML5 article",
url => "http://diveintohtml5.info/offline.html",
},
{
title => "Mozilla Hacks article/demo",
url => "https://hacks.mozilla.org/2010/01/offline-web-applications/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/appcache/ApplicationCache",
},
],
notes => "This technology is being deprecated in favor of [Service Workers](https://caniuse.com/#feat=serviceworkers)",
notes_by_num => {},
spec => "https://www.w3.org/TR/2011/WD-html5-20110525/offline.html#offline",
stats => {
and_chr => { "2.1" => "y", "135" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "y" },
chrome => { 4 => "y", 85 => "n" },
edge => { "5.5" => "n", "6" => "p", "9" => "n", "10" => "y", "85" => "n" },
firefox => { "2" => "p", "3" => "a", "3.5" => "y", "84" => "n" },
ie_mob => { 10 => "y" },
ios_saf => { "15.0-15.1" => "n", "3.2" => "y" },
kaios => { "2.5" => "y", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y", 80 => "n" },
opera => { "10.0-10.1" => "p", "10.6" => "y", "73" => "n", "9" => "n" },
safari => { "3.1" => "p", "4" => "y", "15" => "n" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "Offline web applications",
ucprefix => 0,
},
"offscreencanvas" => {
categories => ["HTML5"],
chrome_id => 5681560598609920,
description => "OffscreenCanvas allows canvas drawing to occur with no connection to the DOM and can be used inside workers.",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas",
},
{
title => "WebGL off the main thread - Mozilla Hacks article",
url => "https://hacks.mozilla.org/2016/01/webgl-off-the-main-thread/",
},
{
title => "Making the whole web better, one canvas at a time. - Article about canvas performance",
url => "https://bkardell.com/blog/OffscreenCanvas.html",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1390089",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=183720",
},
],
notes_by_num => {
1 => "Can be enabled via the `gfx.offscreencanvas.enabled` flag. Currently only supports WebGL contexts, not 2D.",
2 => "Can be enabled via the `Experimental canvas features` flag",
3 => "Partial support refers to only supporting 2D contexts, not WebGL.",
},
spec => "https://html.spec.whatwg.org/multipage/canvas.html#the-offscreencanvas-interface",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #2", 69 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 44 => "n d #1", 105 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.2" => "a #3", "17.0" => "y" },
kaios => { "2.5" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 45 => "n d #2", 64 => "y" },
safari => { "3.1" => "n", "16.2" => "a #3", "17.0" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "ls",
title => "OffscreenCanvas",
ucprefix => 0,
},
"ogg-vorbis" => {
categories => ["Other"],
description => "Vorbis is a free and open source audio format, most commonly used with the Ogg container.",
keywords => ".ogg,.oga,application/ogg,audio/ogg",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Vorbis",
},
],
notes => "Support refers to this format's use in the `audio` element, not other conditions.",
notes_by_num => {
1 => "Supported on macOS Big Sur 11.3 or later.",
2 => "Supports the Vorbis audio codec, but not the Ogg container.",
},
parent => "audio",
spec => "https://www.xiph.org/vorbis/doc/Vorbis_I_spec.html",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.4" => "a #2", "18.4" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "n", "14.1" => "a #1 #2", "17.0" => "a #2", "18.4" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Ogg Vorbis audio format",
ucprefix => 0,
},
"ogv" => {
categories => ["Other"],
description => "Free lossy video compression format.",
keywords => "xiph",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Theora",
},
{
title => "Chrome Platform Status: Deprecate and remove Theora support",
url => "https://chromestatus.com/feature/5158654475239424",
},
{
title => "Firefox bug: Investigate removing Theora support",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1860492",
},
],
notes_by_num => {
1 => "Chrome is deprecating and removing Theora support, see [this platform status entry](https://chromestatus.com/feature/5158654475239424)",
},
parent => "video",
spec => "https://theora.org/doc/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "y", 120 => "n d #1" },
edge => { "5.5" => "n", "9" => "p", "17" => "y", "122" => "n d #1" },
firefox => { "2" => "n", "3.5" => "y", "130" => "n" },
ie_mob => { 10 => "p" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { "9" => "n", "10.5" => "y", "106" => "n d #1" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "Ogg/Theora video format",
ucprefix => 0,
},
"ol-reversed" => {
categories => ["HTML5"],
description => "This attribute makes an ordered list number its items in descending order (large to small), instead of ascending order (small to large; the default). The order that the list items are displayed in is not affected.",
keywords => "reversed,list,ol,attribute",
links => [
{
title => "HTML5 Doctor article on <ol> element attributes (including reversed)",
url => "https://html5doctor.com/ol-element-attributes/",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#attr-ol-reversed",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 16 => "u", 20 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 18 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "12" => "u", "12.1" => "y" },
safari => { "3.1" => "n", "6" => "u", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Reversed attribute of ordered lists",
ucprefix => 0,
},
"once-event-listener" => {
categories => ["DOM"],
chrome_id => 5630331130478592,
description => "Causes an event listener to be automatically removed after it gets invoked, so that it only gets invoked once. Similar to jQuery's `\$.one()` feature.",
keywords => "event,listener,options,once",
links => [
{
title => "Chromium Issue 615384: Support \"once\" event listener option",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=615384",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/zigiru/edit?html,js,output",
},
],
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-addeventlisteneroptions-once",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 55 => "y" },
edge => { "5.5" => "n", "16" => "y" },
firefox => { 2 => "n", 50 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 42 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "ls",
title => "\"once\" event listener option",
ucprefix => 0,
},
"online-status" => {
categories => ["JS API"],
description => "Events to indicate when the user's connected (`online` and `offline` events) and the `navigator.onLine` property to see current status.",
links => [
{
title => "MDN Web Docs - NavigatorOnLine.onLine",
url => "https://developer.mozilla.org/en-US/docs/Web/API/NavigatorOnLine.onLine#Specification",
},
],
notes => "\"online\" does not always mean connection to the internet, it can also just mean connection to some network.\r\n\r\nEarly versions of Chrome and Safari always reported \"true\" for `navigator.onLine`",
notes_by_num => {
1 => "Seems to support `navigator.onLine` but not `online`/`offline` events.",
2 => "IE8 only supports the `online`/`offline` events on `document.body`, rather than `window`.",
3 => "Desktop Firefox responds to the status of its \"Work Offline\" mode. If not in that mode, `navigator.onLine` is always `true`, regardless of the actual network connectivity status. [See bug](https://bugzilla.mozilla.org/show_bug.cgi?id=654579) for details.",
4 => "Safari 7.0 supports only the event listener on `window`, and not on `document.body`",
},
spec => "https://html.spec.whatwg.org/multipage/browsers.html#browser-state",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1", 10 => "y" },
chrome => { 4 => "n", 14 => "y" },
edge => { "5.5" => "n", "8" => "a #2", "9" => "y" },
firefox => { "2" => "n", "3.5" => "y", "4" => "a #3", "41" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.2-4.3" => "y", "7.0-7.1" => "y #4", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "12.1" => "a", "15" => "y" },
safari => { "3.1" => "n", "5" => "y", "7" => "y #4", "7.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Online/offline status",
ucprefix => 0,
},
"opus" => {
categories => ["Other"],
chrome_id => 4891189287321600,
description => "Royalty-free open audio codec by IETF, which incorporated SILK from Skype and CELT from Xiph.org, to serve higher sound quality and lower latency at the same bitrate.",
links => [
{
title => "Introduction of Opus by Mozilla",
url => "https://hacks.mozilla.org/2012/07/firefox-beta-15-supports-the-new-opus-audio-format/",
},
{
title => "Google's statement about the use of VP8 and Opus codec for WebRTC standard",
url => "https://www.ietf.org/mail-archive/web/rtcweb/current/msg04953.html",
},
],
notes => "Support refers to this format's use in the `audio` element, not other conditions.\r\n\r\nFor Opera the Linux version may be able to play it when the GStreamer module is up to date and the served mime-type is 'audio/ogg'.",
notes_by_num => {
1 => "Supported only when packaged in a CAF file and on macOS High Sierra/iOS 11 or later (constant bit-rate only).",
2 => "Supported in a WebM container (all bitrates). Has a [known regression](https://bugs.webkit.org/show_bug.cgi?id=245428).",
3 => "Supported in a WebM container (all bitrates).",
4 => "Partial support refers to requiring macOS 15.4 Sequoia or later.",
},
parent => "audio",
spec => "https://tools.ietf.org/html/rfc6716",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 33 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "n" },
ios_saf => {
"11.0-11.2" => "a #1",
"17.4" => "a #2",
"17.5" => "a #3",
"18.4" => "y",
"3.2" => "n",
},
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 20 => "y" },
safari => {
"3.1" => "n",
"11" => "a #1",
"17.4" => "a #2",
"17.5" => "a #3",
"18.4" => "a #4",
},
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Opus audio format",
ucprefix => 0,
},
"orientation-sensor" => {
categories => ["JS API"],
chrome_id => 5698781827825664,
description => "Defines a base orientation sensor interface and concrete sensor subclasses to monitor the device\x{2019}s physical orientation in relation to a stationary three dimensional Cartesian coordinate system.",
links => [
{
title => "Demo",
url => "https://intel.github.io/generic-sensor-demos/orientation-phone/",
},
{
title => "Article",
url => "https://developers.google.com/web/updates/2017/09/sensors-for-the-web#orientation-sensors",
},
],
notes_by_num => {
1 => "Available by enabling the \"Generic Sensor\" experimental flag in `about:flags`",
},
spec => "https://www.w3.org/TR/orientation-sensor/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 58 => "n d #1", 67 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "Orientation Sensor",
ucprefix => 0,
},
"outline" => {
categories => ["CSS3"],
description => "The CSS outline properties draw a border around an element that does not affect layout, making it ideal for highlighting. This covers the `outline` shorthand, as well as `outline-width`, `outline-style`, `outline-color` and `outline-offset`. ",
keywords => "-moz-outline,outline-width,outline-style,outline-color,outline-radius",
links => [
{
title => "CSS Basic User Interface Module Level 3",
url => "https://drafts.csswg.org/css-ui-3/#outline",
},
{
title => "MDN Web Docs - CSS outline",
url => "https://developer.mozilla.org/en-US/docs/CSS/outline",
},
],
notes_by_num => {
1 => "Also supports the value of `invert` for `outline-color`. (support of this value is optional for browsers)",
2 => "Does not support `outline-offset`.",
},
spec => "https://w3c.github.io/csswg-drafts/css-ui/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "a #2", "9" => "a #1 #2", "15" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "a #1 #2" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "a #2", 12 => "y" },
opera => { "9" => "a #2", "11.6" => "y", "12.1" => "y #1", "15" => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS outline properties",
ucprefix => 0,
},
"pad-start-end" => {
categories => ["JS"],
chrome_id => 5694172086403072,
description => "The `padStart()` and `padEnd()` methods pad the current string with a given string (eventually repeated) so that the resulting string reaches a given length. The pad is applied from the start (left) of the current string for `padStart()`, and applied from the end (right) of the current string for `padEnd()`.",
keywords => "pad,pad start,pad end",
links => [
{
title => "MDN Web Docs - padStart()",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart",
},
{
title => "MDN Web Docs - padEnd()",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padEnd",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-string-and-regexp",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-string.prototype.padend",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 57 => "y" },
edge => { "5.5" => "n", "15" => "y" },
firefox => { 2 => "n", 48 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 44 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "other",
title => "String.prototype.padStart(), String.prototype.padEnd()",
ucprefix => 0,
},
"page-transition-events" => {
categories => ["HTML5", "JS API"],
description => "Fired at the Window when the page's entry in the session history stops being the current entry. Includes the `pageshow` and `pagehide` events.",
keywords => "history,page,transition,hide,show,bfcache,event,persisted,cache,back,forward",
links => [
{
title => "MDN Web Docs - pageshow",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/pageshow",
},
{
title => "HTML onpageshow Event Attribute",
url => "https://www.w3schools.com/tags/ev_onpageshow.asp",
},
{
title => "Back/forward cache: web-exposed behaviour",
url => "https://docs.google.com/document/d/1JtDCN9A_1UBlDuwkjn1HWxdhQ1H2un9K4kyPLgBqJUc",
},
{
title => "Back-forward cache on Android",
url => "https://docs.google.com/document/d/1E7LY4HxkJxIjNt9PJIq5vKtNh6hB0PCTzENGkoYAbgA",
},
{
title => "web.dev - Back/forward cache",
url => "https://web.dev/bfcache/",
},
],
notes => "Whether or not a document was/will be cached by a back-forward cache is indicated by [`event.persisted` property](https://developer.mozilla.org/en-US/docs/Web/API/PageTransitionEvent/persisted) where developers can [opt to reload the page](https://web.dev/bfcache/) if needed.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/indices.html#event-pageshow",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "PageTransitionEvent",
ucprefix => 0,
},
"pagevisibility" => {
categories => ["JS API"],
chrome_id => 5689697795833856,
description => "JavaScript API for determining whether a document is visible on the display",
keywords => "visibilitystate,visibilitychange,onvisibilitychange",
links => [
{
title => "MDN Web Docs - Page Visibility",
url => "https://developer.mozilla.org/en-US/docs/DOM/Using_the_Page_Visibility_API",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/introduction-to-page-visibility-api/",
},
{
title => "Demo",
url => "https://audero.it/demo/page-visibility-api-demo.html",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/page-visibility/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 14 => "y x", 33 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 10 => "y x", 18 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "9" => "n", "12.1" => "y", "15" => "y x", "20" => "y" },
safari => { "3.1" => "n", "6.1" => "y" },
samsung => { "4" => "y x", "5.0-5.4" => "y" },
},
status => "rec",
title => "Page Visibility",
ucprefix => 0,
},
"passive-event-listener" => {
categories => ["DOM"],
chrome_id => 5745543795965952,
description => "Event listeners created with the `passive: true` option cannot cancel (`preventDefault()`) the events they receive. Primarily intended to be used with touch events and `wheel` events. Since they cannot prevent scrolls, passive event listeners allow the browser to perform optimizations that result in smoother scrolling.",
keywords => "passive,event,listener,options",
links => [
{
title => "Improving scroll performance with passive event listeners - Google Developers Updates",
url => "https://developers.google.com/web/updates/2016/06/passive-event-listeners?hl=en",
},
{
title => "Polyfill from the WICG",
url => "https://github.com/WICG/EventListenerOptions/blob/gh-pages/EventListenerOptions.polyfill.js",
},
{
title => "Original WICG EventListenerOptions repository",
url => "https://github.com/WICG/EventListenerOptions",
},
{
title => "JS Bin testcase",
url => "https://jsbin.com/jaqaku/edit?html,js,output",
},
],
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-addeventlisteneroptions-passive",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "y" },
edge => { "5.5" => "n", "16" => "y" },
firefox => { 2 => "n", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 38 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "ls",
title => "Passive event listeners",
ucprefix => 0,
},
"passkeys" => {
categories => ["JS API", "Security"],
description => "Passkeys, also known as Multi-device FIDO Credentials, provide users with an alternative to passwords that is much easier to use and far more secure.",
keywords => "Web Authentication, WebAuth, FIDO, FIDO2, CTAP, CTAP2",
links => [
{
title => "Passkeys at apple.com",
url => "https://developer.apple.com/passkeys/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1792433",
},
{
title => "Google article on Passkeys for developers",
url => "https://developers.google.com/identity/passkeys",
},
{
title => "FIDO alliance article on Passkeys",
url => "https://fidoalliance.org/passkeys/",
},
],
notes => "Support for various passkey features also depends on the device and OS used. See the [passkeys.dev site](https://passkeys.dev/device-support/) for details.\r\n\r\nBrowsers without Passkey support may still allow authentication at passkey logins via other types of security keys as long as they support [WebAuthn](/webauthn).",
notes_by_num => {},
spec => "https://fidoalliance.org/multi-device-fido-credentials/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 108 => "y" },
edge => { "5.5" => "n", "108" => "y" },
firefox => { 2 => "n", 122 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 97 => "y" },
safari => { "3.1" => "n", "16.1" => "y" },
samsung => { 4 => "n", 20 => "u", 21 => "y" },
},
status => "other",
title => "Passkeys",
ucprefix => 0,
},
"path2d" => {
categories => ["Canvas", "HTML5"],
description => "Allows path objects to be declared on 2D canvas surfaces",
keywords => "addpath",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Path2D",
},
],
notes_by_num => { 1 => "Does not support the `addPath()` method" },
parent => "canvas",
spec => "https://html.spec.whatwg.org/multipage/canvas.html#path2d-objects",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 36 => "a #1", 68 => "y" },
edge => { "5.5" => "n", "14" => "a #1", "79" => "y" },
firefox => { 2 => "n", 31 => "a #1", 48 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "u", "8.1-8.4" => "a #1", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 23 => "a #1", 55 => "y" },
safari => { "3.1" => "n", "7.1" => "a #1", "9.1" => "y" },
samsung => { "4" => "a #1", "10.1" => "y" },
},
status => "ls",
title => "Path2D",
ucprefix => 0,
},
"payment-request" => {
categories => ["JS API"],
chrome_id => 5639348045217792,
description => "Payment Request is a new API for the open web that makes checkout flows easier, faster and consistent on shopping sites.",
keywords => "PaymentRequest,Web Payments",
links => [
{
title => "Spec discussion",
url => "https://github.com/w3c/browser-payment-api/",
},
{
title => "Bringing easy and fast checkout with Payment Request API",
url => "https://developers.google.com/web/updates/2016/07/payment-request",
},
{
title => "Payment Request API Integration Guide",
url => "https://developers.google.com/web/fundamentals/discovery-and-monetization/payment-request/",
},
{
title => "MDN Web Docs - Payment Request API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Payment_Request_API",
},
{ title => "Demo", url => "https://paymentrequest.show/demo" },
{
title => "Simpler Demos and Codes",
url => "https://googlechrome.github.io/samples/paymentrequest/",
},
],
notes => "Apple provides an equivalent proprietary API called [Apple Pay JS](https://developer.apple.com/reference/applepayjs/). Google provides a [PaymentRequest wrapper for Apple Pay JS](https://github.com/GoogleChrome/appr-wrapper).",
notes_by_num => {
1 => "Can be enabled via the \"Experimental Web Platform features\" flag",
2 => "Can be enabled via the \"Experimental Web Payments API\" flag",
3 => "Apple's proprietary implementation (see above)",
4 => "Can be enabled via the \"[Web Payments API](chrome://flags/#web-payments)\" flag",
5 => "Unlike Desktop Chrome, support has been in Chrome for Android since version 53.",
6 => "Can be enabled via the `dom.payments.request.enabled` flag in \"about:config\" flag since 55.",
7 => "Missing support for PaymentResponse.prototype.retry() method",
8 => "Disabled by default in Nightly. To enable, go to \"about:config\" and set \"dom.payments.request.enabled\" to true, and \"dom.payments.request.supportedRegions\" to \"US,CA\".",
},
spec => "https://www.w3.org/TR/payment-request/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "a #7" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 53 => "n d #1", 59 => "n d #4", 61 => "a #7", 78 => "y" },
edge => { "5.5" => "n", "14" => "n d #2", "15" => "a #7", "79" => "y" },
firefox => { 2 => "n", 55 => "n d #6", 66 => "a d #8" },
ie_mob => { 10 => "n" },
ios_saf => {
"10.0-10.2" => "n #3",
"11.3-11.4" => "a #7",
"12.2-12.5" => "y",
"3.2" => "n",
},
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 40 => "n d #1", 48 => "a #7", 66 => "y" },
safari => { "3.1" => "n", "10" => "n #3", "11.1" => "a #7", "12.1" => "y" },
samsung => { "12.0" => "y", "4" => "n", "5.0-5.4" => "a #7" },
},
status => "rec",
title => "Payment Request API",
ucprefix => 0,
},
"pdf-viewer" => {
categories => ["Other"],
description => "Support for a PDF viewer that is part of the browser, rather than requiring a PDF file to be opened in an external application.",
keywords => "pdf reader",
links => [
{
title => "PDFObject - JavaScript utility to embed PDF documents in HTML",
url => "https://pdfobject.com",
},
],
notes => "When displaying PDFs inline rather than separately, iOS Safari will only display the first page of the document.",
notes_by_num => { 1 => "Not supported in IE11 before Windows 10" },
spec => "https://www.adobe.com/content/dam/acom/en/devnet/pdf/pdfs/PDF32000_2008.pdf",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "u" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "11" => "a #1", "12" => "u", "15" => "y" },
firefox => { 2 => "n", 19 => "y" },
ie_mob => { 10 => "u" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 12 => "y" },
safari => { "3.1" => "u", "4" => "y" },
samsung => { 4 => "n" },
},
status => "other",
title => "Built-in PDF viewer",
ucprefix => 0,
},
"permissions-api" => {
categories => ["JS API", "Security"],
chrome_id => 6376494003650560,
description => "High-level JavaScript API for checking and requesting permissions",
keywords => "web-permissions,navigator.permissions",
links => [
{
title => "Permission API samples and examples",
url => "https://developer.chrome.com/blog/permissions-api-for-the-web/",
},
{
title => "Extended \"polyfill\" version of permission API",
url => "https://github.com/jimmywarting/browser-su",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/permissions/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 46 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.0" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 30 => "y" },
safari => { "3.1" => "n", "16.0" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Permissions API",
ucprefix => 0,
},
"permissions-policy" => {
categories => ["JS API", "Other", "Security"],
chrome_id => 5745992911552512,
description => "A security mechanism that allows developers to explicitly enable or disable various powerful browser features for a given site. Similar to [Document Policy](/document-policy).",
keywords => "feature,security,header,allow,attribute,allow attribute,attribute allow,feature policy,feature-policy,document.featurePolicy,document.policy,permissions-policy,document.permissionsPolicy",
links => [
{
title => "W3C - Permissions Policy Explainer",
url => "https://github.com/w3c/webappsec-feature-policy/blob/main/permissions-policy-explainer.md",
},
{
title => "Firefox implementation tracker",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1531012",
},
{
title => "List of known features",
url => "https://github.com/w3c/webappsec-permissions-policy/blob/main/features.md",
},
],
notes => "Standard support includes the HTTP `Permissions-Policy` header, `allow` attribute on iframes and the `document.permissionsPolicy` JS API.",
notes_by_num => {
1 => "Chromium browsers only support the HTTP header.",
2 => "At least partially supports [Feature Policy](/feature-policy), the predecessor to this spec.",
},
spec => "https://w3c.github.io/webappsec-permissions-policy/",
stats => {
and_chr => { "2.1" => "n", "135" => "n #2" },
and_ff => { 137 => "n #2" },
and_qq => { "14.9" => "n #2" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "a #1 #2" },
bb => { 7 => "n" },
chrome => { 4 => "n", 60 => "n #2", 86 => "n d #2", 88 => "a #1 #2" },
edge => { "5.5" => "n", "79" => "n #2", "86" => "n d #2", "88" => "a #1 #2" },
firefox => { 2 => "n", 74 => "n #2" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "n #2", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "n #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1 #2" },
opera => { 9 => "n", 47 => "n #2", 72 => "n d #2", 95 => "a #1 #2" },
safari => { "3.1" => "n", "11.1" => "n #2" },
samsung => { "4" => "n", "8.2" => "n #2" },
},
status => "wd",
title => "Permissions Policy",
ucprefix => 0,
},
"picture" => {
categories => ["DOM", "HTML5"],
chrome_id => 5910974510923776,
description => "A responsive images method to control which image resource a user agent presents to a user, based on resolution, media query and/or support for a particular image format",
keywords => "<picture>",
links => [
{ title => "Demo", url => "https://responsiveimages.org/demos/" },
{
title => "Tutorial",
url => "https://code.tutsplus.com/tutorials/better-responsive-images-with-the-picture-element--net-36583",
},
{
title => "Read about the use cases",
url => "https://usecases.responsiveimages.org/",
},
{
title => "General information about Responsive Images",
url => "https://responsiveimages.org/",
},
{
title => "Blog post on usage",
url => "https://dev.opera.com/articles/responsive-images/",
},
{
title => "HTML5 Rocks tutorial",
url => "https://www.html5rocks.com/tutorials/responsive/picture-element/",
},
{
title => "Picturefill - polyfill for picture, srcset, sizes, and more",
url => "https://github.com/scottjehl/picturefill",
},
],
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Enabled in Opera through the \"experimental Web Platform features\" flag in opera://flags",
3 => "Enabled in Firefox by setting the about:config preference dom.image.picture.enable to true",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#the-picture-element",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 37 => "n d #1", 38 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 34 => "n d #3", 38 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 24 => "n d #2", 25 => "y" },
safari => { "3.1" => "n", "9.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Picture element",
ucprefix => 0,
},
"picture-in-picture" => {
categories => ["JS API"],
chrome_id => 5729206566649856,
description => "Allows websites to create a floating video window that is always on top of other windows so that users may continue consuming media while they interact with other sites or applications on their device.",
keywords => "Picture-in-Picture,PictureInPicture,pip,pop-out,autoPictureInPicture,disablePictureInPicture,auto,disable,picture in picture,pseudo",
links => [
{
title => "Sample video",
url => "https://googlechrome.github.io/samples/picture-in-picture/",
},
{
title => "Safari equivalent API",
url => "https://developer.apple.com/documentation/webkitjs/adding_picture_in_picture_to_your_safari_media_controls",
},
{
title => "Opera equivalent Video Pop Out feature",
url => "https://blogs.opera.com/desktop/2016/04/opera-beta-update-video-pop/",
},
{
title => "Implementation Status",
url => "https://github.com/WICG/picture-in-picture/blob/master/implementation-status.md",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1519885",
},
],
notes_by_num => {
1 => "Partial support in Firefox refers to the fact that Mozilla provides an equivalent proprietary feature, which allows users to use Picture-in-Picture mode for all playing videos.",
2 => "Partial support in Firefox 71 refers to being enabled by default only for Windows users.",
3 => "Partial support in Firefox 68\x{2013}70 refers to being enabled by default in Firefox pre-release channels for Windows users only.",
4 => "Can be enabled in Firefox via the `media.videocontrols.picture-in-picture.enabled` pref in `about:config`.",
5 => "Can be enabled in Chrome via the `#enable-picture-in-picture` & `#enable-surfaces-for-videos` flags in `chrome://flags`.",
6 => "Partial support in Safari refers to the fact that Apple provides an equivalent proprietary API for Picture-in-Picture, which is only supported by macOS 10.12 Sierra & iOS 9 and newer.",
7 => "Partial support in Opera refers to the fact that Opera provides an equivalent proprietary feature named Video Pop Out, which allows users to use Picture-in-Picture mode for all playing videos.",
8 => "Automatically plays fullscreen videos in Picture-in-Picture mode after user hits Home Screen button. Only Android 8.0 Oreo and newer provide appropriate API for Picture-in-Picture.",
},
spec => "https://wicg.github.io/picture-in-picture/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "a #8" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 69 => "n d #5", 70 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 67 => "n d #4", 68 => "a #3 #1 #4", 71 => "a #2 #1 #4", 72 => "a #1" },
ie_mob => { 10 => "n" },
ios_saf => { "14.0-14.4" => "y", "3.2" => "n", "9.0-9.2" => "a #6" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 37 => "a #7", 73 => "y" },
safari => { "3.1" => "n", "10" => "a #6", "13.1" => "y" },
samsung => { 4 => "n" },
},
status => "wd",
title => "Picture-in-Picture",
ucprefix => 0,
},
"ping" => {
categories => ["HTML5"],
description => "When used on an anchor, this attribute signifies that the browser should send a ping request the resource the attribute points to.",
keywords => "ping,a.ping,a[ping],ping attribute",
links => [
{
title => "MDN Web Docs - Element ping attribute",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-ping",
},
],
notes => "While still in the WHATWG specification, this feature was removed from the W3C HTML5 specification in 2010.",
notes_by_num => {
1 => "Disabled by default for [privacy reasons](http://kb.mozillazine.org/Browser.send_pings). Can be enabled via the `browser.send_pings` flag.",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#ping",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "n d #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { 2 => "n", 3 => "n d #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Ping attribute",
ucprefix => 0,
},
"png-alpha" => {
categories => ["PNG"],
description => "Semi-transparent areas in PNG files",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/Portable_Network_Graphics",
},
],
notes => "IE6 does support full transparency in 8-bit PNGs, which can sometimes be an alternative to 24-bit PNGs.",
notes_by_num => {},
spec => "https://www.w3.org/TR/PNG/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "7" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "PNG alpha transparency",
ucprefix => 0,
},
"pointer" => {
categories => ["CSS", "DOM", "JS API"],
chrome_id => 4504699138998272,
description => "This specification integrates various inputs from mice, touchscreens, and pens, making separate implementations no longer necessary and authoring for cross-device pointers easier. Not to be mistaken with the unrelated \"pointer-events\" CSS property.",
keywords => "pointerdown,pointermove,pointerup,pointercancel,pointerover,pointerout,pointerenter,pointerleave",
links => [
{
title => "Abstraction library for pointer events",
url => "https://deeptissuejs.com/",
},
{
title => "PEP: Pointer Events Polyfill",
url => "https://github.com/jquery/PEP",
},
{
title => "Pointer Event API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events",
},
{
title => "Bugzilla\@Mozilla: Bug 822898 - Implement pointer events",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=822898",
},
],
notes => "Firefox, starting with version 28, provides the 'dom.w3c_pointer_events.enabled' flag to support this specification.",
notes_by_num => {
1 => "Partial support in IE10 refers to the lack of pointerenter and pointerleave events.",
2 => "Firefox support is disabled by default and [only supports mouse input](https://hacks.mozilla.org/2015/08/pointer-events-now-in-firefox-nightly/). On Windows only, touch can be enabled with the `layers.async-pan-zoom.enabled` and `dom.w3c_touch_events.enabled` flags",
3 => "Can be enabled with the `#enable-pointer-events` flag.",
4 => "Can be enabled under the `Experimental Features` menu.",
5 => "element.releasePointerCapture(pointerID) is only partially implemented. Calling it after pointerdown does not result in boundary events (pointerover pointerleave) being dispatched during pointer movements.",
6 => "Value of pointerevent.buttons is incorrect on pointermove events generated by touches. Is 0 but should be 1.",
},
spec => "https://www.w3.org/TR/pointerevents/",
stats => {
and_chr => { "2.1" => "p", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p" },
chrome => { 4 => "n", 22 => "p", 52 => "p d #3", 55 => "y" },
edge => { "5.5" => "n", "10" => "a x #1", "11" => "y" },
firefox => { 2 => "n", 6 => "p", 41 => "p d #2", 59 => "y" },
ie_mob => { 10 => "a x", 11 => "y" },
ios_saf => { "13.0-13.1" => "a #5 #6", "13.2" => "y", "3.2" => "p" },
kaios => { "2.5" => "p d #2", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "p", 80 => "y" },
opera => { 9 => "n", 15 => "p", 39 => "p d #3", 42 => "y" },
safari => { "3.1" => "n", "6.1" => "p", "12.1" => "p d #4", "13" => "y" },
samsung => { "4" => "p", "5.0-5.4" => "n", "6.2-6.4" => "y" },
},
status => "rec",
title => "Pointer events",
ucprefix => 0,
},
"pointer-events" => {
categories => ["CSS3"],
description => "This CSS property, when set to \"none\" allows elements to not receive hover/click events, instead the event will occur on anything behind it. ",
keywords => "pointerevents,pointer-events:none",
links => [
{
title => "Article & tutorial",
url => "https://robertnyman.com/2010/03/22/css-pointer-events-to-allow-clicks-on-underlying-elements/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/css.js#css-pointerevents",
},
{
title => "Polyfill",
url => "https://github.com/kmewhort/pointer_events_polyfill",
},
{
title => "MDN Web Docs - pointer-events",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events",
},
],
notes => "Already part of the SVG specification, and all SVG-supporting browsers appear to support the property on SVG elements.",
notes_by_num => {},
spec => "https://wiki.csswg.org/spec/css4-ui#pointer-events",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "11" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "CSS pointer-events (for HTML)",
ucprefix => 0,
},
"pointerlock" => {
categories => ["JS API"],
chrome_id => 6753200417800192,
description => "API that provides access to raw mouse movement data. This is done by ignoring boundaries resulting from screen edges where the cursor can't go beyond, providing proper control for first person or real time strategy games. ",
keywords => "mouselock,pointer lock,mouse lock,requestPointerLock,pointerLockElement,exitPointerLock,movementX,movementY",
links => [
{
title => "MDN Web Docs - Pointer Lock",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API",
},
{
title => "Simple demo",
url => "https://mdn.github.io/dom-examples/pointer-lock/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/pointerlock/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "u" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 16 => "n d", 22 => "y x", 37 => "y" },
edge => { "5.5" => "n", "13" => "y" },
firefox => { 2 => "n", 14 => "y x", 50 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "u" },
opera => { 9 => "n", 15 => "y x", 24 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "n" },
},
status => "rec",
title => "Pointer Lock API",
ucprefix => 0,
},
"portals" => {
categories => ["HTML5", "JS API"],
chrome_id => 4828882419056640,
description => "Portals enable seamless navigation between sites or pages. A new page can be loaded as an inset using the `<portal>` element (similar to an iframe) which can then seamlessly transition to the new navigated state when \"activated\".",
keywords => "portal api,portals api,portal element,htmlportalelement,portal.activate,onportalactivate",
links => [
{
title => "Hands-on with Portals: seamless navigation on the Web",
url => "https://web.dev/hands-on-portals/",
},
],
notes_by_num => {
1 => "Available when registered for [origin trial](https://web.dev/hands-on-portals/#register-for-ot)",
2 => "Available by enabling the `#enable-portals` flag at `chrome://flags/`",
},
spec => "https://wicg.github.io/portals/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 75 => "n d #1", 85 => "n d #1 #2", 86 => "n d #2" },
edge => { "5.5" => "n", "85" => "n d #1 #2", "90" => "n d #2" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 62 => "n d #1", 73 => "n d #2" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Portals",
ucprefix => 0,
},
"prefers-color-scheme" => {
categories => ["CSS"],
chrome_id => 5109758977638400,
description => "Media query to detect if the user has set their system to use a light or dark color theme.",
keywords => "prefers-dark-interface",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/\@media/prefers-color-scheme",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1494034",
},
{
title => "Chromium implementation issue",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=889087",
},
{
title => "Web.dev article",
url => "https://web.dev/prefers-color-scheme/",
},
],
notes => "Support will also depend on whether or not the OS has support for a light/dark theme preference.",
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/mediaqueries-5/#prefers-color-scheme",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 76 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 67 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "y" },
safari => { "3.1" => "n", "12.1" => "y" },
samsung => { "4" => "n", "12.0" => "y" },
},
status => "wd",
title => "prefers-color-scheme media query",
ucprefix => 0,
},
"prefers-reduced-motion" => {
categories => ["CSS"],
chrome_id => 5597964353404928,
description => "CSS media query based on a user preference for preferring reduced motion (animation, etc).",
keywords => "no-preference",
links => [
{
title => "WebKit blog post",
url => "https://webkit.org/blog/7551/responsive-design-for-motion/",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/introduction-reduced-motion-media-query/",
},
],
notes => "prefers-reduced-motion media query also depends on the OS as to whether it is supported.",
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/mediaqueries-5/#prefers-reduced-motion",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 63 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 64 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "wd",
title => "prefers-reduced-motion media query",
ucprefix => 0,
},
"progress" => {
categories => ["HTML5"],
description => "Method of indicating a progress state.",
keywords => "#progressmeter,<progress>",
links => [
{
title => "CSS-Tricks article",
url => "https://css-tricks.com/html5-progress-element/",
},
{
title => "MDN Web Docs - Element progress",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress",
},
{
title => "Dev.Opera article",
url => "https://dev.opera.com/articles/new-form-features-in-html5/#newoutput",
},
{
title => "Examples of progress and meter elements",
url => "https://peter.sh/examples/?/html/meter-progress.html",
},
],
notes_by_num => { 1 => "does not support \"indeterminate\" <progress> elements." },
spec => "https://html.spec.whatwg.org/multipage/forms.html#the-progress-element",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 8 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 6 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "a #1", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { 9 => "n", 11 => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "progress element",
ucprefix => 0,
},
"promise-finally" => {
categories => ["JS"],
chrome_id => 5704570235781120,
description => "When the promise is settled, whether fulfilled or rejected, the specified callback function is executed.",
keywords => "promise.finally",
links => [
{
title => "MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/finally",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-promise",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-promise.prototype.finally",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 63 => "y" },
edge => { "5.5" => "n", "18" => "y" },
firefox => { 2 => "n", 58 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 50 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "other",
title => "Promise.prototype.finally",
ucprefix => 0,
},
"promises" => {
categories => ["JS"],
chrome_id => 5681726336532480,
description => "A promise represents the eventual result of an asynchronous operation.",
keywords => "promise,futures",
links => [
{ title => "Promises/A+ spec", url => "https://promisesaplus.com/" },
{
title => "JavaScript Promises: There and back again - HTML5 Rocks",
url => "https://www.html5rocks.com/en/tutorials/es6/promises/",
},
{
title => "A polyfill for ES6-style Promises",
url => "https://github.com/jakearchibald/ES6-Promises",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-promise",
},
],
notes_by_num => {},
spec => "https://tc39.es/ecma262/#sec-promise-objects",
stats => {
and_chr => { "2.1" => "p", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "p" },
chrome => { 4 => "p", 32 => "a", 33 => "y" },
edge => { "5.5" => "p", "12" => "y" },
firefox => { 2 => "p", 27 => "a", 29 => "y" },
ie_mob => { 10 => "p" },
ios_saf => { "3.2" => "p", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "p" },
op_mob => { 10 => "p", 80 => "y" },
opera => { 9 => "p", 19 => "a", 20 => "y" },
safari => { "3.1" => "p", "7.1" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Promises",
ucprefix => 0,
},
"proximity" => {
categories => ["JS API"],
description => "Defines events that provide information about the distance between a device and an object, as measured by a proximity sensor.",
links => [
{
title => "Demo",
url => "https://audero.it/demo/proximity-api-demo.html",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/introducing-proximity-api/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/proximity/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "Proximity API",
ucprefix => 0,
},
"proxy" => {
categories => ["JS"],
chrome_id => 4811188005240832,
description => "The Proxy object allows custom behavior to be defined for fundamental operations. Useful for logging, profiling, object visualization, etc.",
keywords => "proxies,es6,es2015,traps,meta,virtual,logging,host",
links => [
{
title => "ECMAScript 6 Proxies",
url => "https://github.com/lukehoban/es6features#proxies",
},
{
title => "MDN Web Docs - Proxy",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy",
},
{
title => "Experimenting with ECMAScript 6 proxies",
url => "https://humanwhocodes.com/blog/2011/09/15/experimenting-with-ecmascript-6-proxies/",
},
{
title => "Meta programming with ECMAScript 6 proxies",
url => "https://2ality.com/2014/12/es6-proxies.html",
},
{
title => "Polyfill for Proxies",
url => "https://github.com/tvcutsem/harmony-reflect",
},
],
notes_by_num => {},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-proxy-objects",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 19 => "n d", 38 => "n", 49 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 18 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "n d", 25 => "n", 36 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Proxy object",
ucprefix => 0,
},
"publickeypinning" => {
categories => ["Security"],
chrome_id => 5903385005916160,
description => "Declare that a website's HTTPS certificate should only be treated as valid if the public key is contained in a list specified over HTTP to prevent MITM attacks that use valid CA-issued certificates.",
keywords => "pkp,hpkp,security,header",
links => [
{
title => "MDN Web Docs - Public Key Pinning",
url => "https://developer.mozilla.org/en-US/docs/Web/Security/Public_Key_Pinning",
},
{
title => "Scott Helme article on the issues of HPKP",
url => "https://scotthelme.co.uk/im-giving-up-on-hpkp/",
},
],
notes => "All browsers have removed support. The header was too complicated to use, and when incorrectly implemented, could completely block websites for longer periods of time.\r\n\r\n[Certificate transparency](https://developer.mozilla.org/en-US/docs/Web/Security/Certificate_Transparency) is widely used and tries to provide the same security by very different means.",
notes_by_num => {},
spec => "https://tools.ietf.org/html/rfc7469",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 38 => "y", 72 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n", 35 => "y", 72 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 20 => "u", 23 => "a", 24 => "u", 25 => "y", 66 => "n" },
safari => { "3.1" => "n" },
samsung => { "11.1-11.2" => "n", "4" => "y" },
},
status => "other",
title => "HTTP Public Key Pinning",
ucprefix => 0,
},
"push-api" => {
categories => ["JS API"],
chrome_id => 5416033485586432,
description => "API to allow messages to be pushed from a server to a browser, even when the site isn't focused or even open in the browser.",
keywords => "web push,push notifications",
links => [
{
title => "MDN Web Docs - Push API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Push_API",
},
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web",
},
],
notes_by_num => {
1 => "Partial support refers to not supporting `PushEvent.data` and `PushMessageData`",
2 => "Requires full browser to be running to receive messages",
3 => "Safari 7.0 - 16.0 supported a custom implementation which remains available in later versions, see [Safari Push Notifications](https://developer.apple.com/notifications/safari-push-notifications/) and [WWDC video](https://web.archive.org/web/20210419000205/https://developer.apple.com/videos/play/wwdc2013/614/)",
4 => "Disabled on Firefox ESR, but can be re-enabled with the `dom.serviceWorkers.enabled` and `dom.push.enabled` flags",
5 => "Only available on macOS 13 Ventura or later",
6 => "Supported in Safari, not WKWebView nor SFSafariViewController",
7 => "Requires website to first be added to the Home Screen.",
},
spec => "https://w3c.github.io/push-api/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 44 => "a #1 #2", 50 => "y #2" },
edge => { "5.5" => "n", "17" => "y", "79" => "y #2" },
firefox => {
2 => "n",
44 => "y #2",
45 => "y #2 #4",
46 => "y #2",
52 => "y #2 #4",
53 => "y #2",
60 => "y #2 #4",
61 => "y #2",
},
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "a #7" },
kaios => { "2.5" => "y #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 37 => "u", 42 => "y #2" },
safari => { "3.1" => "n", "7" => "n #3", "16.1" => "a #3 #5 #6", "18.0" => "y #3 #6" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Push API",
ucprefix => 0,
},
"queryselector" => {
categories => ["DOM"],
description => "Method of accessing DOM elements using CSS selectors",
keywords => "query,selectors,selectors api,document.queryselector",
links => [
{
title => "MDN Web Docs - querySelector",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/querySelector",
},
{
title => "MDN Web Docs - querySelectorAll",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/querySelectorAll",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/selectors_api/querySelector",
},
],
notes_by_num => {
1 => "Partial support in IE8 is due to being limited to [CSS 2.1 selectors](/#feat=css-sel2) and a small subset of [CSS 3 selectors](/#feat=css-sel3) (see notes there). Additionally, it will have trouble with selectors including unrecognized tags (for example HTML5 ones).",
},
spec => "https://dom.spec.whatwg.org/#dom-parentnode-queryselector",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "8" => "a #1", "9" => "y" },
firefox => { "2" => "p", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "p" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "querySelector/querySelectorAll",
ucprefix => 0,
},
"readonly-attr" => {
categories => ["DOM", "HTML5"],
description => "Makes the form control non-editable. Unlike the `disabled` attribute, `readonly` form controls are still included in form submissions and the user can still select (but not edit) their value text.",
keywords => "readonly,read,attribute,edit,editable",
links => [
{
title => "WHATWG HTML specification for the readonly attribute of the `<textarea>` element",
url => "https://html.spec.whatwg.org/multipage/forms.html#attr-textarea-readonly",
},
{
title => "MDN Web Docs - readonly attribute",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input#attr-readonly",
},
],
notes_by_num => {
1 => "Readonly inputs of type `datetime-local`, `date`, `month`, and `week` can still be edited by pressing the Up or Down arrow keys on the keyboard while the input is focused.",
2 => "Text cannot be selected directly, but is possible by first selecting any text around the field. ",
},
spec => "https://html.spec.whatwg.org/multipage/input.html#the-readonly-attribute",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "u", 26 => "y" },
edge => { "5.5" => "u", "6" => "y" },
firefox => { 2 => "u", 4 => "y" },
ie_mob => { 10 => "y #2" },
ios_saf => { "3.2" => "u", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "a #1", 80 => "y" },
opera => { "10.0-10.1" => "a #1", "15" => "y", "9" => "u" },
safari => { "3.1" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "readonly attribute of input and textarea elements",
ucprefix => 0,
},
"referrer-policy" => {
categories => ["Security"],
chrome_id => "5639972996513792,6251880185331712",
description => "A policy that controls how much information is shared through the HTTP `Referer` header. Helps to protect user privacy.",
keywords => "meta,referrer,referer",
links => [
{
title => "Mozilla security article",
url => "https://blog.mozilla.org/security/2015/01/21/meta-referrer/",
},
{
title => "A new security header: Referrer Policy",
url => "https://scotthelme.co.uk/a-new-security-header-referrer-policy/",
},
],
notes_by_num => {
1 => "Browsers initially supported an [early draft](https://wiki.whatwg.org/wiki/Meta_referrer) of the specification which can only use a meta tag and is only compatible with the `origin` value from the new spec.",
2 => "Chrome 21-60 did not support the `same-origin`, `strict-origin` and `strict-origin-when-cross-origin` values. ([issue 627968](https://bugs.chromium.org/p/chromium/issues/detail?id=627968))",
3 => "Older browsers defaulted to `no-referrer-when-downgrade` which is unsafe. The default has been updated to `strict-origin-when-cross-origin` which is safe for most use cases. See [the revised spec.](https://github.com/w3c/webappsec-referrer-policy/pull/142)",
4 => "[Safari's ITP](https://webkit.org/blog/9661/preventing-tracking-prevention-tracking/) (on by default) downgrades _all_ cross-site subresource request (not page navigation) `Referer` headers to the page's origin, ignoring the `unsafe-url`, `no-referrer-when-downgrade`, and `origin-when-cross-origin` referrer policies.",
5 => "[Firefox 92+ ignores](https://bugzilla.mozilla.org/show_bug.cgi?id=1720294) the `unsafe-url`, `no-referrer-when-downgrade`, and `origin-when-cross-origin` referrer policies, defaulting to `strict-origin-when-cross-origin`.",
},
spec => "https://www.w3.org/TR/referrer-policy/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y #5" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 21 => "a #2", 61 => "y #3", 85 => "y" },
edge => { "5.5" => "n", "11" => "a #1", "79" => "y #3", "85" => "y" },
firefox => { 2 => "n", 36 => "y #3", 87 => "y", 92 => "y #5" },
ie_mob => { 10 => "n" },
ios_saf => {
"12.0-12.1" => "y #3",
"13.3" => "y #3 #4",
"15.0-15.1" => "y #4",
"3.2" => "n",
"8" => "a #1",
},
kaios => { "2.5" => "y #3" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y #3", 73 => "y" },
safari => {
"3.1" => "n",
"7.1" => "a #1",
"11.1" => "y #3",
"13" => "y #3 #4",
"15" => "y #4",
},
samsung => { "14.0" => "y", "4" => "n", "5.0-5.4" => "y #3" },
},
status => "cr",
title => "Referrer Policy",
ucprefix => 0,
},
"registerprotocolhandler" => {
categories => ["HTML5"],
description => "Method of allowing a webpage to handle a given protocol using `navigator.registerProtocolHandler`. This allows certain URLs to be opened by a given web application, for example `mailto:` addresses can be opened by a webmail client.",
links => [
{
title => "MDN Web Docs - Register protocol handler",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Navigator/registerProtocolHandler",
},
],
notes_by_num => {
1 => "Supports protocols `mailto`, `mms`, `nntp`, `rtsp`, and `webcal` but requires custom protocols to start with `web+`",
},
spec => "https://html.spec.whatwg.org/multipage/webappapis.html#custom-handlers",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n", 10 => "y #1" },
chrome => { 4 => "n", 13 => "y #1" },
edge => { "5.5" => "n", "79" => "y #1" },
firefox => { 2 => "n", 3 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { "9" => "n", "11.6" => "y #1" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "ls",
title => "Custom protocol handling",
ucprefix => 0,
},
"rel-noopener" => {
categories => ["DOM", "HTML5", "Security"],
chrome_id => 5651874132787200,
description => "Ensure new browsing contexts are opened without a useful `window.opener`",
keywords => "rel,relation,link,security",
links => [
{
title => "Explainer",
url => "https://mathiasbynens.github.io/rel-noopener/",
},
{
title => "Gecko/Firefox issue",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1222516",
},
{
title => "WebKit/Safari issue",
url => "https://bugs.webkit.org/show_bug.cgi?id=155166",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#link-type-noopener",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 52 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "ls",
title => "rel=noopener",
ucprefix => 0,
},
"rel-noreferrer" => {
categories => ["DOM", "HTML5", "Security"],
description => "Links with `rel=\"noreferrer\"` set do not send the request's \"referrer\" header. This prevents the destination site from seeing what URL the user came from.",
links => [
{
title => "Blog post on rel=\"noreferrer\"",
url => "https://www.lifewire.com/rel-noreferrer-3468002",
},
],
notes_by_num => {
1 => "Only supported in IE11 in later versions of Windows 10 (creators update).",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#link-type-noreferrer",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "u", 16 => "y" },
edge => { "5.5" => "n", "11" => "a #1", "12" => "u", "13" => "y" },
firefox => { 2 => "n", 33 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Link type \"noreferrer\"",
ucprefix => 0,
},
"rellist" => {
categories => ["DOM", "HTML5"],
description => "Method of easily manipulating rel attribute values on elements, using the DOMTokenList object (similar to classList).",
links => [
{
title => "MDN Web Docs - DOMTokenList",
url => "https://developer.mozilla.org/en-US/docs/DOM/DOMTokenList",
},
{
title => "domtokenlist polyfill",
url => "https://github.com/jwilsson/domtokenlist",
},
],
notes_by_num => { 1 => "Support for relList on link but not anchor elements" },
spec => "https://html.spec.whatwg.org/multipage/semantics.html#dom-a-rellist",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 50 => "a #1", 65 => "y" },
edge => { "5.5" => "n", "17" => "a #1", "18" => "y" },
firefox => { 2 => "n", 30 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 37 => "a #1", 52 => "y" },
safari => { "3.1" => "n", "9" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a #1", "9.2" => "y" },
},
status => "ls",
title => "relList (DOMTokenList)",
ucprefix => 0,
},
"rem" => {
categories => ["CSS3"],
description => "Type of unit similar to `em`, but relative only to the root element, not any parent element. Thus compounding does not occur as it does with `em` units.",
keywords => "rems",
links => [
{
title => "Article on usage",
url => "https://snook.ca/archives/html_and_css/font-size-with-rem",
},
{
title => "REM Polyfill",
url => "https://github.com/chuckcarpenter/REM-unit-polyfill",
},
],
notes_by_num => {
1 => "IE 9 & IE 10 do not support `rem` units when used in the `font` shorthand property (the entire declaration is ignored) or when used on pseudo elements.",
2 => "iOS Safari 5.0-5.1 support `rem` but not in combination with media queries.",
},
spec => "https://www.w3.org/TR/css3-values/#font-relative-lengths",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "11" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y", "5.0-5.1" => "a #2", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 12 => "y" },
opera => { "9" => "n", "11.6" => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "rem (root em) units",
ucprefix => 0,
},
"requestanimationframe" => {
categories => ["JS API"],
chrome_id => 5233400470306816,
description => "API allowing a more efficient way of running script-based animation, compared to traditional methods using timeouts. Also covers support for `cancelAnimationFrame`",
links => [
{
title => "Blog post",
url => "https://www.paulirish.com/2011/requestanimationframe-for-smart-animating/",
},
{
title => "Mozilla Hacks article",
url => "https://hacks.mozilla.org/2011/08/animating-with-javascript-from-setinterval-to-requestanimationframe/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/Window/requestAnimationFrame",
},
{
title => "MDN Web Docs - requestAnimationFrame",
url => "https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame",
},
],
notes_by_num => {
1 => "Partial support refers to lacking `cancelAnimationFrame` support.",
2 => "Supports `webkitCancelRequestAnimationFrame` rather than `webkitCancelAnimationFrame`.",
},
spec => "https://html.spec.whatwg.org/multipage/webappapis.html#animation-frames",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 10 => "a x #1 #2", 18 => "a x #1", 22 => "y x", 24 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "a x #1", 11 => "y x", 23 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y x", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "y x", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "requestAnimationFrame",
ucprefix => 0,
},
"requestidlecallback" => {
categories => ["JS API"],
chrome_id => 5572795866021888,
description => "API allowing the execution of JavaScript to be queued to run in idle browser time, either at the end of a frame or when the user is inactive. Also covers support for `cancelIdleCallback`. The API has similarities with `requestAnimationFrame`.",
keywords => "requestIdleCallback,request,idle",
links => [
{
title => "MDN Web Docs - requestIdleCallback",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Window/requestIdleCallback",
},
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2015/08/using-requestidlecallback",
},
{
title => "Shim",
url => "https://gist.github.com/paullewis/55efe5d6f05434a96c36",
},
],
notes_by_num => {
1 => "Can be enabled via the `dom.requestIdleCallback.enabled` flag",
2 => "Can be enabled in Experimental (WebKit) Features",
},
spec => "https://w3c.github.io/requestidlecallback/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 47 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 53 => "n d #1", 55 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.4-13.7" => "n d #2", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 34 => "y" },
safari => { "13.1" => "n d #2", "3.1" => "n", "TP" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "wd",
title => "requestIdleCallback",
ucprefix => 0,
},
"resizeobserver" => {
categories => ["DOM", "JS API"],
chrome_id => 5705346022637568,
description => "Method for observing and reacting to changes to sizes of DOM elements.",
keywords => "ResizeObserver,onresize,resize events",
links => [
{
title => "Google Developers Article",
url => "https://developers.google.com/web/updates/2016/10/resizeobserver",
},
{
title => "Explainer Doc",
url => "https://github.com/WICG/ResizeObserver/blob/master/explainer.md",
},
{
title => "Polyfill based on initial specification",
url => "https://github.com/que-etc/resize-observer-polyfill",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1272409",
},
{
title => "WebKit implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=157743",
},
{
title => "Polyfill based on latest specification which includes support for observer options",
url => "https://github.com/juggle/resize-observer",
},
],
notes_by_num => {
1 => "Can be enabled via the \"Experimental Web Platform Features\" flag",
},
spec => "https://w3c.github.io/csswg-drafts/resize-observer/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 54 => "n d #1", 64 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 69 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "13.4-13.7" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 41 => "n d #1", 52 => "y" },
safari => { "3.1" => "n", "13" => "n d", "13.1" => "y" },
samsung => { "4" => "n", "9.2" => "y" },
},
status => "wd",
title => "Resize Observer",
ucprefix => 0,
},
"resource-timing" => {
categories => ["JS API"],
chrome_id => 5796350423728128,
description => "Method to help web developers to collect complete timing information related to resources on a document.",
keywords => "performance,testing,resource",
links => [
{
title => "Demo",
url => "https://www.audero.it/demo/resource-timing-api-demo.html",
},
{
title => "Blog post",
url => "https://developers.googleblog.com/2013/12/measuring-network-performance-with.html",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/introduction-resource-timing-api/",
},
],
notes => "For newer Resource Timing APIs search for specific methods or see the sub-features under [PerformanceResourceTiming API](/mdn-api_performanceresourcetiming)",
notes_by_num => {
1 => "Can be enabled in Firefox using the dom.enable_resource_timing flag",
2 => "Partial support in Safari refers to being limited to OSX 10.12+",
},
spec => "https://www.w3.org/TR/resource-timing/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 25 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 31 => "n d #1", 35 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "11" => "a #2", "11.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Resource Timing (basic support)",
ucprefix => 0,
},
"rest-parameters" => {
categories => ["JS"],
chrome_id => 5937087912083456,
description => "Allows representation of an indefinite number of arguments as an array.",
keywords => "ES6,JavaScript",
links => [
{
title => "Rest parameters and defaults",
url => "https://hacks.mozilla.org/2015/05/es6-in-depth-rest-parameters-and-defaults/",
},
],
notes_by_num => {
1 => "Requires the \"Experimental JavaScript features\" flag to be enabled",
},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-function-definitions",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 44 => "n d #1", 47 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 31 => "n d #1", 34 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "Rest parameters",
ucprefix => 0,
},
"rtcpeerconnection" => {
categories => ["JS API"],
chrome_id => 6612462929444864,
description => "Method of allowing two users to communicate directly, browser to browser using the RTCPeerConnection API.",
keywords => "webrtc,foo",
links => [
{ title => "WebRTC Project site", url => "https://webrtc.org/" },
{
title => "Plug-in for support in IE & Safari",
url => "https://temasys.atlassian.net/wiki/display/TWPP/WebRTC+Plugins",
},
{
title => "Introducing WebRTC 1.0 and interoperable real-time communications in Microsoft Edge",
url => "https://blogs.windows.com/msedgedev/2017/01/31/introducing-webrtc-microsoft-edge/",
},
],
notes => "The legacy Edge browser also offers a compatible implementation known as [ObjectRTC](http://blogs.msdn.com/b/ie/archive/2014/10/27/bringing-interoperable-real-time-communications-to-the-web.aspx). See [Object RTC](https://caniuse.com/#feat=objectrtc) for support details for that API.",
notes_by_num => {
1 => "BlackBerry 10 recognizes RTCPeerConnection but real support is unconfirmed.",
2 => "Edge does not support RTCDataChannel. See [API Catalogue](https://web.archive.org/web/20190327013248/https://developer.microsoft.com/en-us/microsoft-edge/platform/catalog/?q=specName%3Awebrtc)",
},
spec => "https://w3c.github.io/webrtc-pc/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "n #1" },
chrome => { 4 => "n", 23 => "y x", 56 => "y" },
edge => { "5.5" => "n", "15" => "a #2", "79" => "y" },
firefox => { 2 => "n", 22 => "y x", 44 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 18 => "y x", 43 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { "4" => "y x", "6.2-6.4" => "y" },
},
status => "wd",
title => "WebRTC Peer-to-peer connections",
ucprefix => 0,
},
"ruby" => {
categories => ["HTML5"],
description => "Method of adding pronunciation or other annotations using ruby elements (primarily used in East Asian typography).",
keywords => "ruby-base,ruby-text,ruby-position,ruby-merge,ruby-align",
links => [
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/ruby-rt-rp-element/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/ruby",
},
{
title => "CSS specification",
url => "https://www.w3.org/TR/css-ruby-1/",
},
],
notes => "Browsers without native support can still simulate support using CSS. Partial support refers to only supporting basic ruby, may still be missing writing-mode, Complex ruby and CSS3 Ruby.",
notes_by_num => {
1 => "IE9+ supports [properties](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference) of an older version of the CSS Ruby specification.",
},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#the-ruby-element",
stats => {
and_chr => { "2.1" => "p", "3" => "a" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a" },
and_uc => { "15.5" => "a" },
baidu => { "13.52" => "a" },
bb => { 7 => "p", 10 => "a" },
chrome => { 4 => "p", 5 => "a" },
edge => { "5.5" => "a", "9" => "a #1", "12" => "a" },
firefox => { 2 => "p", 38 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "p", "5.0-5.1" => "a" },
kaios => { "2.5" => "y" },
op_mini => { all => "p" },
op_mob => { 10 => "p", 80 => "a" },
opera => { 9 => "p", 15 => "a" },
safari => { "3.1" => "p", "5" => "a" },
samsung => { 4 => "a" },
},
status => "ls",
title => "Ruby annotation",
ucprefix => 0,
},
"run-in" => {
categories => ["CSS", "CSS2"],
description => "If the run-in box contains a block box, same as block. If a block box follows the run-in box, the run-in box becomes the first inline box of the block box. If an inline box follows, the run-in box becomes a block box.",
keywords => "display,run-in",
links => [
{
title => "Mozilla bug report",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=2056",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/run-in/",
},
],
notes_by_num => { 1 => "Not before inline-elements" },
spec => "https://w3c.github.io/csswg-drafts/css-display-3/#valdef-display-run-in",
stats => {
and_chr => { "2.1" => "y", "4.4.3-4.4.4" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "y" },
chrome => { 4 => "y", 32 => "n" },
edge => { "5.5" => "n", "8" => "y", "12" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y #1", "4.0-4.1" => "y", "8" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "y" },
op_mob => { 10 => "y", 80 => "n" },
opera => { 9 => "y", 19 => "n" },
safari => { "3.1" => "y #1", "5" => "y", "6.1" => "u", "7" => "n" },
samsung => { 4 => "n" },
},
status => "cr",
title => "display: run-in",
ucprefix => 0,
},
"same-site-cookie-attribute" => {
categories => ["Security"],
chrome_id => "4672634709082112,5088147346030592,5633521622188032",
description => "Same-site cookies (\"First-Party-Only\" or \"First-Party\") allow servers to mitigate the risk of CSRF and information leakage attacks by asserting that a particular cookie should only be sent with requests initiated from the same registrable domain.",
keywords => "security,cookies,cookie,csrf",
links => [
{
title => "Preventing CSRF with the same-site cookie attribute",
url => "https://www.sjoerdlangkemper.nl/2016/04/14/preventing-csrf-with-samesite-cookie-attribute/",
},
{
title => "Mozilla Bug #795346: Add SameSite support for cookies",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=795346",
},
{
title => "Mozilla Bug #1286861, includes the patches that landed SameSite support in Firefox",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1286861",
},
{
title => "Microsoft Edge Browser Status",
url => "https://developer.microsoft.com/en-us/microsoft-edge/status/samesitecookies/",
},
{
title => "MS Edge dev blog: \"Previewing support for same-site cookies in Microsoft Edge\"",
url => "https://blogs.windows.com/msedgedev/2018/05/17/samesite-cookies-microsoft-edge-internet-explorer/",
},
{
title => "Mozilla Bug #1551798: Prototype SameSite=Lax by default",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1551798",
},
{
title => "Same-site cookies demonstration by Rowan Merewood",
url => "https://peaceful-wing.glitch.me",
},
],
notes => "This feature is backwards compatible. Browsers not supporting this feature will simply use the cookie as a regular cookie. There is no need to deliver different cookies to clients.",
notes_by_num => {
1 => "Not shipped with the initial release but later with the 2018 June security update (Patch Tuesday) to Windows 10 RS3 (2017 Fall Creators Update) and newer. [More info](https://github.com/MicrosoftEdge/Status/issues/616).",
2 => "Partial support because only supported in IE 11 on Windows 10 RS3 (2017 Fall Creators Update) and newer, but not in IE 11 on other Windows versions (Windows 7, ...)",
3 => "Cookies without `SameSite` are treated as `Lax` by default, `SameSite=None` cookies without `Secure` are rejected.",
4 => "Partial due to the lack of support in macOS before 10.14 Mojave.",
5 => "Partial due to [the bug](https://bugs.webkit.org/show_bug.cgi?id=198181) that treats `SameSite=None` and invalid values as `Strict` in macOS before 10.15 Catalina and in iOS before 13.",
},
spec => "https://tools.ietf.org/html/draft-ietf-httpbis-rfc6265bis-07",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "y #3" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "y", 80 => "y #3" },
edge => {
"5.5" => "n",
"11" => "a #1 #2",
"12" => "n",
"16" => "y #1",
"18" => "y",
"86" => "y #3",
},
firefox => { 2 => "n", 60 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "a #5", "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #3" },
opera => { 9 => "n", 39 => "y", 71 => "y #3" },
safari => { "3.1" => "n", "12" => "a #4 #5", "14" => "a #5", "15" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "'SameSite' cookie attribute",
ucprefix => 0,
},
"screen-orientation" => {
categories => ["JS API"],
chrome_id => 6191285283061760,
description => "Provides the ability to read the screen orientation state, to be informed when this state changes, and to be able to lock the screen orientation to a specific state.",
keywords => "lockorientation,unlockorientation",
links => [
{
title => "Demo",
url => "https://www.audero.it/demo/screen-orientation-api-demo.html",
},
{
title => "MDN Web Docs - Screen Orientation",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Screen.orientation",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/introducing-screen-orientation-api/",
},
],
notes => "Partial support refers to an [older version](https://www.w3.org/TR/2014/WD-screen-orientation-20140220/) of the draft specification, and the spec has undergone significant changes since, for example renaming the `screen.lockOrientation` method to `screen.orientation.lock`.",
notes_by_num => { 1 => "Not supported on Windows 7." },
spec => "https://www.w3.org/TR/screen-orientation/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 38 => "y" },
edge => { "5.5" => "n", "11" => "a x #1", "12" => "a x", "79" => "y" },
firefox => { 2 => "n", 18 => "a x", 44 => "y" },
ie_mob => { 10 => "n", 11 => "a x" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 25 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { "4" => "u", "5.0-5.4" => "y" },
},
status => "wd",
title => "Screen Orientation",
ucprefix => 0,
},
"script-async" => {
categories => ["DOM", "HTML5"],
description => "The boolean async attribute on script elements allows the external JavaScript file to run when it's available, without delaying page load first.",
links => [
{
title => "MDN Web Docs - Script attributes",
url => "https://developer.mozilla.org/en/HTML/Element/script#Attributes",
},
{
title => "Demo",
url => "https://testdrive-archive.azurewebsites.net/Performance/AsyncScripts/Default.html",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/script.js#script-async",
},
{
title => "async vs defer attributes",
url => "https://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html",
},
],
notes_by_num => {
1 => "Using script.async = false; to maintain execution order for dynamically-added scripts isn't supported in Safari 5.0",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#attr-script-async",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 8 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "a #1", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "async attribute for external scripts",
ucprefix => 0,
},
"script-defer" => {
categories => ["DOM", "HTML5"],
description => "The boolean defer attribute on script elements allows the external JavaScript file to run when the DOM is loaded, without delaying page load first.",
links => [
{
title => "MDN Web Docs - Script Attributes",
url => "https://developer.mozilla.org/en/HTML/Element/script#Attributes",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/script.js#script-defer",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/attributes/defer",
},
{
title => "async vs defer attributes",
url => "https://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html",
},
],
notes_by_num => {
1 => "Partial support in older IE refers to a buggy implementation (see issue).",
2 => "Deferred scripts may run after DOMContentLoaded - https://bugzilla.mozilla.org/show_bug.cgi?id=688580",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#attr-script-defer",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 8 => "y" },
edge => { "5.5" => "a #1", "10" => "y" },
firefox => { "2" => "n", "3.5" => "y #2", "31" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "5" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "defer attribute for external scripts",
ucprefix => 0,
},
"scrollintoview" => {
categories => ["DOM", "JS API"],
description => "The `Element.scrollIntoView()` method scrolls the current element into the visible area of the browser window. Parameters can be provided to set the position inside the visible area as well as whether scrolling should be instant or smooth.",
links => [
{
title => "MDN Web Docs - scrollIntoView",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView",
},
{
title => "smooth scroll polyfill : polyfill for smooth behavior option",
url => "http://iamdustan.com/smoothscroll/",
},
],
notes_by_num => {
1 => "Supports scrollIntoView with boolean parameter, but not `smooth` behavior option",
},
spec => "https://w3c.github.io/csswg-drafts/cssom-view/#dom-element-scrollintoview",
stats => {
and_chr => { "2.1" => "u", "2.3" => "a #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 61 => "y" },
edge => { "5.5" => "n", "8" => "a #1", "79" => "y" },
firefox => { 2 => "a #1", 36 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "16.0" => "y", "3.2" => "u", "5.0-5.1" => "a #1" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "a #1", 80 => "y" },
opera => { "9" => "n", "11" => "u", "11.6" => "a #1", "48" => "y" },
safari => { "3.1" => "n", "5.1" => "a #1", "16.0" => "y" },
samsung => { "4" => "a #1", "8.2" => "y" },
},
status => "wd",
title => "scrollIntoView",
ucprefix => 0,
},
"scrollintoviewifneeded" => {
categories => ["DOM", "JS API"],
description => "If the element is fully within the visible area of the viewport, it does nothing. Otherwise, the element is scrolled into view. A proprietary variant of the standard `Element.scrollIntoView()` method.",
keywords => "scrollIntoViewIfNeeded,scroll",
links => [
{
title => "Mozilla Bug 403510 - Implement scrollIntoViewIfNeeded",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=403510",
},
{
title => "W3C CSSOM View bug #17152: Support centering an element when scrolling into view.",
url => "https://www.w3.org/Bugs/Public/show_bug.cgi?id=17152",
},
],
notes_by_num => {},
spec => "https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoViewIfNeeded",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "Element.scrollIntoViewIfNeeded()",
ucprefix => 0,
},
"sdch" => {
categories => ["Other"],
description => "Shared Dictionary Compression over HTTP",
keywords => "http,compression,accept,content,encoding,sdch",
links => [
{
title => "SDCH Google Group",
url => "https://groups.google.com/forum/#!forum/sdch",
},
{
title => "Bugzilla Bug 641069 - Implement SDCH",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=641069",
},
{
title => "Wikipedia - SDCH",
url => "https://en.wikipedia.org/wiki/SDCH",
},
{
title => "Shared Dictionary Compression for HTTP at LinkedIn.",
url => "https://engineering.linkedin.com/shared-dictionary-compression-http-linkedin",
},
],
notes_by_num => {},
spec => "https://docs.google.com/viewer?a=v&pid=forums&srcid=MDIwOTgxNDMwMTgyMjkzMTI2ODcBMDQ2MzU5NDU2MDA0MTg5NDE1MTkBTDZmaENoSG9BZ0FKATAuMQEBdjI",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "y", 59 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 15 => "y", 73 => "n" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "other",
title => "SDCH Accept-Encoding/Content-Encoding",
ucprefix => 0,
},
"selection-api" => {
categories => ["JS API"],
description => "API for accessing selected content of a document, including the `window.getSelection()` method, as well as the `selectstart` & `selectionchange` events on `document`.",
links => [
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1231923",
},
],
notes => "See also support for the related [DOM range](https://caniuse.com/dom-range) ",
notes_by_num => {
1 => "Supports `window.getSelection()` but no selection events",
2 => "Supports selection events, but not `window.getSelection()`",
3 => "Does not support the `selectstart` event",
4 => "`window.getSelection()` may fail on tapping buttons, as the selection is lost right before the listener code runs.",
5 => "Selection events are supported behind the `dom.select_events.enabled` flag",
},
spec => "https://www.w3.org/TR/selection-api/",
stats => {
and_chr => { "2.1" => "u", "4.2-4.3" => "y #4", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u", 10 => "y" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "u", "6" => "a #2", "9" => "y" },
firefox => { 2 => "a #1", 43 => "a #1 #5", 52 => "y" },
ie_mob => { 10 => "u", 11 => "y" },
ios_saf => { "3.2" => "a #1", "4.2-4.3" => "u", "5.0-5.1" => "a #3" },
kaios => { "2.5" => "a #1 #5", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "u", "12.1" => "a #1", "80" => "y" },
opera => { 9 => "a #1", 15 => "y" },
safari => { "3.1" => "u", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "Selection API",
ucprefix => 0,
},
"selectlist" => {
categories => ["HTML5"],
chrome_id => 5737365999976448,
description => "Proposal for a customizable `<select>` element. Previously envisioned as a separate element (`<selectlist>` or `<selectmenu>`). ",
keywords => "selectlist,selectmenu,appearance:base-select,::picker(select),selectedoption",
links => [
{
title => "Blog post: Two levels of customising <selectlist>",
url => "https://hidde.blog/custom-select-with-selectlist/",
},
{
title => "Open UI's <selectlist> demos",
url => "https://microsoftedge.github.io/Demos/selectlist/index.html",
},
{
title => "Chrome's request for feedback on latest proposal",
url => "https://developer.chrome.com/blog/rfc-customizable-select",
},
],
notes_by_num => {
1 => "Available behind the \"Experimental Web Platform features\" flag. Implemented as `selectmenu` before Chromium 119.",
},
spec => "https://open-ui.org/components/customizableselect/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 97 => "n d #1" },
edge => { "5.5" => "n", "97" => "n d #1" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "n d #1" },
opera => { 9 => "n", 83 => "n d #1" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Customizable Select element",
ucprefix => 0,
},
"server-timing" => {
categories => ["JS API"],
chrome_id => 5695708376072192,
description => "Mechanism for web developers to annotate network requests with server timing information.",
keywords => "performance,performance.timing,resource,performancenavigation,PerformanceServerTiming",
links => [
{ title => "Demo", url => "https://server-timing.netlify.com/" },
{
title => "Blog post",
url => "https://developer.akamai.com/blog/2017/06/07/completing-performance-analysis-server-timing/",
},
{
title => "MDN article on PerformanceServerTiming",
url => "https://developer.mozilla.org/en-US/docs/Web/API/PerformanceServerTiming",
},
],
notes_by_num => {
1 => "Chrome v60-63: An older version of the API is behind the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag.",
2 => "Chrome v64: The current API is behind the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag.",
3 => "Safari v12.1+: Supports the Server Timing reporting in the Web Inspector Network tab, but not the JavaScript API",
},
spec => "https://www.w3.org/TR/server-timing/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 60 => "a d #1", 64 => "a d #2", 65 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 61 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 52 => "y" },
safari => { "3.1" => "n", "12.1" => "a #3", "16.4" => "y" },
samsung => { 4 => "n" },
},
status => "wd",
title => "Server Timing",
ucprefix => 0,
},
"serviceworkers" => {
categories => ["JS API"],
chrome_id => 6561526227927040,
description => "Method that enables applications to take advantage of persistent background processing, including hooks to enable bootstrapping of web applications while offline.",
links => [
{
title => "HTML5Rocks article (introduction)",
url => "https://www.html5rocks.com/en/tutorials/service-worker/introduction/",
},
{
title => "MDN Web Docs - Service Workers",
url => "https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker_API",
},
{
title => "List of various resources",
url => "https://jakearchibald.github.io/isserviceworkerready/resources.html",
},
],
notes => "Details on partial support can be found on [is ServiceWorker Ready?](https://jakearchibald.github.io/isserviceworkerready/)",
notes_by_num => {
1 => "Partial support can be enabled in Firefox with the `dom.serviceWorkers.enabled` flag.",
2 => "Available behind the \"Enable service workers\" flag",
3 => "Disabled on Firefox ESR, but can be re-enabled with the `dom.serviceWorkers.enabled` flag",
},
spec => "https://w3c.github.io/ServiceWorker/",
stats => {
and_chr => { "2.1" => "n", "135" => "a" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 40 => "a", 45 => "y" },
edge => { "5.5" => "n", "15" => "n d #2", "17" => "y" },
firefox => {
2 => "n",
33 => "n d #1",
44 => "y",
45 => "y #3",
46 => "y",
52 => "y #3",
53 => "y",
60 => "y #3",
61 => "y",
68 => "y #3",
69 => "y",
},
ie_mob => { 10 => "n" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 27 => "a", 32 => "y" },
safari => { "3.1" => "n", "11.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Service Workers",
ucprefix => 0,
},
"setimmediate" => {
categories => ["JS API"],
description => "Yields control flow without the minimum delays enforced by setTimeout",
keywords => "setImmediate,clearImmediate,setTimeout,performance",
links => [
{
title => "The case for setImmediate()",
url => "https://humanwhocodes.com/blog/2013/07/09/the-case-for-setimmediate/",
},
{
title => "Script yielding with setImmediate",
url => "https://humanwhocodes.com/blog/2011/09/19/script-yielding-with-setimmediate/",
},
{
title => "setImmediate polyfill",
url => "https://github.com/YuzuJS/setImmediate",
},
{
title => "Firefox tracking bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=686201",
},
{
title => "Chrome bug closed as WONTFIX",
url => "https://code.google.com/p/chromium/issues/detail?id=146172",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#setimmediate",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/setImmediate/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n", "10" => "y", "79" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Efficient Script Yielding: setImmediate()",
ucprefix => 0,
},
"shadowdom" => {
categories => ["DOM"],
chrome_id => 4507242028072960,
description => "Original V0 version of the Shadow DOM specification. See [Shadow DOM V1](#feat=shadowdomv1) for support for the latest version. ",
links => [
{
title => "HTML5Rocks - Shadow DOM 101 article",
url => "https://www.html5rocks.com/tutorials/webcomponents/shadowdom/",
},
{
title => "Safari implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=148695",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1205323",
},
{
title => "Google Developers - Shadow DOM v1: self-contained web components",
url => "https://developers.google.com/web/fundamentals/getting-started/primers/shadowdom",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/shadow-dom/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y x", "135" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 25 => "y x", 35 => "y", 80 => "n" },
edge => { "5.5" => "n", "79" => "y", "80" => "n" },
firefox => { 2 => "n", 29 => "n d", 61 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 15 => "y x", 22 => "y", 67 => "n" },
safari => { "3.1" => "n" },
samsung => { "13.0" => "n", "4" => "y x", "5.0-5.4" => "y" },
},
status => "unoff",
title => "Shadow DOM (deprecated V0 spec)",
ucprefix => 0,
},
"shadowdomv1" => {
categories => ["DOM"],
chrome_id => 4667415417847808,
description => "Method of establishing and maintaining functional boundaries between DOM trees and how these trees interact with each other within a document, thus enabling better functional encapsulation within the DOM & CSS.",
keywords => "webcomponents,shadow dom,attachShadow",
links => [
{
title => "Safari implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=148695",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1205323",
},
{
title => "Google Developers - Shadow DOM v1: self-contained web components",
url => "https://developers.google.com/web/fundamentals/primers/shadowdom/?hl=en",
},
],
notes_by_num => {
1 => "Certain CSS selectors do not work (`:host > .local-child`) and styling slotted content (`::slotted`) is buggy.",
2 => "Enabled through the `dom.webcomponents.enabled` preference in `about:config`.",
3 => "Enabled through the `dom.webcomponents.shadowdom.enabled` preference in `about:config`.",
},
spec => "https://www.w3.org/TR/shadow-dom/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 53 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 58 => "n d #2", 59 => "n d #3", 63 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "a #1", "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 40 => "y" },
safari => { "3.1" => "n", "10" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "a", "6.2-6.4" => "y" },
},
status => "wd",
title => "Shadow DOM (V1)",
ucprefix => 0,
},
"sharedarraybuffer" => {
categories => ["JS"],
chrome_id => "4570991992766464,5171863141482496",
description => "Type of ArrayBuffer that can be shared across Workers.",
links => [
{
title => "MDN article",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer",
},
{
title => "Mozilla Hacks article on safely reviving shared memory",
url => "https://hacks.mozilla.org/2020/07/safely-reviving-shared-memory/",
},
],
notes_by_num => {
1 => "Has support, but was disabled across browsers in January 2018 due to Spectre & Meltdown vulnerabilities.",
2 => "Enabled by default in Nightly, but not in Beta/Developer/Release.",
3 => "Requires cross-origin isolation by having [Cross-Origin-Embedder-Policy (COEP)](/mdn-http_headers_cross-origin-embedder-policy) and [Cross-Origin-Opener-Policy (COOP)](/mdn-http_headers_cross-origin-opener-policy) headers set. [Mozilla Hacks article](https://hacks.mozilla.org/2020/07/safely-reviving-shared-memory/) for context.",
},
spec => "https://tc39.es/ecma262/#sec-sharedarraybuffer-objects",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y #3" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y #3" },
bb => { 7 => "n" },
chrome => { 4 => "n", 60 => "n d #1", 68 => "y", 91 => "y #3" },
edge => { "5.5" => "n", "16" => "n d #1", "79" => "y", "91" => "y #3" },
firefox => { 2 => "n", 57 => "n d #1", 74 => "n d #1 #2", 79 => "y #3" },
ie_mob => { 10 => "n" },
ios_saf => { "10.3" => "n d #1", "15.2-15.3" => "y #3", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y #3" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #3" },
opera => { 9 => "n", 47 => "n d #1", 64 => "y", 78 => "y #3" },
safari => { "10.1" => "n d #1", "15.2-15.3" => "y #3", "3.1" => "n" },
samsung => { "4" => "n", "15.0" => "y #3" },
},
status => "other",
title => "Shared Array Buffer",
ucprefix => 0,
},
"sharedworkers" => {
categories => ["JS API"],
description => "Method of allowing multiple scripts to communicate with a single web worker.",
keywords => "shared worker",
links => [
{
title => "Sitepoint article",
url => "https://www.sitepoint.com/javascript-shared-web-workers-html5/",
},
{
title => "Blog post",
url => "https://greenido.wordpress.com/2011/11/03/web-workers-part-3-out-of-3-shared-wrokers/",
},
],
notes_by_num => {},
parent => "webworkers",
spec => "https://html.spec.whatwg.org/multipage/workers.html#shared-workers-introduction",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 29 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "16.0" => "y", "3.2" => "n", "5.0-5.1" => "y", "7.0-7.1" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "u", 11 => "y", 80 => "n" },
opera => { "9" => "n", "10.6" => "y" },
safari => { "3.1" => "n", "5" => "y", "6.1" => "n", "16.0" => "y" },
samsung => { "4" => "y", "5.0-5.4" => "n" },
},
status => "ls",
title => "Shared Web Workers",
ucprefix => 0,
},
"sni" => {
categories => ["Security"],
description => "An extension to the TLS computer networking protocol by which a client indicates which hostname it is attempting to connect to at the start of the handshaking process.",
keywords => "sni",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/Server_Name_Indication",
},
],
notes_by_num => {
1 => "Only supported on Windows Vista or above (not Windows XP)",
},
spec => "https://tools.ietf.org/html/rfc6066",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 6 => "y" },
edge => { "5.5" => "n", "7" => "a #1", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Server Name Indication",
ucprefix => 0,
},
"spdy" => {
categories => ["Other"],
chrome_id => 5152586365665280,
description => "Networking protocol for low-latency transport of content over the web. Superseded by HTTP version 2.",
links => [
{ title => "Wikipedia", url => "https://en.wikipedia.org/wiki/HTTP/2" },
{
title => "SPDY whitepaper",
url => "https://dev.chromium.org/spdy/spdy-whitepaper",
},
],
notes => "See also support for [HTTP2](https://caniuse.com/#feat=http2), successor of SPDY.",
notes_by_num => {
1 => "Deprecated as of macOS Mojave 10.4.4. To be completely removed in a future version of macOS.",
2 => "Deprecated as of iOS 12.2. To be completely removed in a future version of iOS.",
},
spec => "https://www.chromium.org/spdy/",
stats => {
and_chr => { "2.1" => "n", "3" => "y", "135" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "y", 51 => "n" },
edge => { "5.5" => "n", "11" => "y", "12" => "n" },
firefox => { 2 => "n", 13 => "y", 51 => "n" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "12.2-12.5" => "y #2", "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "12.1" => "y", "80" => "n" },
opera => {
"9" => "n",
"12.1" => "y",
"40" => "n",
"42" => "y",
"43" => "n",
"44" => "y",
"45" => "n",
},
safari => { "3.1" => "n", "8" => "y", "12.1" => "y #1" },
samsung => { "4" => "y", "5.0-5.4" => "n" },
},
status => "unoff",
title => "SPDY protocol",
ucprefix => 0,
},
"speech-recognition" => {
categories => ["JS API"],
chrome_id => 5908775487668224,
description => "Method to provide speech input in a web browser.",
keywords => "#web-speech,speechrecognition,ASR",
links => [
{
title => "HTML5Rocks article",
url => "https://developer.chrome.com/blog/voice-driven-web-apps-introduction-to-the-web-speech-api/",
},
{
title => "SitePoint article",
url => "https://www.sitepoint.com/introducing-web-speech-api/",
},
{
title => "Demo",
url => "https://www.audero.it/demo/web-speech-api-demo.html",
},
{
title => "Advanced demo and resource",
url => "https://zenorocha.github.io/voice-elements/#recognition-element",
},
{
title => "Chromium bug to unprefix the Speech Recognition API",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=570968",
},
],
notes_by_num => {
1 => "Partial support refers to some attributes missing.",
2 => "Firefox currently has a `media.webspeech.recognition.enable` flag in about:config for this, but actual support is waiting for permissions to be sorted out.",
3 => "Edge and Opera appear to have support for the `SpeechRecognition` API but no events for it appear to fire.",
4 => "Safari 14.1 and TP 119+ include prefixed support for `webkitSpeechRecognition` without support for `SpeechGrammar` or `SpeechGrammarList`. Siri needs to be enabled. [Not available in SafariViewController and web apps added to Home Screen](https://bugs.webkit.org/show_bug.cgi?id=225298#c3).",
},
spec => "https://w3c.github.io/speech-api/speechapi.html#speechreco-section",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "a x #1" },
and_uc => { "15.5" => "a x #1" },
baidu => { "13.52" => "a x #1" },
bb => { 7 => "n" },
chrome => { 4 => "n", 25 => "a x #1" },
edge => { "5.5" => "n", "79" => "n #3" },
firefox => { 2 => "n", 22 => "n d #2" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "a x #4", "3.2" => "n" },
kaios => { "2.5" => "n d #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a x #1" },
opera => { 9 => "n", 27 => "n #3" },
safari => { "3.1" => "n", "14.1" => "a x #4" },
samsung => { 4 => "a x #1" },
},
status => "unoff",
title => "Speech Recognition API",
ucprefix => 0,
},
"speech-synthesis" => {
categories => ["JS API"],
chrome_id => 4782875580825600,
description => "A web API for controlling a text-to-speech output.",
keywords => "speech,synthesis,speechSynthesis,TTS,SpeechSynthesisUtterance,",
links => [
{
title => "SitePoint article",
url => "https://www.sitepoint.com/talking-web-pages-and-the-speech-synthesis-api/",
},
{
title => "Demo",
url => "https://www.audero.it/demo/speech-synthesis-api-demo.html",
},
{
title => "Advanced demo and resource",
url => "https://zenorocha.github.io/voice-elements/",
},
{
title => "MDN article",
url => "https://developer.mozilla.org//docs/Web/API/SpeechSynthesis",
},
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2014/01/Web-apps-that-talk-Introduction-to-the-Speech-Synthesis-API",
},
],
notes => "Samsung Internet for GearVR: In Development, release based on Chromium m53 due Q1/2017",
notes_by_num => {
1 => "Can be enabled in Firefox using the `media.webspeech.synth.enabled` about:config flag.",
2 => "Speech Synthesis in Chrome since version 55 stops playback after about 15 seconds on Windows 7 & 10, and Ubuntu 14.04, possibly other platforms",
},
parent => "web-speech",
spec => "https://w3c.github.io/speech-api/speechapi.html#tts-section",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 33 => "y", 55 => "y #2" },
edge => { "5.5" => "n", "14" => "y", "79" => "y #2" },
firefox => { 2 => "n", 31 => "n d #1", 49 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 27 => "y", 64 => "y #2" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "unoff",
title => "Speech Synthesis API",
ucprefix => 0,
},
"spellcheck-attribute" => {
categories => ["HTML5"],
description => "Attribute for `input`/`textarea` fields to enable/disable the browser's spellchecker.",
keywords => "spelling",
links => [
{
title => "MDN Web Docs - Controlling spell checking",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Controlling_spell_checking_in_HTML_formsControlling_spell_checking_in_HTML_forms",
},
],
notes => "The partial support in mobile browsers results from their OS generally having built-in spell checking instead of using the wavy underline to indicate misspelled words. `spellcheck=\"false\"` does not seem to have any effect in these browsers.\r\n\r\nBrowsers have different behavior in how they deal with spellchecking in combination with the `lang` attribute. Generally spelling is based on the browser's language, not the language of the document.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/interaction.html#spelling-and-grammar-checking",
stats => {
and_chr => { "2.1" => "a" },
and_ff => { 137 => "a" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "a" },
baidu => { "13.52" => "a" },
bb => { 7 => "a", 10 => "y" },
chrome => { 4 => "n", 9 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "a" },
ios_saf => { "3.2" => "a" },
kaios => { "2.5" => "n" },
op_mini => { all => "a" },
op_mob => { 10 => "a" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "n", "5.1" => "y" },
samsung => { 4 => "a" },
},
status => "ls",
title => "Spellcheck attribute",
ucprefix => 0,
},
"sql-storage" => {
categories => ["JS API"],
chrome_id => 6330987952734208,
description => "Method of storing data client-side, allows SQLite database queries for access and manipulation.",
keywords => "db-storage,websql",
links => [
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/introducing-web-sql-databases/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-sql-db",
},
{
title => "Chrome platform status: Deprecate and remove WebSQL in non-secure contexts",
url => "https://chromestatus.com/feature/5175124599767040",
},
],
notes => "The Web SQL Database specification is no longer being maintained and support is intended to be dropped in future versions. Migrate to e.g. [Web Storage](/namevalue-storage) or [IndexedDB](/?search=IndexedDB).",
notes_by_num => {
1 => "Not available in third-party contexts",
2 => "Requires a [secure context](https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts)",
3 => "Requires a deprecation Origin Trial token",
},
spec => "https://www.w3.org/TR/webdatabase/",
stats => {
and_chr => { "2.1" => "y", "135" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y", 101 => "y #1", 110 => "y #1 #2", 119 => "y #1 #2 #3", 124 => "n" },
edge => { "5.5" => "n", "79" => "y", "101" => "y #1", "110" => "y #1 #2", "124" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "13.0-13.1" => "n", "3.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y", 80 => "y #2" },
opera => { "9" => "n", "10.5" => "y", "91" => "y #2", "110" => "n" },
safari => { "3.1" => "y", "13" => "n" },
samsung => { 4 => "y" },
},
status => "unoff",
title => "Web SQL Database",
ucprefix => 0,
},
"srcset" => {
categories => ["HTML5"],
chrome_id => 4644337115725824,
description => "The `srcset` and `sizes` attributes on `img` (or `source`) elements allow authors to define various image resources and \"hints\" that assist a user agent to determine the most appropriate image source to display (e.g. high-resolution displays, small monitors, etc).",
keywords => "srcset attribute",
links => [
{
title => "Improved support for high-resolution displays with the srcset image attribute",
url => "https://www.webkit.org/blog/2910/improved-support-for-high-resolution-displays-with-the-srcset-image-attribute/",
},
{
title => "Blog post on srcset & sizes",
url => "https://ericportis.com/posts/2014/srcset-sizes/",
},
{
title => "MDN: Responsive images",
url => "https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images",
},
{
title => "MDN: <img> element",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img",
},
],
notes_by_num => {
1 => "Can be enabled in Firefox by setting the about:config preference dom.image.srcset.enabled to true",
2 => "Supports the subset of the syntax for resolution switching (using the `x` descriptor), but not the full syntax that can be used with `sizes` (using the `w` descriptor).",
3 => "Intermittently displays distorted images due to bug present (see known issues)",
4 => "Does not support min/max expressions.",
5 => "For JavaScript-generated img elements, loads src first, even if srcset will also make it load another image (see known issues)",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#attr-img-srcset",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 34 => "a #2", 38 => "y" },
edge => { "5.5" => "n", "12" => "a #2", "13" => "n #3", "16" => "y" },
firefox => { 2 => "n", 32 => "n d #1", 38 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "a #2", "9.0-9.2" => "a #4" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 21 => "a #2", 25 => "y" },
safari => { "3.1" => "n", "7.1" => "a #2", "9" => "a #4", "11" => "a #4 #5" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Srcset and sizes attributes",
ucprefix => 0,
},
"stream" => {
categories => ["JS API"],
chrome_id => "6067380039974912,6605041225957376",
description => "Method of accessing external device data (such as a webcam video stream). Formerly this was envisioned as the <device> element.",
keywords => "camera,device,getUserMedia,media stream,mediastream,Media Capture API",
links => [
{
title => "Technology preview from Opera",
url => "https://dev.opera.com/blog/webcam-orientation-preview/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/dom/Navigator/getUserMedia",
},
{
title => "Media Capture functionality in Microsoft Edge",
url => "https://blogs.windows.com/msedgedev/2015/05/13/announcing-media-capture-functionality-in-microsoft-edge/",
},
{
title => "getUserMedia in PWA with manifest on iOS 11",
url => "https://stackoverflow.com/questions/50800696/getusermedia-in-pwa-with-manifest-on-ios-11",
},
{
title => "getUserMedia working again in PWA on iOS 13.4",
url => "https://bugs.webkit.org/show_bug.cgi?id=185448#c84",
},
],
notes => "As of Chrome 47, the getUserMedia API cannot be called from insecure origins.",
notes_by_num => {
1 => "Blink-based (and some other) browsers support an older version of the spec that does not use `srcObject`. [See Chromium issue 387740](https://code.google.com/p/chromium/issues/detail?id=387740).",
2 => "Supports the older spec's `navigator.getUserMedia` API, not the newer `navigator.mediaDevices.getUserMedia` one.",
3 => "Before iOS 14.3 `getUserMedia` returned no video input devices in `UIWebView` or `WKWebView`, but only directly in Safari.",
4 => "Does not work in standalone running (\"installed\") PWAs.",
},
spec => "https://www.w3.org/TR/mediacapture-streams/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "a x #1 #2" },
chrome => { 4 => "n", 21 => "a x #1 #2", 53 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 17 => "a x #1 #2", 36 => "y #1", 42 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y #3 #4", "13.4-13.7" => "y #3", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 12 => "a x #1 #2", 80 => "y" },
opera => { 9 => "n", 12 => "a x #1 #2", 15 => "n", 18 => "a x #1 #2", 40 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { "4" => "a x #1 #2", "6.2-6.4" => "y" },
},
status => "cr",
title => "getUserMedia/Stream API",
ucprefix => 0,
},
"streams" => {
categories => ["JS API"],
chrome_id => 6605041225957376,
description => "Method of creating, composing, and consuming streams of data, that map efficiently to low-level I/O primitives, and allow easy composition with built-in backpressure and queuing.",
keywords => "streams,writablestream,readablestream",
links => [
{
title => "GitHub repository",
url => "https://github.com/whatwg/streams",
},
{
title => "ReadableStream on Mozilla Developer Network",
url => "https://developer.mozilla.org/en/docs/Web/API/ReadableStream",
},
{
title => "Blog article about streams",
url => "https://jakearchibald.com/2016/streams-ftw/",
},
],
notes_by_num => {
1 => "IE implements a different API than the one from WHATWG.",
2 => "Only basic read support.",
3 => "Disabled by default behind the `javascript.options.streams` and `dom.streams.enabled` flags. ",
4 => "No support for BYOB (\"bring your own buffer\") stream readers.",
5 => "No support for `WritableStream`.",
6 => "No support for the `pipeTo` or `pipeThrough` methods",
},
spec => "https://streams.spec.whatwg.org/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #4" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 52 => "a #2", 59 => "a #4", 89 => "y" },
edge => {
"5.5" => "n",
"11" => "n #1",
"12" => "u",
"14" => "a #2",
"16" => "a #4 #6",
"79" => "a #4",
"89" => "y",
},
firefox => {
2 => "n",
57 => "n d #3 #4 #5 #6",
65 => "a #4 #5 #6",
100 => "a #4 #6",
102 => "y",
},
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "u", "10.3" => "a #4", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 39 => "a #2", 46 => "a #4", 76 => "y" },
safari => { "3.1" => "n", "10" => "a #4 #5", "14.1" => "a #4" },
samsung => { "15.0" => "y", "4" => "n", "7.2-7.4" => "a #4" },
},
status => "ls",
title => "Streams",
ucprefix => 0,
},
"stricttransportsecurity" => {
categories => ["Security"],
chrome_id => 4941480133132288,
description => "Declare that a website is only accessible over a secure connection (HTTPS).",
keywords => "sts,hsts,security,header",
links => [
{
title => "Chromium article",
url => "https://www.chromium.org/hsts/",
},
{
title => "MDN Web Docs - Strict Transport Security",
url => "https://developer.mozilla.org/en-US/docs/Security/HTTP_Strict_Transport_Security",
},
{
title => "OWASP article",
url => "https://www.owasp.org/index.php/HTTP_Strict_Transport_Security",
},
],
notes => "The HTTP header is 'Strict-Transport-Security'.",
notes_by_num => {
1 => "IE 11 added support [in an update](https://blogs.windows.com/msedgedev/2015/06/09/http-strict-transport-security-comes-to-internet-explorer-11-on-windows-8-1-and-windows-7/) on June 9, 2015",
},
spec => "https://tools.ietf.org/html/rfc6797",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "11" => "y #1", "12" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 12 => "y" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Strict Transport Security",
ucprefix => 0,
},
"style-scoped" => {
categories => ["CSS", "HTML5"],
chrome_id => 5374137958662144,
description => "Deprecated method of allowing scoped CSS styles using a \"scoped\" attribute. Now [removed from the specification](https://github.com/whatwg/html/issues/552) and replaced by the [\@scope CSS rule](/css-cascade-scope).",
links => [
{
title => "Polyfill",
url => "https://github.com/PM5544/scoped-polyfill",
},
{
title => "HTML5 Doctor article",
url => "https://html5doctor.com/the-scoped-attribute/",
},
{
title => "HTML5Rocks article",
url => "https://developer.chrome.com/blog/a-new-experimental-feature-style-scoped/",
},
{
title => "Firefox bug #1291515: disable `<style scoped>` in content documents",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1291515",
},
],
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Enabled in Firefox through the about:config setting \"layout.css.scoped-style.enabled\"",
},
spec => "https://www.w3.org/TR/html51/document-metadata.html#element-attrdef-style-scoped",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 20 => "n d #1", 37 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n", 21 => "y", 55 => "n d #2", 61 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y", "3.0-3.1" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Scoped attribute",
ucprefix => 0,
},
"subresource-integrity" => {
categories => ["HTML5", "Security"],
chrome_id => 6183089948590080,
description => "Subresource Integrity enables browsers to verify that file is delivered without unexpected manipulation.",
keywords => "SRI, security, hash",
links => [
{
title => "Subresource Integrity (MDN)",
url => "https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity",
},
{
title => "SRI generation and browser support test",
url => "https://www.srihash.org/",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=148363",
},
],
notes_by_num => {
1 => "Can be enabled via the \"Experimental Features\" developer menu",
},
spec => "https://www.w3.org/TR/SRI/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 45 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { 2 => "n", 43 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "n d #1", "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 32 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "rec",
title => "Subresource Integrity",
ucprefix => 0,
},
"svg" => {
categories => ["SVG"],
description => "Method of displaying basic Vector Graphics features using the embed or object elements. Refers to the SVG 1.1 spec.",
keywords => ".svg,rect,circle,ellipse,line,polyline,polygon,defs,symbol,use,tspan,tref,textpath,stroke-dasharray,stroke-dashoffset,stroke-opacity",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/Scalable_Vector_Graphics",
},
{
title => "A List Apart article",
url => "https://alistapart.com/article/using-svg-for-flexible-scalable-and-fun-backgrounds-part-i/",
},
{ title => "SVG showcase site", url => "http://svg-wow.org/" },
{
title => "Web-based SVG editor",
url => "https://github.com/SVG-Edit/svgedit",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/graphics.js#svg",
},
],
notes_by_num => {
1 => "Partial support in Android 3 & 4 refers to not supporting masking.",
2 => "Partial support in IE9-11 refers to not supporting animations.",
3 => "IE9-11 & Edge don't properly scale SVG files. [Adding height, width, viewBox, and CSS rules](https://codepen.io/tomByrer/pen/qEBbzw?editors=110) seems to be the best workaround.",
},
spec => "https://www.w3.org/TR/SVG/",
stats => {
and_chr => { "2.1" => "n", "3" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "a #2 #3", "12" => "y #3", "79" => "y" },
firefox => { 2 => "a", 3 => "y" },
ie_mob => { 10 => "y #2" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "a", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "SVG (basic support)",
ucprefix => 0,
},
"svg-css" => {
categories => ["CSS3", "SVG"],
description => "Method of using SVG images as CSS backgrounds",
keywords => "svg-in-css,svgincss,css-svg",
links => [
{
title => "Tutorial for advanced effects",
url => "https://www.sitepoint.com/a-farewell-to-css3-gradients/",
},
],
notes_by_num => {
1 => "Partial support in iOS Safari and older Safari versions refers to failing to support tiling or the background-position property.",
2 => "Partial support in older Firefox and Opera Mini/Mobile refers to SVG images being blurry when scaled.",
3 => "Partial support in Edge 15 and older refers to a lack of support for SVG data URIs. [see bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/6274479/)",
},
spec => "https://www.w3.org/TR/css3-background/#background-image",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "a", 5 => "y" },
edge => { "5.5" => "n", "9" => "y", "12" => "a #3", "16" => "y" },
firefox => { 2 => "n", 4 => "a #2", 24 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a #1", "4.2-4.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #2" },
op_mob => { 10 => "a #2", 80 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "3.2" => "a #1", "5" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "SVG in CSS backgrounds",
ucprefix => 0,
},
"svg-filters" => {
categories => ["SVG"],
description => "Method of using Photoshop-like effects on SVG objects including blurring and color manipulation.",
links => [
{
title => "SVG filter demos",
url => "http://svg-wow.org/blog/category/filters/",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/svg/elements/filter",
},
{
title => "SVG Filter effects",
url => "https://jorgeatgu.github.io/svg-filters/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/SVG11/filters.html",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 5 => "a", 8 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 3 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "SVG filters",
ucprefix => 0,
},
"svg-fonts" => {
categories => ["SVG"],
chrome_id => 5930075908210688,
description => "Method of using fonts defined as SVG shapes. Removed from [SVG 2.0](https://www.w3.org/TR/SVG2/changes.html#fonts) and considered as a deprecated feature with support being removed from browsers.",
links => [
{
title => "Blog post",
url => "http://jeremie.patonnier.net/post/2011/02/07/Why-are-SVG-Fonts-so-different",
},
{
title => "Blog post on usage for iPad",
url => "https://opentype.info/blog/2010/04/13/the-ipad-and-svg-fonts-in-mobile-safari.html?redirect=true",
},
],
notes_by_num => {
1 => "Chrome 38 and newer support SVG fonts only on Windows Vista and XP.",
2 => "Supported in Opera Mini in SVG images only, not in HTML.",
},
parent => "fontface",
spec => "https://www.w3.org/TR/SVG11/fonts.html",
stats => {
and_chr => { "2.1" => "n", "3" => "y", "135" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n #1" },
bb => { 7 => "y" },
chrome => { 4 => "y", 38 => "n #1", 51 => "n" },
edge => { "5.5" => "n", "6" => "p", "9" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n #2" },
op_mob => { 10 => "y", 80 => "n" },
opera => { 9 => "y", 25 => "n #1", 37 => "n" },
safari => { "3.1" => "n", "3.2" => "y" },
samsung => { "4" => "y", "5.0-5.4" => "n #1" },
},
status => "rec",
title => "SVG fonts",
ucprefix => 0,
},
"svg-fragment" => {
categories => ["SVG"],
description => "Method of displaying only a part of an SVG image by defining a view ID or view box dimensions as the file's fragment identifier.",
keywords => "fragments,sprite,svg,use",
links => [
{
title => "Blog post",
url => "http://www.broken-links.com/2012/08/14/better-svg-sprites-with-fragment-identifiers/",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=91791",
},
],
notes_by_num => {
1 => "Partial support refers to support inside `<img>` but not as CSS `background-image`",
2 => "Partial support refers to lack of external fragments support",
},
spec => "https://www.w3.org/TR/SVG/linking.html#SVGFragmentIdentifiers",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "a #1" },
chrome => { 4 => "n", 36 => "a #1", 50 => "y" },
edge => { "5.5" => "n", "9" => "a #2", "12" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "11.3-11.4" => "y", "3.2" => "n", "8" => "a #1", "9.0-9.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "a", "12.1" => "y" },
opera => {
"10.0-10.1" => "a",
"12.1" => "y",
"15" => "n",
"23" => "a #1",
"37" => "y",
"9" => "u",
},
safari => { "3.1" => "n", "7.1" => "a #1", "9" => "n", "11.1" => "y" },
samsung => { "4" => "a #1", "5.0-5.4" => "y" },
},
status => "cr",
title => "SVG fragment identifiers",
ucprefix => 0,
},
"svg-html" => {
categories => ["SVG"],
description => "Method of using SVG transforms, filters, etc on HTML elements using either CSS or the foreignObject element",
links => [
{
title => "MDN Web Docs - Other content in SVG",
url => "https://developer.mozilla.org/en/SVG/Tutorial/Other_content_in_SVG",
},
{
title => "MDN Web Docs - Applying SVG effects",
url => "https://developer.mozilla.org/en-US/docs/Web/SVG/Applying_SVG_effects_to_HTML_content",
},
{
title => "Filter Effects draft",
url => "https://www.w3.org/TR/filter-effects/",
},
],
notes => "Partial support refers to lack of filter support or buggy result from effects. A [CSS Filter Effects](https://www.w3.org/TR/filter-effects/) specification is in the works that would replace this method.",
notes_by_num => {
1 => "IE11 and below do not support `<foreignObject>`.",
2 => "IE and Edge do not support applying SVG filter effects to HTML elements using CSS. [Bug Report](https://web.archive.org/web/20171208021756/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/6618695/)",
},
spec => "https://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a" },
and_uc => { "15.5" => "a" },
baidu => { "13.52" => "a" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "a" },
edge => { "5.5" => "n", "9" => "a #1 #2", "12" => "a #2", "79" => "a" },
firefox => { "2" => "n", "3" => "a", "3.5" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "a" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "a" },
opera => { 9 => "a" },
safari => { "3.1" => "n", "4" => "a" },
samsung => { 4 => "a" },
},
status => "rec",
title => "SVG effects for HTML",
ucprefix => 0,
},
"svg-html5" => {
categories => ["HTML5", "SVG"],
description => "Method of using SVG tags directly in HTML documents. Requires HTML5 parser.",
links => [
{
title => "Mozilla Hacks blog post",
url => "https://hacks.mozilla.org/2010/05/firefox-4-the-html5-parser-inline-svg-speed-and-more/",
},
{
title => "Test suite",
url => "http://samples.msdn.microsoft.com/ietestcenter/html5/svghtml_harness.htm?url=SVG_HTML_Elements_001",
},
],
notes_by_num => {
1 => "Does not support CSS transforms on SVG elements (transform attribute can be used instead)",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#svg-0",
stats => {
and_chr => { "2.1" => "n", "3" => "y #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y #1", 10 => "y" },
chrome => { 4 => "p", 7 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "y #1", "17" => "y" },
firefox => { 2 => "p", 4 => "y" },
ie_mob => { 10 => "y #1" },
ios_saf => { "3.2" => "p", "5.0-5.1" => "y #1", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "p", 12 => "y" },
opera => { "9" => "p", "10.6" => "n", "11.6" => "y" },
safari => { "3.1" => "p", "5.1" => "y #1", "9" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Inline SVG in HTML5",
ucprefix => 0,
},
"svg-img" => {
categories => ["SVG"],
description => "Method of displaying SVG images in HTML using <img>.",
keywords => "svg-as-img,svg-in-img",
links => [
{
title => "Blog with SVGs and images",
url => "https://www.codedread.com/blog/",
},
],
notes_by_num => {
1 => "Partial support refers to not supporting embedded images (data URIs) inside the SVG.",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html",
stats => {
and_chr => { "2.1" => "n", "3" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "a #1", 28 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a #1", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "n", "3.2" => "a", "4" => "a #1", "9" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "SVG in HTML img element",
ucprefix => 0,
},
"svg-smil" => {
categories => ["SVG"],
description => "Method of using animation elements to animate SVG images",
keywords => "svg animation",
links => [
{
title => "Examples on SVG WOW",
url => "http://svg-wow.org/blog/category/animation/",
},
{
title => "MDN Web Docs - animation with SMIL",
url => "https://developer.mozilla.org/en/SVG/SVG_animation_with_SMIL",
},
{
title => "JS library to support SMIL in SVG",
url => "https://leunen.me/fakesmile/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/graphics.js#svg-smil",
},
{
title => "Polyfill for SMIL animate events on SVG",
url => "https://github.com/madsgraphics/SVGEventListener",
},
],
notes_by_num => {
1 => "Partial support in older Safari versions refers to not working in HTML files or CSS background images.",
},
spec => "https://www.w3.org/TR/SVG11/animate.html",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "a", 5 => "y" },
edge => { "5.5" => "n", "6" => "p", "79" => "y" },
firefox => { 2 => "p", 4 => "y" },
ie_mob => { 10 => "p" },
ios_saf => { "3.2" => "a #1", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "p", "4" => "a #1", "6" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "SVG SMIL animation",
ucprefix => 0,
},
"sxg" => {
categories => ["Other"],
chrome_id => 5745285984681984,
description => "Part of the Web Packaging spec, Signed HTTP Exchanges allow a different origin server to provide a resource, and this will be treated as if it came from the original server. This can be used with AMP CDNs, for example, to allow the original URL to be displayed in the URL bar.",
keywords => "SXG, WebPackage, AMP",
links => [
{
title => "Chrome platform status - Shipped",
url => "https://www.chromestatus.com/feature/5745285984681984",
},
{
title => "Microsoft Edge Platform Status - Supported",
url => "https://developer.microsoft.com/en-us/microsoft-edge/status/originsignedhttpexchanges/",
},
{
title => "Signed HTTP Exchanges on Google's Web Development site",
url => "https://developers.google.com/web/updates/2018/11/signed-exchanges",
},
{
title => "Developer Preview of better AMP URLs in Google Search",
url => "https://blog.amp.dev/2018/11/13/developer-preview-of-better-amp-urls-in-google-search/",
},
{
title => "Signed-Exchange: Solving the AMP URLs Display Problem",
url => "https://medium.com/oyotech/implementing-signed-exchange-for-better-amp-urls-38abd64c6766",
},
{
title => "GitHub home page for Web Packaging",
url => "https://github.com/WICG/webpackage",
},
{
title => "Mozilla's Position about Signed HTTP Exchanges (harmful)",
url => "https://mozilla.github.io/standards-positions/#http-origin-signed-responses",
},
],
notes => "Note this requires the page to be delivered signed by a certificate with the CanSignHttpExchanges extension.",
notes_by_num => {
1 => "Partial support behind a feature flag (chrome://flags/#enable-signed-http-exchange)",
},
spec => "https://tools.ietf.org/html/draft-yasskin-http-origin-signed-responses",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 71 => "a #1", 73 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 64 => "y" },
safari => { "3.1" => "n" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "other",
title => "Signed HTTP Exchanges (SXG)",
ucprefix => 0,
},
"tabindex-attr" => {
categories => ["HTML5"],
description => "Specifies the focusability of the element and in what order (if any) it should become focused (relative to other elements) when \"tabbing\" through the document.",
keywords => "tabindex,tab,tabIndex",
links => [
{
title => "MDN Web Docs - tabindex attribute",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex",
},
],
notes => "Mac OS X \"Full Keyboard Access\" refers to setting Keyboard\x{2192}Shortcuts\x{2192}Full Keyboard Access to \"All controls\" in the System Preferences.\r\n\r\n\"Unknown\" support for mobile browsers is due to lacking a method of tabbing through fields.",
notes_by_num => {
1 => "On Mac OS X, unless Full Keyboard Access is enabled, `<a>` elements are not keyboard-focusable, even if they have `tabindex=\"0\"`.",
2 => "`<a>` elements are never keyboard-focusable, even if they have `tabindex=\"0\"`. Unless Full Keyboard Access is enabled, then `<button>`s, radio buttons, and checkboxes are also not keyboard-focusable, even if they have `tabindex=\"0\"`.",
3 => "Has \"previous\" and \"next\" virtual keyboard buttons that follow tabindex order.",
},
spec => "https://html.spec.whatwg.org/multipage/interaction.html#attr-tabindex",
stats => {
and_chr => { "2.1" => "u" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "u", "7" => "y" },
firefox => { 2 => "u", 4 => "y #1" },
ie_mob => { 10 => "u" },
ios_saf => { "3.2" => "y #2 #3" },
kaios => { "2.5" => "y #1" },
op_mini => { all => "u" },
op_mob => { 10 => "u", 80 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "u", "5.1" => "y #2" },
samsung => { 4 => "u" },
},
status => "ls",
title => "tabindex global attribute",
ucprefix => 0,
},
"template" => {
categories => ["DOM", "HTML5"],
chrome_id => 5207287069147136,
description => "Method of declaring a portion of reusable markup that is parsed but not rendered until cloned.",
keywords => "webcomponents, template, <template>",
links => [
{
title => "web.dev - HTML's New template Tag",
url => "https://web.dev/webcomponents-template/",
},
{
title => "Polyfill script",
url => "https://github.com/manubb/template",
},
{
title => "Template element on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template",
},
],
notes_by_num => {
1 => "Does not support Document.importNode on templates, nested templates or elements that contain templates.",
2 => "Does not support Node.cloneNode on templates, nested templates or elements that contain templates.",
3 => "Safari 6.2 has the same partial support as Safari 7.1.",
},
spec => "https://html.spec.whatwg.org/multipage/scripting.html#the-template-element",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 26 => "a #1", 35 => "y" },
edge => { "5.5" => "n", "13" => "a #1 #2", "15" => "y" },
firefox => { 2 => "n", 22 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "a #1 #2", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a #1", 22 => "y" },
safari => { "3.1" => "n", "6.1" => "n #3", "7" => "n", "7.1" => "a #1 #2", "9" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "HTML templates",
ucprefix => 0,
},
"template-literals" => {
categories => ["JS"],
chrome_id => 4743002513735680,
description => "Template literals are string literals allowing embedded expressions using backtick characters (`). You can use multi-line strings and string interpolation features with them. Formerly known as template strings.",
keywords => "``,templateliterals,multiline",
links => [
{
title => "MDN Web Docs - Template literals",
url => "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals",
},
{
title => "ES6 Template Literals in Depth",
url => "https://ponyfoo.com/articles/es6-template-strings-in-depth",
},
],
notes_by_num => {
1 => "Safari 12 [sometimes garbage collects](https://bugs.webkit.org/show_bug.cgi?id=190756) the cached TemplateStrings used by Tagged Template Literals",
},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-template-literals",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 41 => "y" },
edge => { "5.5" => "n", "12" => "u", "13" => "y" },
firefox => { 2 => "n", 34 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "y #1", "12.2-12.5" => "y", "3.2" => "n", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 29 => "y" },
safari => { "3.1" => "n", "9.1" => "y", "12" => "y #1", "12.1" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "ES6 Template Literals (Template Strings)",
ucprefix => 0,
},
"temporal" => {
categories => ["JS", "JS API"],
chrome_id => 5668291307634688,
description => "A modern API for working with date and time, meant to supersede the original `Date` API.",
keywords => "temporal,date,time",
links => [
{
title => "Fixing JavaScript Date",
url => "https://maggiepint.com/2017/04/11/fixing-javascript-date-web-compatibility-and-reality/",
},
{
title => "Chromium implementation bug",
url => "https://bugs.chromium.org/p/v8/issues/detail?id=11544",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1839673",
},
{
title => "WebKit implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=223166",
},
{
title => "Blog post: Temporal: getting started with JavaScript\x{2019}s new date time API",
url => "https://2ality.com/2021/06/temporal-api.html",
},
],
notes => "All browsers are working on implementing this.",
notes_by_num => {
1 => "Supported in Firefox Nightly behind the `javascript.options.experimental.temporal` flag, enabled by default since 137",
},
spec => "https://tc39.es/proposal-temporal/docs/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n" },
edge => { "5.5" => "n" },
firefox => { 2 => "n", 135 => "n d #1", 139 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "Temporal",
ucprefix => 0,
},
"text-decoration" => {
categories => ["CSS3"],
chrome_id => 5766823203045376,
description => "Method of defining the type, style and color of lines in the text-decoration property. These can be defined as shorthand (e.g. `text-decoration: line-through dashed blue`) or as single properties (e.g. `text-decoration-color: blue`)",
keywords => "text-decoration-line,text-decoration-style,text-decoration-color,text-decoration-skip",
links => [
{
title => "MDN Web Docs - text-decoration-style",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration-style",
},
{
title => "MDN Web Docs - text-decoration-color",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration-color",
},
{
title => "MDN Web Docs - text-decoration-line",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration-line",
},
{
title => "MDN Web Docs - text-decoration-skip",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration-skip",
},
{
title => "Firefox implementation bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=812990",
},
],
notes => "All browsers support the CSS2 version of `text-decoration`, which matches only the `text-decoration-line` values (`underline`, etc.)",
notes_by_num => {
1 => "Enabled in Chrome through the \"experimental Web Platform features\" flag in chrome://flags",
2 => "Partial support refers to not supporting the `text-decoration-style` property.",
3 => "Safari 8+ supports `-webkit-text-decoration-skip` with values `none` and `skip` (other values behave like `none` or `skip`)",
4 => "Partial support refers to not supporting the `text-decoration-skip` property.",
5 => "Partial support refers to `text-decoration-skip` only supporting value `objects` and `ink`.",
},
spec => "https://www.w3.org/TR/css-text-decor-3/#line-decoration",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "a #4" },
and_qq => { "14.9" => "a #5" },
and_uc => { "15.5" => "a #5" },
baidu => { "13.52" => "a #5" },
bb => { 7 => "n" },
chrome => { 4 => "n", 26 => "n x d #1", 57 => "a #5" },
edge => { "5.5" => "n", "79" => "a #5" },
firefox => { 2 => "n", 6 => "a x #4", 36 => "a #4" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "8" => "a x #2" },
kaios => { "2.5" => "a #4" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #5" },
opera => { 9 => "n", 35 => "n x d #1", 44 => "a #5" },
safari => { "3.1" => "n", "7.1" => "a x #2 #4", "8" => "a x #2 #3", "12.1" => "a #2 #3" },
samsung => { "4" => "n", "7.2-7.4" => "a #5" },
},
status => "cr",
title => "text-decoration styling",
ucprefix => 0,
},
"text-emphasis" => {
categories => ["CSS3"],
description => "Method of using small symbols next to each glyph to emphasize a run of text, commonly used in East Asian languages. The `text-emphasis` shorthand, and its `text-emphasis-style` and `text-emphasis-color` longhands, can be used to apply marks to the text. The `text-emphasis-position` property, which inherits separately, allows setting the emphasis marks' position with respect to the text.",
keywords => "text-emphasis,text-emphasis-position,text-emphasis-style,text-emphasis-color",
links => [
{
title => "A javascript fallback for CSS3 emphasis mark.",
url => "https://github.com/zmmbreeze/jquery.emphasis/",
},
{
title => "MDN Web Docs - text-emphasis",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-emphasis",
},
{
title => "Chromium bug to unprefix `-webkit-text-emphasis`",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=666433",
},
],
notes => "Some old WebKit browsers (like Chrome 24) support `-webkit-text-emphasis`, but does not support CJK languages and is therefore considered unsupported.",
notes_by_num => {
1 => "Partial support refers to incorrect support for `-webkit-text-emphasis-position`. These browsers support `over` and `under` as values, but not the added `left` and `right` values required by the spec.",
2 => "Can be enabled in Firefox using the `layout.css.text-emphasis.enabled` flag",
},
spec => "https://w3c.github.io/csswg-drafts/css-text-decor-3/#text-emphasis-property",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a x #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a x #1" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "a x #1" },
bb => { 7 => "n", 10 => "a x #1" },
chrome => { 4 => "n", 25 => "a x #1", 99 => "y" },
edge => { "5.5" => "n", "79" => "a x #1", "99" => "y" },
firefox => { 2 => "n", 45 => "n d #2", 46 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a x #1", 86 => "y" },
safari => { "3.1" => "n", "6.1" => "a x #1", "7.1" => "y" },
samsung => { "4" => "a x #1", "18.0" => "y" },
},
status => "cr",
title => "text-emphasis styling",
ucprefix => 0,
},
"text-overflow" => {
categories => ["CSS3"],
description => "Append ellipsis when text overflows its containing element",
keywords => "textoverflow,ellipsis",
links => [
{
title => "jQuery polyfill for Firefox",
url => "https://github.com/rmorse/AutoEllipsis",
},
{
title => "MDN Web Docs - text-overflow",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/css.js#css-text-overflow",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/text-overflow",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-ui/#text-overflow",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "y" },
firefox => { 2 => "p", 7 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "y x", "12.1" => "y" },
opera => { 9 => "y x", 11 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "CSS3 Text-overflow",
ucprefix => 0,
},
"text-size-adjust" => {
categories => ["CSS3"],
chrome_id => 5730156303876096,
description => "On mobile devices, the text-size-adjust CSS property allows Web authors to control if and how the text-inflating algorithm is applied to the textual content of the element it is applied to.",
links => [
{
title => "MDN Web Docs - text-size-adjust",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust",
},
{
title => "Mozilla Bug\xA0#1226116: Unprefix -moz-text-size-adjust",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1226116",
},
],
notes_by_num => {
1 => "If the viewport size is set using a `<meta>` element, the `-ms-text-size-adjust` property is ignored. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust)",
2 => "Old versions of WebKit-based desktop browsers (Chrome<27, Safari<6) [suffer from a bug](https://bugs.webkit.org/show_bug.cgi?id=56543) where if `-webkit-text-size-adjust` is explicitly set to `none`, instead of ignoring the property, the browsers will prevent the user from zooming in or out on the webpage.",
},
spec => "https://w3c.github.io/csswg-drafts/css-size-adjust/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y x" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 26 => "n #2", 27 => "n", 54 => "y" },
edge => { "5.5" => "n", "12" => "y x", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "y x #1" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y x" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 43 => "y", 44 => "n", 45 => "y" },
safari => { "3.1" => "n", "5.1" => "n #2", "6" => "n" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "unoff",
title => "CSS text-size-adjust",
ucprefix => 0,
},
"text-stroke" => {
categories => ["CSS"],
description => "Method of declaring the outline (stroke) width and color for text.",
keywords => "textstroke,stroke-color,stroke-width,text-fill-color,text-outline",
links => [
{
title => "Information & workarounds",
url => "https://css-tricks.com/adding-stroke-to-web-text/",
},
{
title => "Live editor",
url => "https://www.westciv.com/tools/textStroke/",
},
{
title => "MDN Web Docs - text-stroke",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke",
},
],
notes => "Does not yet appear in any W3C specification. Was briefly included in a spec as the \"text-outline\" property, but this was removed.",
notes_by_num => {
1 => "Firefox & Edge specifically only support the `-webkit-text-stroke` property (not using `-moz-` or `-ms-` prefix)",
2 => "Requires the `layout.css.prefixes.webkit` flag to be enabled.",
},
spec => "https://compat.spec.whatwg.org/#text-fill-and-stroking",
stats => {
and_chr => { "2.1" => "y x", "3" => "n", "4" => "y x" },
and_ff => { 137 => "y x #1" },
and_qq => { "14.9" => "y x" },
and_uc => { "15.5" => "y x" },
baidu => { "13.52" => "y x" },
bb => { 7 => "y x" },
chrome => { 4 => "y x" },
edge => { "5.5" => "n", "15" => "y x #1", "79" => "y x" },
firefox => { 2 => "n", 48 => "n d #1 #2", 49 => "y x #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "a x", "4.0-4.1" => "y x" },
kaios => { "2.5" => "y x #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y x" },
opera => { 9 => "n", 15 => "y x" },
safari => { "3.1" => "y x" },
samsung => { 4 => "y x" },
},
status => "unoff",
title => "CSS text-stroke and text-fill",
ucprefix => 0,
},
"textcontent" => {
categories => ["DOM"],
description => "DOM Node property representing the text content of a node and its descendants",
links => [
{
title => "MDN Web Docs - Node.textContent",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent",
},
],
notes => "`Node.textContent` is somewhat similar to, but has important differences from, [`HTMLElement.innerText`](https://caniuse.com/#feat=innertext).",
notes_by_num => {},
spec => "https://dom.spec.whatwg.org/#dom-node-textcontent",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "4.0-4.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "u", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Node.textContent",
ucprefix => 0,
},
"textencoder" => {
categories => ["JS API"],
chrome_id => 5714368087982080,
description => "`TextEncoder` encodes a JavaScript string into bytes using the UTF-8 encoding and returns the resulting `Uint8Array` of those bytes. `TextDecoder` does the reverse.",
keywords => "encoding,text,encoder,decoding,decoder,utf,8",
links => [
{
title => "MDN Web Docs - TextEncoder",
url => "https://developer.mozilla.org/en-US/docs/Web/API/TextEncoder",
},
{
title => "WebKit Bug 160653 - Support TextEncoder & TextDecoder APIs",
url => "https://bugs.webkit.org/show_bug.cgi?id=160653",
},
],
notes_by_num => { 1 => "Not available in Web Workers in Firefox 19." },
spec => "https://encoding.spec.whatwg.org/#api",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 38 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 19 => "a #1", 20 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 25 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "TextEncoder & TextDecoder",
ucprefix => 0,
},
"tls1-1" => {
categories => ["Security"],
chrome_id => 5759116003770368,
description => "Version 1.1 of the Transport Layer Security (TLS) protocol.",
links => [
{
title => "Wikipedia article about TLS 1.1",
url => "https://en.wikipedia.org/wiki/Transport_Layer_Security#TLS_1.1",
},
{
title => "Modernizing Transport Security - Google Security Blog",
url => "https://security.googleblog.com/2018/10/modernizing-transport-security.html",
},
{
title => "Modernizing TLS connections in Microsoft Edge and Internet Explorer 11 - Microsoft Windows Blog",
url => "https://blogs.windows.com/msedgedev/2018/10/15/modernizing-tls-edge-ie11/",
},
{
title => "Removing Old Versions of TLS - Mozilla Security Blog",
url => "https://blog.mozilla.org/security/2018/10/15/removing-old-versions-of-tls/",
},
{
title => "Deprecation of Legacy TLS 1.0 and 1.1 Versions - WebKit Blog",
url => "https://webkit.org/blog/8462/deprecation-of-legacy-tls-1-0-and-1-1-versions/",
},
],
notes => "TLS 1.0 & 1.1 are deprecated in Chrome, Edge, Firefox, Internet Explorer 11, & Safari.",
notes_by_num => {
1 => "Firefox 68+ displays a small warning icon in the address bar when connecting over TLS 1.1",
2 => "Firefox 78+ displays a full page dismissable warning the first time it connects over TLS 1.1",
3 => "Chrome 85+ and Safari for MacOS 13.1+ displays `Not secure` in the address bar when connecting over TLS 1.1",
4 => "Chrome 85+ displays a full page dismissable warning every time a new site connects over TLS 1.1",
},
spec => "https://tools.ietf.org/html/rfc4346",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y #1" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 22 => "y", 85 => "a #3 #4" },
edge => { "5.5" => "n", "8" => "n d", "11" => "y" },
firefox => { 2 => "n", 23 => "n d", 24 => "y", 68 => "y #1", 78 => "a #1 #2" },
ie_mob => { 10 => "n d", 11 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "9" => "n", "12.1" => "y", "73" => "a #3 #4" },
safari => { "3.1" => "n", "7" => "y", "13.1" => "y #3" },
samsung => { 4 => "y" },
},
status => "other",
title => "TLS 1.1",
ucprefix => 0,
},
"tls1-2" => {
categories => ["Security"],
chrome_id => 5197666342404096,
description => "Version 1.2 of the Transport Layer Security (TLS) protocol. Allows for data/message confidentiality, and message authentication codes for message integrity and as a by-product message authentication.",
links => [
{
title => "Wikipedia article about TLS 1.2",
url => "https://en.wikipedia.org/wiki/Transport_Layer_Security#TLS_1.2",
},
],
notes_by_num => {},
spec => "https://tools.ietf.org/html/rfc5246",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 29 => "y" },
edge => { "5.5" => "n", "8" => "n d", "11" => "y" },
firefox => { 2 => "n", 24 => "n d", 27 => "y" },
ie_mob => { 10 => "n d", 11 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "12.1" => "y" },
opera => { "10.0-10.1" => "n d", "15" => "n", "16" => "y", "9" => "n" },
safari => { "3.1" => "n", "7" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "TLS 1.2",
ucprefix => 0,
},
"tls1-3" => {
categories => ["Security"],
chrome_id => 5712755738804224,
description => "Version 1.3 (the latest one) of the Transport Layer Security (TLS) protocol. Removes weaker elliptic curves and hash functions.",
links => [
{
title => "Wikipedia article about TLS 1.3",
url => "https://en.wikipedia.org/wiki/Transport_Layer_Security#TLS_1.3",
},
{
title => "Chrome support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=630147",
},
],
notes_by_num => {
1 => "Supports a draft of the TLS 1.3 specification, not the final version.",
2 => "Can be enabled in Firefox by setting the `security.tls.version.max` pref to \"4\" in `about:config`.",
3 => "Can be enabled in Chrome and Opera via the `#tls13-variant` flag in `chrome://flags` or `opera://flags`.",
4 => "Partial support in Safari refers to being limited to macOS 10.14 Mojave and later.",
},
spec => "https://tools.ietf.org/html/rfc8446",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 54 => "n d #3 #1", 70 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 51 => "n d #2 #1", 60 => "a #1", 63 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.2-12.5" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "n d #3 #1", 57 => "y" },
safari => { "3.1" => "n", "12.1" => "a #4", "14" => "y" },
samsung => { "4" => "n", "10.1" => "y" },
},
status => "other",
title => "TLS 1.3",
ucprefix => 0,
},
"touch" => {
categories => ["DOM", "JS API"],
chrome_id => 6156165603917824,
description => "Method of registering when, where and how the interface is touched, for devices with a touch screen. These DOM events are similar to mousedown, mousemove, etc.",
keywords => "touchstart,touchend,touchmove,touchenter,touchleave,touchcancel",
links => [
{
title => "Detailed support tables",
url => "https://www.quirksmode.org/mobile/tableTouch.html",
},
{
title => "Multi-touch demo",
url => "https://www.quirksmode.org/m/tests/drag2.html",
},
{
title => "Information on the spec development",
url => "http://schepers.cc/getintouch",
},
{
title => "Internet Explorer's gesture and touch implementation.",
url => "https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/dev-guides/hh673557(v=vs.85)",
},
{
title => "Touch polyfill for supporting touch events on Internet Explorer",
url => "https://github.com/CamHenlin/TouchPolyfill",
},
{
title => "MDN \x{2013} Touch events",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Touch_events",
},
],
notes => "Internet Explorer implements Pointer Events specification which supports more input devices than Touch Events one.\r\n\r\nThere is a library on GitHub that is working toward bringing W3C touch events to IE 10 and 11: https://github.com/CamHenlin/TouchPolyfill \r\n\r\nRemoved support in Firefox refers to desktop Firefox only.",
notes_by_num => {
1 => "Can be enabled in Firefox using the dom.w3c_touch_events.enabled flag (disabled by default for site compatibility reasons)",
2 => "Supported on IE11 Mobile for phones with \"[Windows Phone 8.1 Update](http://blogs.msdn.com/b/ie/archive/2014/07/31/the-mobile-web-should-just-work-for-everyone.aspx)\"",
3 => "Can be enabled in Edge using the \"Enable touch events\" flag under `about:flags`",
},
spec => "https://www.w3.org/TR/touch-events/",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 22 => "y" },
edge => { "5.5" => "n", "10" => "p", "12" => "n d #3", "79" => "y" },
firefox => { 2 => "n", 4 => "a", 18 => "y", 25 => "n d #1", 52 => "y" },
ie_mob => { 10 => "p", 11 => "a #2" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "y" },
},
status => "rec",
title => "Touch events",
ucprefix => 0,
},
"transforms2d" => {
categories => ["CSS3"],
chrome_id => 6437640580628480,
description => "Method of transforming an element including rotating, scaling, etc. Includes support for `transform` as well as `transform-origin` properties.",
keywords => "transformation,translate,translatex,translatey,translatez,transform3d,rotation,rotate,scale,skew,css-transforms,transform-origin,transform:rotate,transform:scale,transform:skew",
links => [
{
title => "Live editor",
url => "https://www.westciv.com/tools/transforms/",
},
{
title => "MDN Web Docs - CSS transform",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/transform",
},
{
title => "Workaround script for IE",
url => "http://www.webresourcesdepot.com/cross-browser-css-transforms-csssandpaper/",
},
{
title => "Converter for IE",
url => "https://www.useragentman.com/IETransformsTranslator/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/css.js#css-transform",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/transform/",
},
{
title => "Microsoft Edge Platform Status (SVG)",
url => "https://developer.microsoft.com/en-us/microsoft-edge/status/supportcsstransformsonsvg/",
},
],
notes => "The scale transform can be emulated in IE < 9 using Microsoft's \"zoom\" extension, others are (not easily) possible using the MS Matrix filter",
notes_by_num => {
1 => "Does not support CSS transforms on SVG elements (transform attribute can be used instead)",
},
spec => "https://www.w3.org/TR/css3-2d-transforms/",
stats => {
and_chr => { "2.1" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "y x", 36 => "y" },
edge => { "5.5" => "n", "6" => "p", "9" => "y x #1", "10" => "y #1", "17" => "y" },
firefox => { "2" => "n", "3.5" => "y x", "16" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y x", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y x", "12.1" => "y", "15" => "y x", "23" => "y" },
safari => { "3.1" => "y x", "9" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 2D Transforms",
ucprefix => 0,
},
"transforms3d" => {
categories => ["CSS3"],
chrome_id => 6437640580628480,
description => "Method of transforming an element in the third dimension using the `transform` property. Includes support for the `perspective` property to set the perspective in z-space and the `backface-visibility` property to toggle display of the reverse side of a 3D-transformed element.",
keywords => "css 3d,3dtransforms,backface visibility,perspective,transform-origin,transform-style,rotatex,rotatey,rotatez,translate3d,translatez,scalez,rotate3d",
links => [
{
title => "Multi-browser demo",
url => "http://css3.bradshawenterprises.com/flip/",
},
{
title => "Mozilla hacks article",
url => "https://hacks.mozilla.org/2011/10/css-3d-transformations-in-firefox-nightly/",
},
{
title => "3D CSS Tester",
url => "http://thewebrocks.com/demos/3D-css-tester/",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/css.js#css-transform",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/transform/",
},
{
title => "Intro to CSS 3D transforms",
url => "https://3dtransforms.desandro.com/",
},
],
notes_by_num => {
1 => "Partial support in IE refers to not supporting [the transform-style: preserve-3d property](http://msdn.microsoft.com/en-us/library/ie/hh673529%28v=vs.85%29.aspx#the_ms_transform_style_property). This prevents nesting 3D transformed elements.",
2 => "Safari 9-15.3 still require a prefix for the related `backface-visibility` property.",
},
spec => "https://w3c.github.io/csswg-drafts/css-transforms-2/",
stats => {
and_chr => { "2.1" => "n", "3" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "n", 12 => "y x", 36 => "y" },
edge => { "5.5" => "n", "10" => "a #1", "12" => "y" },
firefox => { 2 => "n", 10 => "y x", 16 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "15.4" => "y", "3.2" => "y x", "9.0-9.2" => "y #2" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 23 => "y" },
safari => { "3.1" => "n", "4" => "y x", "9" => "y #2", "15.4" => "y" },
samsung => { 4 => "y" },
},
status => "wd",
title => "CSS3 3D Transforms",
ucprefix => 0,
},
"trusted-types" => {
categories => ["DOM", "JS API", "Other", "Security"],
chrome_id => 5650088592408576,
description => "An API that forces developers to be very explicit about their use of powerful DOM-injection APIs. Can greatly improve security against XSS attacks.",
keywords => "trustedTypes,trustedHTML,trusted-types,require-trusted-types-for",
links => [
{
title => "Web.dev article on using trusted types",
url => "https://web.dev/trusted-types/",
},
{
title => "Firefox position: non-harmful",
url => "https://mozilla.github.io/standards-positions/#trusted-types",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/webappsec-trusted-types/dist/spec/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 83 => "y" },
edge => { "5.5" => "n", "83" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 69 => "y" },
safari => { "3.1" => "n", "TP" => "y" },
samsung => { "4" => "n", "13.0" => "y" },
},
status => "unoff",
title => "Trusted Types for DOM manipulation",
ucprefix => 0,
},
"ttf" => {
categories => ["CSS3"],
description => "Support for the TrueType (.ttf) and OpenType (.otf) outline font formats in \@font-face. ",
links => [
{
title => "What is the status of TTF support in Internet Explorer?",
url => "https://stackoverflow.com/questions/17694143/what-is-the-status-of-ttf-support-in-internet-explorer",
},
{
title => "OTF Specification",
url => "https://docs.microsoft.com/en-us/typography/opentype/spec",
},
],
notes_by_num => {
1 => "Partial support in IE9+ refers to the fonts only working [when set to be \"installable\"](http://blogs.msdn.com/b/ie/archive/2010/07/15/the-css-corner-better-web-typography-for-better-design.aspx). Support for this is tracked [here](https://status.modern.ie/crossdomainfontloading).",
},
parent => "fontface",
spec => "https://developer.apple.com/fonts/TrueType-Reference-Manual",
stats => {
and_chr => { "2.1" => "n", "2.2" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "12" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "n", "4.2-4.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "y" },
opera => { "10.0-10.1" => "y", "9" => "n" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "TTF/OTF - TrueType and OpenType font support",
ucprefix => 0,
},
"typedarrays" => {
categories => ["JS"],
chrome_id => 5135818813341696,
description => "JavaScript typed arrays provide a mechanism for accessing raw binary data much more efficiently. Includes: `Int8Array`, `Uint8Array`, `Uint8ClampedArray`, `Int16Array`, `Uint16Array`, `Int32Array`, `Uint32Array`, `Float32Array` & `Float64Array`\r\n",
keywords => "ES6,JavaScript,dataview,arraybuffer",
links => [
{
title => "MDN Web Docs - Typed arrays",
url => "https://developer.mozilla.org/en/javascript_typed_arrays",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#ecmascript-typed-arrays",
},
],
notes => "Includes support for ArrayBuffer objects.",
notes_by_num => {
1 => "IE10 (and IE 10&11 mobile) does not support `Uint8ClampedArray`",
2 => "Does not support `Float64Array`",
},
parent => "es6",
spec => "https://tc39.es/ecma262/#sec-typedarray-objects",
stats => {
and_chr => { "2.1" => "n", "4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 7 => "y" },
edge => { "5.5" => "n", "10" => "a #1", "11" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "a #1" },
ios_saf => { "3.2" => "n", "4.2-4.3" => "a #2", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 12 => "y" },
opera => { "9" => "n", "11.6" => "y" },
safari => { "3.1" => "n", "5.1" => "a #2", "6" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Typed Arrays",
ucprefix => 0,
},
"u2f" => {
categories => ["JS API", "Security"],
description => "JavaScript API to interact with Universal Second Factor (U2F) devices. This allows users to log into sites more securely using two-factor authentication with a USB dongle.",
keywords => "fido,u2f",
links => [
{
title => "Mozilla bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1065729",
},
{
title => "Google Security article",
url => "https://security.googleblog.com/2014/10/strengthening-2-step-verification-with.html",
},
{
title => "Chrome platform status: U2F Security Key API removal (Cryptotoken Component Extension)",
url => "https://chromestatus.com/feature/5759004926017536",
},
{
title => "Yubico blog post about the decommission",
url => "https://www.yubico.com/blog/google-chrome-u2f-api-decommission-what-the-change-means-for-your-users-and-how-to-prepare/",
},
{
title => "Chromium Intent to Deprecate and Remove: U2F API (Cryptotoken)",
url => "https://groups.google.com/a/chromium.org/g/blink-dev/c/xHC3AtU_65A/m/yg20tsVFBAAJ",
},
{
title => "Mozilla Firefox bug to remove the U2F API",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1737205",
},
],
notes => "The U2F API is [being decommissioned](https://www.yubico.com/blog/google-chrome-u2f-api-decommission-what-the-change-means-for-your-users-and-how-to-prepare/) (only the API, not the U2F protocol) and superseded by [WebAuthn](/webauthn).",
notes_by_num => {
1 => "Requires the \"FIDO U2F (Universal 2nd Factor)\" Chrome extension",
2 => "Support can be enabled with the `security.webauth.u2f` flag",
3 => "Supported [via the internal CryptoTokenExtension.](https://github.com/google/u2f-ref-code/blob/master/u2f-gae-demo/war/js/u2f-api.js)",
},
spec => "https://fidoalliance.org/specs/fido-u2f-v1.0-nfc-bt-amendment-20150514/fido-u2f-javascript-api.html",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 38 => "n #1", 41 => "y #3", 98 => "n d #3", 106 => "n" },
edge => { "5.5" => "n", "79" => "y #3", "106" => "n" },
firefox => { 2 => "n", 47 => "n d #2", 67 => "y", 112 => "n d #2", 114 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "13.3" => "y" },
kaios => { "2.5" => "n d #2", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 40 => "y #3", 41 => "n", 42 => "y #3" },
safari => { "3.1" => "n", "13" => "y" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "FIDO U2F API",
ucprefix => 0,
},
"unhandledrejection" => {
categories => ["JS", "JS API"],
chrome_id => 4805872211460096,
description => "The `unhandledrejection` event is fired when a Promise is rejected but there is no rejection handler to deal with the rejection. The `rejectionhandled` event is fired when a Promise is rejected, and after the rejection is handled by the promise's rejection handling code.",
keywords => "onunhandledrejection,onrejectionhandled,promiserejectionevent",
links => [
{
title => "MDN article on rejectionhandled",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/rejectionhandled",
},
{
title => "MDN article on unhandledrejection",
url => "https://developer.mozilla.org/en-US/docs/Web/Events/unhandledrejection",
},
{
title => "Chrome sample code",
url => "https://googlechrome.github.io/samples/promise-rejection-events/",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#unhandled-rejection-tracking",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/webappapis.html#unhandled-promise-rejections:event-unhandledrejection",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 69 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "u", "11.3-11.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "ls",
title => "unhandledrejection/rejectionhandled events",
ucprefix => 0,
},
"upgradeinsecurerequests" => {
categories => ["Security"],
chrome_id => 6534575509471232,
description => "Declare that browsers should transparently upgrade HTTP resources on a website to HTTPS.",
keywords => "security,header,uir,upgrade-insecure-requests",
links => [
{
title => "MDN Web Docs - Upgrade Insecure Requests",
url => "https://developer.mozilla.org/en-US/docs/Web/Security/CSP/CSP_policy_directives#upgrade-insecure-requests",
},
{
title => "Demo Website",
url => "https://googlechrome.github.io/samples/csp-upgrade-insecure-requests/index.html",
},
{
title => "WebKit feature request bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=143653",
},
],
notes => "The HTTP header is `Content-Security-Policy: upgrade-insecure-requests`. Alternatively, the HTML tag is `<meta http-equiv=\"Content-Security-Policy\" content=\"upgrade-insecure-requests\">`.",
notes_by_num => {},
spec => "https://www.w3.org/TR/upgrade-insecure-requests/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { 2 => "n", 42 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 30 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Upgrade Insecure Requests",
ucprefix => 0,
},
"url" => {
categories => ["JS API"],
chrome_id => 5675829346435072,
description => "API to retrieve the various parts that make up a given URL from a given URL string.",
keywords => "url constructor",
links => [
{
title => "MDN Web Docs - URL interface",
url => "https://developer.mozilla.org/en-US/docs/Web/API/URL",
},
{
title => "MDN Web Docs - URL constructor",
url => "https://developer.mozilla.org/en-US/docs/Web/API/URL/URL",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#url-and-urlsearchparams",
},
],
notes => "See also [URLSearchParams](#feat=urlsearchparams).",
notes_by_num => {
1 => "Allows objects to be created via `URL` constructor, but instances do not have the expected url properties.",
},
spec => "https://url.spec.whatwg.org/#api",
stats => {
and_chr => { "2.1" => "n", "4.4" => "n #1", "4.4.3-4.4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "n #1" },
chrome => { 4 => "n", 23 => "n #1", 32 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { 2 => "n", 26 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "n #1", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "n #1", 19 => "y" },
safari => { "3.1" => "n", "7" => "n #1", "7.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "URL API",
ucprefix => 0,
},
"url-scroll-to-text-fragment" => {
categories => ["Other"],
chrome_id => 4733392803332096,
description => "URL fragment that defines a piece of text to be scrolled into view and highlighted.",
keywords => "#:~:text=,Scroll To Text,textTarget,search",
links => [
{
title => "Article about why the `:~:` syntax",
url => "https://blog.jim-nielsen.com/2022/scroll-to-text-fragments/",
},
],
notes => "Firefox has basic support but still [has a number of open issues](https://bugzilla.mozilla.org/show_bug.cgi?id=1753933) related to the feature.",
notes_by_num => {},
spec => "https://wicg.github.io/ScrollToTextFragment/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "n d", 81 => "y" },
edge => { "5.5" => "n", "79" => "n d", "83" => "y" },
firefox => { 2 => "n", 131 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.1" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 66 => "n d", 68 => "y" },
safari => { "3.1" => "n", "16.1" => "y" },
samsung => { "4" => "n", "13.0" => "y" },
},
status => "unoff",
title => "URL Scroll-To-Text Fragment",
ucprefix => 0,
},
"urlsearchparams" => {
categories => ["JS API"],
chrome_id => 5632984866619392,
description => "The URLSearchParams interface defines utility methods to work with the query string of a URL.",
keywords => "url,search,params",
links => [
{
title => "Easy URL manipulation with URLSearchParams",
url => "https://developers.google.com/web/updates/2016/01/urlsearchparams?hl=en",
},
{
title => "MDN Web Docs - URLSearchParams",
url => "https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams",
},
{
title => "Polyfill for this feature is available in the core-js library",
url => "https://github.com/zloirock/core-js#url-and-urlsearchparams",
},
{
title => "EdgeHTML implementation bug",
url => "https://web.archive.org/web/20190624214230/https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8993198/",
},
],
notes_by_num => {
1 => "Partial support refers to only supporting `entries()`, `keys()`, `values()`, and `for...of`.",
},
spec => "https://url.spec.whatwg.org/#urlsearchparams",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 49 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => { 2 => "n", 29 => "a #1", 44 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "10.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 36 => "y" },
safari => { "3.1" => "n", "10.1" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "y" },
},
status => "ls",
title => "URLSearchParams",
ucprefix => 0,
},
"use-strict" => {
categories => ["JS"],
description => "Method of placing code in a \"strict\" operating context.",
links => [
{
title => "Information page",
url => "https://johnresig.com/blog/ecmascript-5-strict-mode-json-and-more/",
},
{
title => "Article with test suite",
url => "https://javascriptweblog.wordpress.com/2011/05/03/javascript-strict-mode/",
},
],
notes_by_num => {
1 => "Partial support in older Safari refers to strict mode still accepting a lot of JS that should be considered invalid.",
},
parent => "es5",
spec => "https://www.ecma-international.org/ecma-262/5.1/#sec-14.1",
stats => {
and_chr => { "2.1" => "n", "3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 13 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "11.5" => "y" },
opera => { "9" => "n", "11.6" => "y" },
safari => { "3.1" => "n", "5" => "a #1", "6" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "ECMAScript 5 Strict Mode",
ucprefix => 0,
},
"user-select-none" => {
categories => ["CSS"],
description => "Method of preventing text/element selection using CSS. ",
links => [
{
title => "MDN Web Docs - CSS user-select",
url => "https://developer.mozilla.org/en-US/docs/CSS/user-select",
},
{
title => "CSS Tricks article",
url => "https://css-tricks.com/almanac/properties/u/user-select/",
},
{
title => "MSDN Documentation",
url => "https://docs.microsoft.com/en-us/previous-versions/hh781492(v=vs.85)",
},
{
title => "WebKit bug to unprefix `-webkit-user-select`",
url => "https://bugs.webkit.org/show_bug.cgi?id=208677",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/csswg-drafts/css-ui-4/#valdef-user-select-none",
stats => {
and_chr => { "2.1" => "y x", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y x" },
chrome => { 4 => "y x", 54 => "y" },
edge => { "5.5" => "n", "10" => "y x", "79" => "y" },
firefox => { 2 => "y x", 69 => "y" },
ie_mob => { 10 => "y x" },
ios_saf => { "3.2" => "y x" },
kaios => { "2.5" => "y x", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y x", 41 => "y" },
safari => { "3.1" => "y x" },
samsung => { "4" => "y x", "6.2-6.4" => "y" },
},
status => "wd",
title => "CSS user-select: none",
ucprefix => 0,
},
"user-timing" => {
categories => ["JS API"],
chrome_id => 5066549580791808,
description => "Method to help web developers measure the performance of their applications by giving them access to high precision timestamps.",
keywords => "performance,testing,mark,measure",
links => [
{
title => "SitePoint article",
url => "https://www.sitepoint.com/discovering-user-timing-api/",
},
{
title => "HTML5Rocks article",
url => "https://www.html5rocks.com/en/tutorials/webperformance/usertiming/",
},
{
title => "Polyfill",
url => "https://gist.github.com/pmeenan/5902672",
},
{
title => "Demo",
url => "https://audero.it/demo/user-timing-api-demo.html",
},
{
title => "UserTiming.js polyfill",
url => "https://github.com/nicjansma/usertiming.js",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/user-timing/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 25 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 38 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "User Timing API",
ucprefix => 0,
},
"variable-fonts" => {
categories => ["CSS"],
chrome_id => 4708676673732608,
description => "OpenType font settings that allows a single font file to behave like multiple fonts: it can contain all the allowed variations in width, weight, slant, optical size, or any other exposed axes of variation as defined by the font designer. Variations can be applied via the `font-variation-settings` property.",
keywords => "variable fonts, variation fonts, font variations",
links => [
{
title => "MDN Web docs article",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/font-variation-settings",
},
{
title => "How to use variable fonts in the real world",
url => "https://medium.com/clear-left-thinking/how-to-use-variable-fonts-in-the-real-world-e6d73065a604",
},
{
title => "v-fonts.com - A simple resource for finding and trying variable fonts",
url => "https://v-fonts.com",
},
{
title => "Axis-Praxis - Tool & info on variable fonts",
url => "https://www.axis-praxis.org/about",
},
{
title => "Getting started with Variable Fonts on the Frontend (2022)",
url => "https://evilmartians.com/chronicles/the-joy-of-variable-fonts-getting-started-on-the-frontend",
},
],
notes_by_num => {
1 => "Works with Experimental Web Platform features enabled",
2 => "Requires macOS 10.12 Sierra or later and the following about:config flags to be enabled:\r\n`layout.css.font-variations.enabled`,\r\n`gfx.downloadable_fonts.keep_variation_tables`",
3 => "Requires macOS 10.13 High Sierra or later or [Windows 10 1709 \"Fall Creators Update\" or later](https://bugzilla.mozilla.org/show_bug.cgi?id=1742970#c2)",
4 => "Does not support the `font-weight` and `font-stretch` properties.",
5 => "Does not support `format('truetype-variations')`, `format('woff-variations')`, `format('woff2-variations')`",
6 => "Does not support OpenType-CFF2 fonts",
7 => "OpenType-CFF2 support requires macOS 10.15 Catalina or later",
},
spec => "https://w3c.github.io/csswg-drafts/css-fonts-4/#font-variation-settings-def",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y #6" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 59 => "n d #1 #6", 62 => "a #5 #6", 66 => "y #6", 67 => "y" },
edge => { "5.5" => "n", "17" => "y" },
firefox => {
2 => "n",
53 => "n d #2 #4 #5 #6",
58 => "n d #3 #4 #5 #6",
60 => "n d #3 #4 #6",
61 => "n d #3 #6",
62 => "y #3 #6",
71 => "y #3 #7",
},
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y #6", "13.0-13.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 49 => "a #5 #6", 53 => "y #6", 54 => "y" },
safari => { "3.1" => "n", "11" => "y #3 #6", "13" => "y #7", "15" => "y" },
samsung => { "4" => "n", "8.2" => "y #6" },
},
status => "wd",
title => "Variable fonts",
ucprefix => 0,
},
"vector-effect" => {
categories => ["SVG"],
description => "The `non-scaling-stroke` value for the `vector-effect` SVG attribute/CSS property makes strokes appear as the same width regardless of any transformations applied.",
links => [
{
title => "MDN Docs article on vector-effect",
url => "https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/vector-effect",
},
{
title => "Firefox implementation bug for other values",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1318208",
},
{
title => "Chromium implementation bug for other values",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=691398",
},
],
notes => "Other values for the `vector-effect` attribute/property are currently at risk of being removed from the specification as they are not being developed by browser vendors.",
notes_by_num => {},
spec => "https://www.w3.org/TR/SVG2/coords.html#VectorEffectProperty",
stats => {
and_chr => { "2.1" => "u", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "u" },
chrome => { 4 => "u", 15 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 12 => "y" },
opera => { "9" => "n", "11.6" => "y" },
safari => { "3.1" => "n", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "SVG vector-effect: non-scaling-stroke",
ucprefix => 0,
},
"vibration" => {
categories => ["JS API"],
chrome_id => 5698768766763008,
description => "Method to access the vibration mechanism of the hosting device.",
keywords => "vibration,mobile,device",
links => [
{
title => "MDN Web Docs - Vibration",
url => "https://developer.mozilla.org/en-US/docs/Web/Guide/API/Vibration",
},
{
title => "Vibration API sample code & demo",
url => "https://davidwalsh.name/vibration-api",
},
{
title => "Tuts+ article",
url => "https://code.tutsplus.com/tutorials/html5-vibration-api--mobile-22585",
},
{
title => "Demo",
url => "https://audero.it/demo/vibration-api-demo.html",
},
{
title => "Article and Usage Examples",
url => "https://www.illyism.com/journal/vibrate-mobile-phone-web-vibration-api/",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/vibration/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 30 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 11 => "y x", 16 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 17 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "y" },
},
status => "rec",
title => "Vibration API",
ucprefix => 0,
},
"video" => {
categories => ["HTML5"],
description => "Method of playing videos on webpages (without requiring a plug-in). Includes support for the following media properties: `currentSrc`, `currentTime`, `paused`, `playbackRate`, `buffered`, `duration`, `played`, `seekable`, `ended`, `autoplay`, `loop`, `controls`, `volume` & `muted`",
keywords => "<video>,videoHeight,videoWidth,HTMLVideoElement.videoHeight,HTMLVideoElement.videoWidth",
links => [
{
title => "Detailed article on video/audio elements",
url => "https://dev.opera.com/articles/everything-you-need-to-know-html5-video-audio/",
},
{
title => "WebM format information",
url => "https://www.webmproject.org",
},
{
title => "Video for Everybody",
url => "http://camendesign.co.uk/code/video_for_everybody",
},
{
title => "Video on the Web - includes info on Android support",
url => "http://diveintohtml5.info/video.html",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/video.js#video",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/html/elements/video",
},
],
notes => "Different browsers have support for different video formats, see sub-features for details.\r\n\r\n",
notes_by_num => {
1 => "The Android browser (before 2.3) requires [specific handling](http://www.broken-links.com/2010/07/08/making-html5-video-work-on-android-phones/) to run the video element.",
2 => "Old Firefox versions were missing support for some properties: `loop` was added in v11, `played` in v15, `playbackRate` in v20.",
3 => "Ignores the `autoplay` attribute by default, though autoplay behavior can be [enabled by users](https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/)",
4 => "On iOS the `volume` property is read-only.",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#the-video-element",
stats => {
and_chr => { "2.1" => "a #1", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.5" => "a #2", "20" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "11.0-11.2" => "y #3 #4", "3.2" => "y #4" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "y", "11" => "y #3" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Video element",
ucprefix => 0,
},
"videotracks" => {
categories => ["HTML5"],
chrome_id => 5748496434987008,
description => "Method of specifying and selecting between multiple video tracks. Useful for providing sign language tracks, burnt-in captions or subtitles, alternative camera angles, etc.",
keywords => "VideoTrack,VideoTrackList,media,multiple,selection",
links => [
{
title => "MDN Web Docs - HTMLMediaElement",
url => "https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement",
},
],
notes_by_num => {
1 => "Supported in Firefox by enabling \"media.track.enabled\" in about:config",
2 => "Supported in Chrome and Opera by enabling \"enable-experimental-web-platform-features\" in chrome:flags",
},
spec => "https://html.spec.whatwg.org/multipage/embedded-content.html#audiotracklist-and-videotracklist-objects",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n d #2" },
and_uc => { "15.5" => "n d #2" },
baidu => { "13.52" => "n d #2" },
bb => { 7 => "n" },
chrome => { 4 => "n", 45 => "n d #2" },
edge => { "5.5" => "n", "12" => "y", "79" => "n d #2" },
firefox => { 2 => "n", 33 => "n d #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "n d #2" },
opera => { 9 => "n", 32 => "n d #2" },
safari => { "3.1" => "n", "6.1" => "y" },
samsung => { 4 => "n" },
},
status => "ls",
title => "Video Tracks",
ucprefix => 0,
},
"view-transitions" => {
categories => ["CSS", "JS API"],
chrome_id => 5193009714954240,
description => "Provides a mechanism for easily creating animated transitions between different DOM states, while also updating the DOM contents in a single step. This API is specific to single-document transitions.",
keywords => "ViewTransition,startViewTransition",
links => [
{
title => "Explainer document",
url => "https://github.com/WICG/view-transitions/blob/main/explainer.md",
},
{
title => "Chrome Developers documentation",
url => "https://developer.chrome.com/docs/web-platform/view-transitions/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1823896",
},
{
title => "View Transition API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/View_Transition_API",
},
],
notes_by_num => {},
spec => "https://www.w3.org/TR/css-view-transitions-1/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 111 => "y" },
edge => { "5.5" => "n", "111" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "18.0" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 97 => "y" },
safari => { "3.1" => "n", "18.0" => "y" },
samsung => { 4 => "n", 23 => "y" },
},
status => "wd",
title => "View Transitions API (single-document)",
ucprefix => 0,
},
"viewport-unit-variants" => {
categories => ["CSS"],
chrome_id => 5170718078140416,
description => "Viewport units similar to `vw` and `vh` that are based on shown or hidden browser UI states to address shortcomings of the original units. Currently defined as the `sv*` units (`svb`,\xA0`svh`,\xA0`svi`,\xA0`svmax`,\xA0`svmin`,\xA0`svw`), `lv*` units (`lvb`,\xA0`lvh`,\xA0`lvi`,\xA0`lvmax`,\xA0`lvmin`,\xA0`lvw`), `dv*` units (`dvb`,\xA0`dvh`,\xA0`dvi`,\xA0`dvmax`,\xA0`dvmin`,\xA0`dvw`) and the logical `vi`/`vb` units.",
links => [
{
title => "Blog post explaining the new units",
url => "https://www.bram.us/2021/07/08/the-large-small-and-dynamic-viewports/",
},
{
title => "Chromium support bug",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1093055",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1610815",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=219287",
},
{
title => "MDN Web Docs - Relative length units based on viewport",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/length#relative_length_units_based_on_viewport",
},
],
notes_by_num => {
1 => "Can be enabled via the [Experimental Web Platform features](chrome://flags/#enable-experimental-web-platform-features) flag",
},
spec => "https://www.w3.org/TR/css-values-4/#viewport-variants",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 100 => "n d #1", 108 => "y" },
edge => { "5.5" => "n", "105" => "n d #1", "108" => "y" },
firefox => { 2 => "n", 101 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "15.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 91 => "n d #1", 94 => "y" },
safari => { "3.1" => "n", "15.4" => "y" },
samsung => { 4 => "n", 21 => "y" },
},
status => "wd",
title => "Small, Large, and Dynamic viewport units",
ucprefix => 0,
},
"viewport-units" => {
categories => ["CSS3"],
description => "Length units representing a percentage of the current viewport dimensions: width (vw), height (vh), the smaller of the two (vmin), or the larger of the two (vmax).",
keywords => "vm,viewport-percentage,100vh,100vw",
links => [
{
title => "Blog post",
url => "https://css-tricks.com/viewport-sized-typography/",
},
{ title => "Polyfill", url => "https://github.com/saabi/vminpoly" },
{
title => "Buggyfill - Polyfill that fixes buggy support",
url => "https://github.com/rodneyrehm/viewport-units-buggyfill",
},
{
title => "Back-Forward issue blog post",
url => "https://blog.rodneyrehm.de/archives/34-iOS7-Mobile-Safari-And-Viewport-Units.html",
},
],
notes_by_num => {
1 => "Partial support in IE9 refers to supporting \"vm\" instead of \"vmin\".",
2 => "Partial support refers to not supporting the \"vmax\" unit. ",
3 => "Partial support in iOS7 is due to buggy behavior of the \"vh\" unit (see workarounds: [1](https://gist.github.com/pburtchaell/e702f441ba9b3f76f587), [2](https://gist.github.com/BenMorel/e9e34c08360ebbbd0634)).",
},
spec => "https://www.w3.org/TR/css3-values/#viewport-relative-lengths",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 20 => "a #2", 26 => "y" },
edge => { "5.5" => "n", "9" => "a #1", "10" => "a #2", "16" => "y" },
firefox => { 2 => "n", 19 => "y" },
ie_mob => { 10 => "a #2" },
ios_saf => { "3.2" => "n", "6.0-6.1" => "a #2 #3", "7.0-7.1" => "a #3", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "a #2", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "Viewport units: vw, vh, vmin, vmax",
ucprefix => 0,
},
"wai-aria" => {
categories => ["Other"],
description => "Method of providing ways for people with disabilities to use dynamic web content and web applications.",
keywords => "wai,aria,wai-aria,web accessibility initiative,accessible rich internet applications,html,a11y,accessible,aria-hidden,aria-labelledby,aria-haspopup,aria-expanded,aria-controls,roles",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/WAI-ARIA",
},
{
title => "HTML5/WAI-ARIA information",
url => "https://zufelt.ca/blog/are-you-confused-html5-and-wai-aria-yet",
},
{
title => "a11ysupport.io - Accessibility Support data for various HTML, ARIA, CSS, and SVG features",
url => "https://a11ysupport.io/",
},
{
title => "WAI-ARIA Overview",
url => "https://www.w3.org/WAI/standards-guidelines/aria/",
},
{
title => "Links to various test results",
url => "https://developer.paciellogroup.com/blog/2011/10/browser-assistive-technology-tests-redux/",
},
{
title => "A List Apart - The Accessibility of WAI-ARIA",
url => "https://alistapart.com/article/the-accessibility-of-wai-aria/",
},
],
notes => "Support for ARIA is rather complex and currently is not fully supported in any browser. For detailed information on partial support see the [ARIA 1.0 Implementation Report](https://www.w3.org/WAI/ARIA/1.0/CR/implementation-report)\r\n",
notes_by_num => {},
spec => "https://www.w3.org/TR/wai-aria/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "a" },
and_ff => { 137 => "a" },
and_qq => { "14.9" => "a" },
and_uc => { "15.5" => "a" },
baidu => { "13.52" => "a" },
bb => { 7 => "n" },
chrome => { 4 => "a" },
edge => { "5.5" => "n", "8" => "a" },
firefox => { 2 => "a" },
ie_mob => { 10 => "a" },
ios_saf => { "3.2" => "a" },
kaios => { "2.5" => "a" },
op_mini => { all => "a" },
op_mob => { 10 => "a" },
opera => { "9" => "n", "9.5-9.6" => "a" },
safari => { "3.1" => "n", "4" => "a" },
samsung => { 4 => "a" },
},
status => "rec",
title => "WAI-ARIA Accessibility features",
ucprefix => 0,
},
"wake-lock" => {
categories => ["JS API"],
chrome_id => 4636879949398016,
description => "API to prevent devices from dimming, locking or turning off the screen when the application needs to keep running.",
keywords => "navigator.wakelock.request,wakelocksentinel,screen-wake-lock",
links => [
{
title => "Stay awake with the Screen Wake Lock API",
url => "https://web.dev/wakelock/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1589554",
},
{
title => "WebKit support bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=205104",
},
{
title => "MDN article about the Screen Wake Lock API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Screen_Wake_Lock_API",
},
],
notes_by_num => {
1 => "Available behind the #experimental-web-platform-features feature flag",
2 => "Available behind the `dom.screenwakelock.enabled` flag, which is only enabled by default in early Beta or earlier",
},
spec => "https://www.w3.org/TR/wake-lock/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 71 => "n d #1", 85 => "y" },
edge => { "5.5" => "n", "79" => "n d #1", "90" => "y" },
firefox => { 2 => "n", 124 => "n d #2", 126 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 58 => "n d #1", 73 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "cr",
title => "Screen Wake Lock API",
ucprefix => 0,
},
"wasm" => {
categories => ["Other"],
chrome_id => 5453022515691520,
description => "WebAssembly or \"wasm\" is a new portable, size- and load-time-efficient format suitable for compilation to the web.",
keywords => "web assembly",
links => [
{ title => "Official site", url => "https://webassembly.org/" },
{
title => "WebAssembly on MDN",
url => "https://developer.mozilla.org/docs/WebAssembly",
},
{
title => "Roadmap and detailed feature support table",
url => "https://webassembly.org/roadmap/",
},
],
notes_by_num => {
1 => "Can be enabled via the `javascript.options.wasm` in `about:config`",
2 => "Can be enabled via the `#enable-webassembly` flag",
3 => "Can be enabled via the Experimental JavaScript Features flag",
4 => "Disabled for Firefox 52 ESR",
},
spec => "https://github.com/WebAssembly/spec",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 51 => "n d #2", 57 => "y" },
edge => { "5.5" => "n", "15" => "n d #3", "16" => "y" },
firefox => { 2 => "n", 47 => "n d #1", 52 => "y #4", 53 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "n d #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 38 => "n d #2", 44 => "y" },
safari => { "3.1" => "n", "11" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "other",
title => "WebAssembly",
ucprefix => 0,
},
"wasm-bigint" => {
categories => ["Other"],
chrome_id => 5648655109324800,
description => "An extension to the WebAssembly JS API for bidrectionally converting BigInts and 64-bit WebAssembly integer values",
keywords => "webassembly,bigint,64bit",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/JS-BigInt-integration",
},
],
notes => "Safari supported BigInt in version 14.1, but did not support BigInt64Array (which is also required for Emscripten's BigInt support) until version 15",
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/js-api/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 85 => "y" },
edge => { "5.5" => "n", "85" => "y" },
firefox => { 2 => "n", 78 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 71 => "y" },
safari => { "3.1" => "n", "14.1" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "wd",
title => "WebAssembly BigInt to i64 conversion in JS API",
ucprefix => 0,
},
"wasm-bulk-memory" => {
categories => ["Other"],
chrome_id => 4590306448113664,
description => "An extension to WebAssembly adding bulk memory operations and conditional segment initialization",
keywords => "webassembly,bulk,memory,passive,segment",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/bulk-memory-operations/blob/master/proposals/bulk-memory-operations/Overview.md",
},
],
notes => "Passive data segments/conditional segment initialization was also included by browsers with the threads extension",
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 75 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 79 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "y" },
safari => { "3.1" => "n", "15" => "y" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "wd",
title => "WebAssembly Bulk Memory Operations",
ucprefix => 0,
},
"wasm-multi-value" => {
categories => ["Other"],
chrome_id => 5192420329259008,
description => "An extension to WebAssembly allowing instructions, blocks and functions to produce multiple result values",
keywords => "webassembly,multi,value",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/multi-value/blob/master/proposals/multi-value/Overview.md",
},
],
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 85 => "y" },
edge => { "5.5" => "n", "85" => "y" },
firefox => { 2 => "n", 78 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "13.2" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 71 => "y" },
safari => { "3.1" => "n", "13.1" => "y" },
samsung => { "4" => "n", "14.0" => "y" },
},
status => "wd",
title => "WebAssembly Multi-Value",
ucprefix => 0,
},
"wasm-mutable-globals" => {
categories => ["Other"],
chrome_id => 5754634769530880,
description => "An extension to WebAssembly import and export of mutable global variables",
keywords => "webassembly,mutable,globals",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/mutable-global/blob/master/proposals/mutable-global/Overview.md",
},
],
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 61 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 60 => "y" },
safari => { "3.1" => "n", "12" => "y" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "wd",
title => "WebAssembly Import/Export of Mutable Globals",
ucprefix => 0,
},
"wasm-nontrapping-fptoint" => {
categories => ["Other"],
chrome_id => 4611843511287808,
description => "An extension to WebAssembly adding floating-point to integer conversion operators which saturate instead of trapping",
keywords => "webassembly,nontrapping,saturating,float",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/nontrapping-float-to-int-conversions/blob/main/proposals/nontrapping-float-to-int-conversion/Overview.md",
},
],
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 75 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 64 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "y" },
safari => { "3.1" => "n", "15" => "y" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "wd",
title => "WebAssembly Non-trapping float-to-int Conversion",
ucprefix => 0,
},
"wasm-reference-types" => {
categories => ["Other"],
chrome_id => 5166497248837632,
description => "An extension to WebAssembly allowing opaque references as first-class types, and multiple tables",
keywords => "webassembly,reftypes,externref",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/spec/blob/main/proposals/reference-types/Overview.md",
},
],
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 96 => "y" },
edge => { "5.5" => "n", "96" => "y" },
firefox => { 2 => "n", 79 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 82 => "y" },
safari => { "3.1" => "n", "15" => "y" },
samsung => { "4" => "n", "17.0" => "y" },
},
status => "wd",
title => "WebAssembly Reference Types",
ucprefix => 0,
},
"wasm-signext" => {
categories => ["Other"],
chrome_id => 4961472689995776,
description => "An extension to WebAssembly adding sign-extension operator instructions",
keywords => "webassembly,sign,extension,signext",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/sign-extension-ops/blob/master/proposals/sign-extension-ops/Overview.md",
},
],
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 62 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "y" },
safari => { "3.1" => "n", "14.1" => "y" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "wd",
title => "WebAssembly Sign Extension Operators",
ucprefix => 0,
},
"wasm-simd" => {
categories => ["Other"],
chrome_id => 6533147810332672,
description => "An extension to WebAssembly adding 128-bit SIMD operations",
keywords => "webassembly,SIMD,vector",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/simd/blob/main/proposals/simd/SIMD.md",
},
],
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 91 => "y" },
edge => { "5.5" => "n", "91" => "y" },
firefox => { 2 => "n", 89 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "y" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 77 => "y" },
safari => { "3.1" => "n", "16.4" => "y" },
samsung => { "4" => "n", "16.0" => "y" },
},
status => "wd",
title => "WebAssembly SIMD",
ucprefix => 0,
},
"wasm-threads" => {
categories => ["Other"],
chrome_id => 5724132452859904,
description => "An extension to WebAssembly adding shared memory and atomic memory operations",
keywords => "webassembly,threads,atomics,shared",
links => [
{
title => "Feature extension overview",
url => "https://github.com/WebAssembly/threads/blob/main/proposals/threads/Overview.md",
},
],
notes => "Threads support in browsers also includes passive data segments (from the bulk-memory extension)",
notes_by_num => {},
parent => "wasm",
spec => "https://webassembly.github.io/spec/core/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "u" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "u" },
bb => { 7 => "n" },
chrome => { 4 => "n", 74 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 79 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.5-14.8" => "y", "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "u" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 62 => "y" },
safari => { "3.1" => "n", "14.1" => "y" },
samsung => { "11.1-11.2" => "y", "4" => "n" },
},
status => "wd",
title => "WebAssembly Threads and Atomics",
ucprefix => 0,
},
"wav" => {
categories => ["Other"],
description => "Waveform Audio File Format, aka WAV or WAVE, a typically uncompressed audio format. ",
links => [
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/WAV",
},
],
notes => "Support refers to this format's use in the `audio` element, not other conditions.",
notes_by_num => {},
parent => "audio",
spec => "http://www-mmsp.ece.mcgill.ca/Documents/AudioFormats/WAVE/WAVE.html",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 8 => "y" },
edge => { "5.5" => "n", "12" => "y" },
firefox => { "2" => "n", "3.5" => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "u", 11 => "y" },
opera => { "9" => "n", "10.5" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "Wav audio format",
ucprefix => 0,
},
"wbr-element" => {
categories => ["HTML5"],
description => "Represents an extra place where a line of text may optionally be broken.",
keywords => "wbr,element,word,break,opportunity",
links => [
{
title => "MDN Web Docs - Element wbr",
url => "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/wbr",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/semantics.html#the-wbr-element",
stats => {
and_chr => { "2.1" => "u", "2.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "y", "8" => "n", "12" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "u", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "u", "9.5-9.6" => "y" },
safari => { "3.1" => "u", "3.2" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "wbr (word break opportunity) element",
ucprefix => 0,
},
"web-animation" => {
categories => ["DOM", "JS API"],
chrome_id => "4854343836631040,5633748733263872",
description => "Lets you create animations that are run in the browser, as well as inspect and manipulate animations created through declarative means like CSS.",
keywords => "animate,element.animate,play,pause,reverse,finish,currentTime,startTime,playbackRate,playState,WAAPI",
links => [
{
title => "HTML5 Rocks",
url => "https://developer.chrome.com/blog/web-animations-element-animate-is-now-in-chrome-36/",
},
{
title => "HTML5 Rocks",
url => "https://developer.chrome.com/blog/new-web-animations-engine-in-blink-drives-css-animations-transitions/",
},
{
title => "Current Firefox status",
url => "https://birtles.github.io/areweanimatedyet/",
},
{
title => "Polyfill",
url => "https://github.com/web-animations/web-animations-js",
},
],
notes_by_num => {
1 => "Partial support refers to basic support of `element.animate()`",
2 => "Partial support refers to basic support of `element.animate()` and [playback control of AnimationPlayer](https://www.chromestatus.com/features/5633748733263872)",
3 => "Partial support in Firefox is detailed in [Are we animated yet?](https://birtles.github.io/areweanimatedyet/)",
4 => "Can be enabled via the \"Experimental Features\" developer menu",
5 => "Does not support [composite modes](https://drafts.csswg.org/web-animations-1/#effect-composition)",
},
spec => "https://w3c.github.io/csswg-drafts/web-animations/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "a #2" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 36 => "a #1", 39 => "a #2", 84 => "y" },
edge => { "5.5" => "n", "79" => "a #2", "84" => "y" },
firefox => { 2 => "n", 33 => "a d #3", 47 => "a #3", 59 => "a #2", 75 => "y #5", 81 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "11.0-11.2" => "n d #4", "13.4-13.7" => "y #5", "3.2" => "n" },
kaios => { "2.5" => "a #3", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 23 => "a #1", 26 => "a #2", 71 => "y" },
safari => { "3.1" => "n", "11" => "n d #4", "13.1" => "y #5", "15" => "y" },
samsung => { "4" => "a #2", "14.0" => "y" },
},
status => "wd",
title => "Web Animations API",
ucprefix => 0,
},
"web-bluetooth" => {
categories => ["JS API"],
chrome_id => 5264933985976320,
description => "Allows web sites to communicate over GATT with nearby user-selected Bluetooth devices in a secure and privacy-preserving way.",
keywords => "bluetooth,ble,iot,physicalweb,webbluetooth",
links => [
{
title => "Intro",
url => "https://developers.google.com/web/updates/2015/07/interact-with-ble-devices-on-the-web",
},
{
title => "Samples",
url => "https://googlechrome.github.io/samples/web-bluetooth/",
},
{ title => "Demos", url => "https://github.com/WebBluetoothCG/demos" },
{
title => "Implementation Status",
url => "https://github.com/WebBluetoothCG/web-bluetooth/blob/main/implementation-status.md",
},
{
title => "Mozilla Specification Positions: Harmful",
url => "https://mozilla.github.io/standards-positions/#web-bluetooth",
},
],
notes_by_num => {
1 => "Available by enabling the \"Web Bluetooth\" experimental flag in `about:flags`. Currently support [varies by OS](https://github.com/WebBluetoothCG/web-bluetooth/blob/main/implementation-status.md)",
2 => "Only in Opera Mobile",
3 => "Available in [Origin Trials](https://developers.google.com/web/updates/2015/07/interact-with-ble-devices-on-the-web#available-for-origin-trials) for Chrome OS, Android M, and Mac",
4 => "Currently support [varies by OS](https://github.com/WebBluetoothCG/web-bluetooth/blob/main/implementation-status.md#chrome)",
},
spec => "https://webbluetoothcg.github.io/web-bluetooth/",
stats => {
and_chr => { "2.1" => "n", "135" => "y #4" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y #4" },
baidu => { "13.52" => "y #4" },
bb => { 7 => "n" },
chrome => { 4 => "n", 45 => "n d #1", 53 => "n d #1 #3", 56 => "y #4" },
edge => { "5.5" => "n", "79" => "y #4" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #4" },
opera => { 9 => "n", 36 => "n d #1 #2", 40 => "n d #1 #3", 43 => "y #4" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "6.2-6.4" => "y" },
},
status => "unoff",
title => "Web Bluetooth",
ucprefix => 0,
},
"web-serial" => {
categories => ["JS API"],
chrome_id => 6577673212002304,
description => "Allows communication with devices via a serial interface.",
keywords => "navigator.serial",
links => [
{
title => "Explainer",
url => "https://github.com/WICG/serial/blob/main/EXPLAINER.md",
},
{
title => "Read from and write to a serial port",
url => "https://web.dev/serial/",
},
{
title => "Mozilla position: harmful",
url => "https://mozilla.github.io/standards-positions/#webserial",
},
{
title => "WebKit position: opposed",
url => "https://webkit.org/tracking-prevention/",
},
],
notes_by_num => {},
spec => "https://wicg.github.io/serial/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 78 => "n d", 89 => "y" },
edge => { "5.5" => "n", "79" => "n d", "89" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 65 => "n d", 76 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Web Serial API",
ucprefix => 0,
},
"web-share" => {
categories => ["JS API"],
chrome_id => 5668769141620736,
description => "A way to allow websites to invoke the native sharing capabilities of the host platform",
keywords => "web share,share,share api,intents api,navigator.share,navigator.canShare",
links => [
{
title => "Chrome post",
url => "https://developers.google.com/web/updates/2016/10/navigator-share",
},
{
title => "Hospodarets - Web Share API brings the native sharing capabilities to the browser",
url => "https://blog.hospodarets.com/web-share-api",
},
{
title => "Phil Nash - The Web Share API",
url => "https://philna.sh/blog/2017/03/14/the-web-share-api/",
},
{
title => "Mozilla bug #1312422: Consider experimental support for Web Share API",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1312422",
},
{
title => "How to Use the Web Share API to Trigger the Native Dialog to Share Content & Pull Quotes",
url => "https://love2dev.com/blog/webshare-api/",
},
{
title => "Web.dev - Share like a native app with the Web Share API",
url => "https://web.dev/web-share/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1653481",
},
{
title => "W3C Demo",
url => "https://w3c.github.io/web-share/demos/share.html",
},
{
title => "Chromium support bug for macOS",
url => "https://bugs.chromium.org/p/chromium/issues/detail?id=1144920",
},
{
title => "Web Share API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Web_Share_API",
},
],
notes_by_num => {
1 => "Implemented old [Web Intents](https://dvcs.w3.org/hg/web-intents/raw-file/tip/spec/Overview-respec.html)",
2 => "[Android intent:// URLs](https://developer.chrome.com/docs/android/intents) can be used instead",
3 => "Only supported on Windows",
4 => "Only supported on Windows and Chrome OS",
5 => "Did not support share click that would trigger a [fetch call](https://bugs.webkit.org/show_bug.cgi?id=197779)",
},
spec => "https://www.w3.org/TR/web-share/",
stats => {
and_chr => { "2.1" => "n", "4.4.3-4.4.4" => "n #2" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 18 => "n #1", 25 => "n", 89 => "a #4", 128 => "y" },
edge => { "5.5" => "n", "81" => "a #3", "95" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "12.2-12.5" => "y #5", "14.0-14.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 114 => "y" },
safari => { "3.1" => "n", "12.1" => "y #5", "14" => "y" },
samsung => { "4" => "n", "5.0-5.4" => "n #2", "8.2" => "y" },
},
status => "cr",
title => "Web Share API",
ucprefix => 0,
},
"webauthn" => {
categories => ["Security"],
chrome_id => 5669923372138496,
description => "The Web Authentication API is an extension of the Credential Management API that enables strong authentication with public key cryptography, enabling password-less authentication and / or secure second-factor authentication without SMS texts.",
keywords => "fido,webauthn,webauthm",
links => [
{
title => "Web Authentication on MDN Web Docs",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Web_Authentication_API",
},
{
title => "Web Authentication and Windows Hello",
url => "https://docs.microsoft.com/en-us/microsoft-edge/dev-guide/device/web-authentication",
},
{
title => "Guide to Web Authentication",
url => "https://webauthn.guide",
},
],
notes_by_num => {
1 => "Can be enabled at `about:flags`\r\n\r\nEdge 13 used an earlier draft syntax. As of Edge 14 the implementation is prefixed and based on the FIDO 2.0 Web APIs.",
2 => "Can be enabled using the Develop > Experimental Features menu. Currently supports USB-based CTAP & CTAP2 HID devices.",
3 => "Can be enabled in Settings under the Safari > Advanced > Experimental Features menu.",
4 => "Partial support refers to FIDO2 devices not working in all operating systems if a PIN is set.",
5 => "Experimental feature not yet enabled in WKWebView-based browsers including Chrome for iOS.",
6 => "Partial support refers to TouchID not being supported.",
7 => "Does not support direct attestations",
},
spec => "https://www.w3.org/TR/webauthn/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "a #7" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 67 => "y" },
edge => { "5.5" => "n", "13" => "n d x #1", "18" => "y" },
firefox => { 2 => "n", 60 => "a #4 #6", 114 => "a #6" },
ie_mob => { 10 => "n" },
ios_saf => {
"13.2" => "n d #3",
"13.3" => "a #4 #5",
"14.0-14.4" => "a #5",
"14.5-14.8" => "y",
"3.2" => "n",
},
kaios => { "2.5" => "n", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 54 => "y" },
safari => { "3.1" => "n", "12.1" => "n d #2", "13" => "y" },
samsung => { "4" => "n", "17.0" => "y" },
},
status => "rec",
title => "Web Authentication API",
ucprefix => 0,
},
"webcodecs" => {
categories => ["JS API"],
chrome_id => 5669293909868544,
description => "API to provide more control over the encoding and decoding of audio, video, and images.",
keywords => "VideoDecoder,AudioDecoder,VideoEncoder,AudioEncoder,EncodedAudioChunk,EncodedVideoChunk,AudioData,VideoFrame,VideoColorSpace,ImageDecoder,ImageTrackList,ImageTrack",
links => [
{
title => "Explainer document",
url => "https://github.com/w3c/webcodecs/blob/main/explainer.md",
},
{
title => "Video processing with WebCodecs",
url => "https://web.dev/webcodecs/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=WebCodecs",
},
{
title => "WebCodecs API on MDN",
url => "https://developer.mozilla.org/en-US/docs/Web/API/WebCodecs_API",
},
{
title => "WebCodecs samples",
url => "https://w3c.github.io/webcodecs/samples/",
},
],
notes_by_num => { 1 => "Video-only support" },
spec => "https://w3c.github.io/webcodecs/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 94 => "y" },
edge => { "5.5" => "n", "94" => "y" },
firefox => { 2 => "n", 130 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "16.4" => "a #1" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 80 => "y" },
safari => { "16.4" => "a #1", "3.1" => "n", "TP" => "y" },
samsung => { "4" => "n", "17.0" => "y" },
},
status => "wd",
title => "WebCodecs API",
ucprefix => 0,
},
"webgl" => {
categories => ["Canvas"],
chrome_id => 6049512976023552,
description => "Method of generating dynamic 3D graphics using JavaScript, accelerated through hardware",
keywords => "web gl",
links => [
{
title => "Instructions on enabling WebGL",
url => "https://get.webgl.org/get-a-webgl-implementation/",
},
{
title => "Tutorial",
url => "https://www.khronos.org/webgl/wiki/Tutorial",
},
{
title => "Firefox blog post",
url => "https://hacks.mozilla.org/2009/12/webgl-draft-released-today/",
},
{
title => "Polyfill for IE",
url => "https://github.com/iewebgl/iewebgl",
},
],
notes => "WebGL support is dependent on GPU support and may not be available on older devices. This is due to the additional requirement for users to have [up to date video drivers](http://www.khronos.org/webgl/wiki/BlacklistsAndWhitelists).\r\n\r\nNote that WebGL is part of the [Khronos Group](http://www.khronos.org/webgl/), not the W3C.",
notes_by_num => {
1 => "WebGL context is accessed from \"experimental-webgl\" rather than \"webgl\"",
},
parent => "canvas",
spec => "https://www.khronos.org/registry/webgl/specs/1.0/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 8 => "y #1", 33 => "y" },
edge => { "5.5" => "n", "6" => "p", "11" => "y #1", "79" => "y" },
firefox => { 2 => "n", 4 => "y #1", 24 => "y" },
ie_mob => { 10 => "p", 11 => "y #1" },
ios_saf => { "3.2" => "n", "8" => "y" },
kaios => { "2.5" => "y #1", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 12 => "y" },
opera => { 9 => "n", 12 => "y #1", 19 => "y" },
safari => { "3.1" => "n", "5.1" => "y #1", "8" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "WebGL - 3D Canvas graphics",
ucprefix => 0,
},
"webgl2" => {
categories => ["Canvas"],
chrome_id => 6694359164518400,
description => "Next version of WebGL. Based on OpenGL ES 3.0.",
keywords => "web gl",
links => [
{
title => "Firefox blog post",
url => "https://blog.mozilla.org/futurereleases/2015/03/03/an-early-look-at-webgl-2/",
},
{
title => "Getting a WebGL Implementation",
url => "https://www.khronos.org/webgl/wiki/Getting_a_WebGL_Implementation",
},
],
notes_by_num => {
1 => "Can be enabled in Firefox by setting the about:config preference webgl.enable-prototype-webgl2 to true",
2 => "WebGL2 context is accessed from \"experimental-webgl2\" rather than \"webgl2\"",
3 => "Can be enabled in Chrome by passing the \"--enable-unsafe-es3-apis\" flag when starting the browser through the command line",
4 => "Can be enabled in the \"Experimental Features\" developer menu",
5 => "Enabled by default for Nightly and Dev Edition",
},
parent => "canvas",
spec => "https://www.khronos.org/registry/webgl/specs/latest/2.0/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 43 => "n d #3", 56 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 25 => "n d #1 #2", 42 => "n d #1", 45 => "n d #1 #5", 51 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "12.0-12.1" => "n d #4", "15.0-15.1" => "y", "3.2" => "n" },
kaios => { "2.5" => "n d #1 #5", "3.0-3.1" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 43 => "y" },
safari => { "3.1" => "n", "10.1" => "n d #4", "15" => "y" },
samsung => { "4" => "n", "7.2-7.4" => "y" },
},
status => "other",
title => "WebGL 2.0",
ucprefix => 0,
},
"webgpu" => {
categories => ["JS API"],
chrome_id => 6213121689518080,
description => "An API for complex rendering and compute, using hardware acceleration. Use cases include demanding 3D games and acceleration of scientific calculations. Meant to supersede WebGL.",
links => [
{
title => "Implementation status",
url => "https://github.com/gpuweb/gpuweb/wiki/Implementation-Status",
},
{
title => "Official Wiki",
url => "https://github.com/gpuweb/gpuweb/wiki",
},
{
title => "WebGPU test scene",
url => "https://toji.github.io/webgpu-test/",
},
],
notes_by_num => {
1 => "Can be enabled in Firefox with the `dom.webgpu.enabled` flag.",
2 => "Can be enabled in Safari with the `WebGPU` feature flag.",
3 => "Can be enabled in some Chromium browsers (on Windows, MacOS, Linux) with the `enable-unsafe-webgpu` flag.",
4 => "Part of an origin trial.",
5 => "Not enabled on Linux by default.",
},
spec => "https://gpuweb.github.io/gpuweb/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n d #1" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 80 => "n d #3", 94 => "n d #3 #4", 113 => "y #5" },
edge => { "5.5" => "n", "80" => "n d #3", "94" => "n d #3 #4", "113" => "y" },
firefox => { 2 => "n", 63 => "n d #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "17.4" => "n d #2" },
kaios => { "2.5" => "n", "3.0-3.1" => "n d #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y #5" },
opera => { 9 => "n", 73 => "n d #3", 99 => "y #5" },
safari => { "11.1" => "n d #2", "15" => "n", "17.4" => "n d #2", "3.1" => "n", "TP" => "y" },
samsung => { 4 => "n", 24 => "y" },
},
status => "wd",
title => "WebGPU",
ucprefix => 0,
},
"webhid" => {
categories => ["JS API"],
chrome_id => 5172464636133376,
description => "Enables raw access to HID (Human Interface Device) commands for all connected HIDs. Previously, an HID could only be accessed if the browser had implemented a custom API for the specific device.",
keywords => "hid,navigator.hid",
links => [
{
title => "Human interface devices on the web: a few quick examples",
url => "https://web.dev/hid-examples/",
},
],
notes_by_num => {},
spec => "https://wicg.github.io/webhid/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 78 => "n d", 89 => "y" },
edge => { "5.5" => "n", "79" => "n d", "89" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 66 => "n d", 76 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "WebHID API",
ucprefix => 0,
},
"webkit-user-drag" => {
categories => ["CSS"],
description => "The non-standard `-webkit-user-drag` CSS property can be used to either make an element draggable or explicitly non-draggable (like links and images). See the standardized [draggable attribute/property](/mdn-api_htmlelement_draggable) for the recommended alternative method of accomplishing the same functionality.",
keywords => "-webkit-user-drag:none,-webkit-user-drag:element,-webkit-user-drag:auto",
links => [
{
title => "Reference",
url => "https://css-infos.net/property/-webkit-user-drag",
},
],
notes => "Webkit and blink-based mobile browsers recognize the property but it does not appear to have any effect.\r\n\r\nThere is currently no unprefixed `user-drag` or other version of the property implemented in browsers or on a standards track as the HTML [draggable](/mdn-api_htmlelement_draggable) attribute/property is the preferred solution.",
notes_by_num => {
1 => "`-webkit-user-drag: none` works, but `-webkit-user-drag: element` does not appear to have an effect.",
},
spec => "https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266--webkit-user-drag",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "u", 16 => "a #1" },
edge => { "5.5" => "n", "79" => "a #1" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 15 => "a #1" },
safari => { "3.1" => "y" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "CSS -webkit-user-drag property",
ucprefix => 0,
},
"webm" => {
categories => ["Other"],
chrome_id => 6362186595172352,
description => "Multimedia format designed to provide a royalty-free, high-quality open video compression format for use with HTML5 video. WebM supports the video codec VP8 and VP9.",
keywords => "matroska",
links => [
{ title => "Official website", url => "https://www.webmproject.org" },
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/WebM",
},
],
notes_by_num => {
1 => "Older browser versions did not support all codecs.",
2 => "Older Edge versions did not support progressive sources.",
3 => "Can be enabled in Internet Explorer and Safari for MacOS by manually installing the codecs in the operating system.",
4 => "Supports [VP8 codec used in WebRTC](https://webkit.org/blog/8672).",
5 => "Supports [VP9 codec used in WebRTC](https://webkit.org/blog/10929) (off by default.)",
6 => "Supports [VP9 WebM used in MediaSource](https://bugs.webkit.org/show_bug.cgi?id=216652#c1) on [macOS Big Sur or later.](https://trac.webkit.org/changeset/264747/webkit)",
7 => "Safari 14.1 \x{2013} 15.6 has full support of WebM, but requires macOS 11.3 Big Sur or later.",
},
parent => "video",
spec => "https://www.webmproject.org",
stats => {
and_chr => { "2.1" => "n", "2.3" => "a #1", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 6 => "a #1", 25 => "y" },
edge => { "5.5" => "n", "9" => "p #3", "12" => "p", "14" => "a #1 #2", "79" => "y" },
firefox => { 2 => "n", 4 => "a #1", 28 => "y" },
ie_mob => { 10 => "p" },
ios_saf => {
"12.2-12.5" => "a #4",
"14.0-14.4" => "a #4 #5",
"17.4" => "y",
"3.2" => "n",
},
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { "9" => "n", "10.6" => "a #1", "16" => "y" },
safari => {
"3.1" => "n",
"3.2" => "p",
"6" => "p #3",
"12.1" => "a #4",
"14" => "a #4 #5 #6",
"14.1" => "a #7",
"16.0" => "y",
},
samsung => { "4" => "a #1", "5.0-5.4" => "y" },
},
status => "other",
title => "WebM video format",
ucprefix => 0,
},
"webnfc" => {
categories => ["JS API"],
chrome_id => 6261030015467520,
description => "This API allows a website to communicate with NFC tags through a device's NFC reader.",
keywords => "NDEF,NDEFReader,NDEFWriter",
links => [
{
title => "Safari position: Opposed",
url => "https://lists.webkit.org/pipermail/webkit-dev/2020-January/031007.html",
},
{
title => "Firefox position: Harmful",
url => "https://mozilla.github.io/standards-positions/#web-nfc",
},
{
title => "Web.dev article on using WebNFC",
url => "https://web.dev/nfc/",
},
],
notes => "Many devices are not equipped with NFC readers. They won't return any data, even though an installed browser might support this API.",
notes_by_num => {
1 => "Was experimentally supported in desktop Chromium browsers behind the `enable-experimental-web-platform-features` flag.",
2 => "Current implementations only allow communication through the NDEF protocol in order to minimize security and privacy issues.",
},
spec => "https://w3c.github.io/web-nfc/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 80 => "n d #1 #2", 89 => "n" },
edge => { "5.5" => "n", "80" => "n d #1 #2", "89" => "n" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 67 => "n d #1 #2", 76 => "n" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "unoff",
title => "Web NFC",
ucprefix => 0,
},
"webp" => {
categories => ["Other"],
chrome_id => "6471725441089536,4785074604081152",
description => "Image format (based on the VP8 video format) that supports lossy and lossless compression, as well as animation and alpha transparency. WebP generally has better compression than JPEG, PNG and GIF and is designed to supersede them. [AVIF](/avif) and [JPEG XL](/jpegxl) are designed to supersede WebP.",
keywords => "vp8,vp8l,libwebp,.webp",
links => [
{
title => "Official website",
url => "https://developers.google.com/speed/webp/",
},
{
title => "Official website FAQ - Which web browsers natively support WebP?",
url => "https://developers.google.com/speed/webp/faq#which_web_browsers_natively_support_webp",
},
{
title => "Bitsofcode - Why and how to use WebP images today",
url => "https://bitsofco.de/why-and-how-to-use-webp-images-today/",
},
{
title => "WebP decoder and encoder",
url => "https://github.com/webmproject/libwebp",
},
],
notes_by_num => {
1 => "Partial support refers to not supporting lossless, alpha and animated WebP images.",
2 => "Partial support refers to not supporting animated WebP images.",
3 => "Safari 14.0 \x{2013} 15.6 has full support of WebP, but requires macOS 11 Big Sur or later.",
},
spec => "https://developers.google.com/speed/webp/",
stats => {
and_chr => { "2.1" => "n", "4" => "a #1", "4.2-4.3" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 6 => "p", 9 => "a #1", 23 => "a #2", 32 => "y" },
edge => { "5.5" => "n", "18" => "y" },
firefox => { 2 => "n", 4 => "p", 65 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "14.0-14.4" => "y", "3.2" => "n" },
kaios => { "2.5" => "p", "3.0-3.1" => "y" },
op_mini => { all => "y" },
op_mob => { "10" => "n", "11" => "a #1", "11.1" => "y" },
opera => { "9" => "n", "10.6" => "p", "11.1" => "a #1", "12" => "a #2", "19" => "y" },
safari => { "3.1" => "n", "14" => "a #3", "16.0" => "y" },
samsung => { 4 => "y" },
},
status => "other",
title => "WebP image format",
ucprefix => 0,
},
"websockets" => {
categories => ["JS API"],
chrome_id => 6555138000945152,
description => "Bidirectional communication technology for web apps",
links => [
{
title => "Details on newer protocol",
url => "https://developer.chrome.com/blog/what-s-different-in-the-new-websocket-protocol/",
},
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/WebSocket",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-websockets",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/websocket",
},
{
title => "MDN Web Docs - WebSockets API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API",
},
],
notes => "Reported to be supported in some Android 4.x browsers, including Sony Xperia S, Sony TX and HTC.",
notes_by_num => {
1 => "Partial support in older browsers refers to the websockets implementation using an older version of the protocol and/or the implementation being disabled by default (due to security issues with the older protocol).",
2 => "Partial support in older browsers refers to lacking support for binary data.",
},
spec => "https://html.spec.whatwg.org/multipage/comms.html#network",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y #1", 10 => "y" },
chrome => { 4 => "a #1", 15 => "a #2", 16 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 4 => "a #1", 6 => "a x #2", 11 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "4.2-4.3" => "a #1", "6.0-6.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { "10" => "n", "11" => "a #1", "12.1" => "y" },
opera => { "9" => "n", "11" => "a #1", "12.1" => "y" },
safari => { "3.1" => "n", "5" => "a #1", "6" => "a #2", "7" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Web Sockets",
ucprefix => 1,
},
"webtransport" => {
categories => ["JS API"],
chrome_id => 4854144902889472,
description => "Protocol framework to send and receive data from servers using [HTTP3](/http3). Similar to [WebSockets](/websockets) but with support for multiple streams, unidirectional streams, out-of-order delivery, and reliable as well as unreliable transport.",
links => [
{ title => "web.dev article", url => "https://web.dev/webtransport/" },
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=1709355",
},
{
title => "Explainer with examples",
url => "https://github.com/w3c/webtransport/blob/main/explainer.md",
},
{
title => "WebKit position on WebTransport",
url => "https://github.com/WebKit/standards-positions/issues/18",
},
],
notes_by_num => {},
spec => "https://w3c.github.io/webtransport/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 91 => "n d", 95 => "n", 97 => "y" },
edge => { "5.5" => "n", "98" => "y" },
firefox => { 2 => "n", 114 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 83 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "18.0" => "y" },
},
status => "wd",
title => "WebTransport",
ucprefix => 0,
},
"webusb" => {
categories => ["JS API"],
chrome_id => 5651917954875392,
description => "Allows communication with devices via USB (Universal Serial Bus).",
links => [
{
title => "Google Developers article",
url => "https://developers.google.com/web/updates/2016/03/access-usb-devices-on-the-web",
},
{
title => "Mozilla Specification Positions: Harmful",
url => "https://mozilla.github.io/standards-positions/#webusb",
},
],
notes_by_num => {},
spec => "https://wicg.github.io/webusb/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 54 => "n d", 61 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 41 => "n d", 48 => "y" },
safari => { "3.1" => "n" },
samsung => { "4" => "n", "8.2" => "y" },
},
status => "unoff",
title => "WebUSB",
ucprefix => 0,
},
"webvr" => {
categories => ["JS API"],
chrome_id => 4532810371039232,
description => "API for accessing virtual reality (VR) devices, including sensors and head-mounted displays. Replaced by the [WebXR Device API](/webxr).",
keywords => "getvrdevices,getvrdisplays,getdisplays,navigator.vr",
links => [
{
title => "Detailed device support information",
url => "https://webvr.rocks/",
},
{
title => "WebVR polyfill",
url => "https://github.com/googlevr/webvr-polyfill",
},
{ title => "WebVR framework", url => "https://aframe.io" },
{ title => "WebVR info", url => "https://webvr.info/" },
{
title => "MDN Web Docs - WebVR API",
url => "https://developer.mozilla.org/en-US/docs/Web/API/WebVR_API",
},
{
title => "Chrome Platform Status for WebXR Device API",
url => "https://www.chromestatus.com/feature/5680169905815552",
},
],
notes => "For a WebVR experience a head mounted display (VR HMD) is required.",
notes_by_num => {
1 => "Available and enabled by default only in Firefox Windows. Enabled in Nightly for iOS. Firefox 73+ [requires a secure context using HTTPS](https://developer.mozilla.org/en-US/docs/Web/API/WebVR_API#API_availability)",
2 => "[Was in development](https://blogs.windows.com/msedgedev/2016/09/09/webvr-in-development-edge/#3lMW05DTZXbXcK46.97) in the latest Edge builds and supported only [Windows Mixed Reality](https://developer.microsoft.com/en-us/windows/mixed-reality).",
3 => "Supports only Samsung Galaxy devices with the Samsung Gear VR",
},
spec => "https://w3c.github.io/webvr/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 57 => "n d", 80 => "n" },
edge => { "5.5" => "n", "15" => "y #2", "79" => "n d", "80" => "n" },
firefox => { 2 => "n", 54 => "n d #1", 55 => "y #1" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 44 => "n d", 67 => "n" },
safari => { "3.1" => "n" },
samsung => { "4" => "y #3", "5.0-5.4" => "a #3" },
},
status => "unoff",
title => "WebVR API",
ucprefix => 0,
},
"webvtt" => {
categories => ["Other"],
chrome_id => 6719115557339136,
description => "Format for marking up text captions for multimedia resources.",
keywords => "captions,track,vtt,subtitles",
links => [
{
title => "Getting Started With the Track Element",
url => "https://www.html5rocks.com/en/tutorials/track/basics/",
},
{
title => "An Introduction to WebVTT and track",
url => "https://dev.opera.com/articles/view/an-introduction-to-webvtt-and-track/",
},
{
title => "MDN Web Docs - WebVTT",
url => "https://developer.mozilla.org/en-US/docs/Web/API/WebVTT_API",
},
],
notes => "WebVTT must be used with the [<track> element](/mdn-html_elements_track).",
notes_by_num => {
1 => "Firefox 31 - 54 lacks support for the `::cue` pseudo-element. [See bug #865395.](https://bugzilla.mozilla.org/show_bug.cgi?id=865395)",
2 => "Firefox 55+ implements `::cue` but still lacks support for the `::cue(<selector>)` pseudo-element with selector. [See bug #1321489.](https://bugzilla.mozilla.org/show_bug.cgi?id=1321489)",
},
parent => "video",
spec => "https://w3c.github.io/webvtt/",
stats => {
and_chr => { "2.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n", 10 => "y" },
chrome => { 4 => "n", 23 => "y" },
edge => { "5.5" => "n", "10" => "y" },
firefox => { 2 => "n", 24 => "n d", 31 => "y #1", 55 => "y #2" },
ie_mob => { 10 => "n", 11 => "y" },
ios_saf => { "3.2" => "n", "7.0-7.1" => "y" },
kaios => { "2.5" => "y #1" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "y" },
safari => { "3.1" => "n", "6" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "WebVTT - Web Video Text Tracks",
ucprefix => 0,
},
"webworkers" => {
categories => ["JS API"],
description => "Method of running scripts in the background, isolated from the web page",
links => [
{
title => "MDN Web Docs - Using Web Workers",
url => "https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers",
},
{
title => "Web Worker demo",
url => "https://nerget.com/rayjs-mt/rayjs.html",
},
{
title => "Polyfill for IE (single threaded)",
url => "https://code.google.com/archive/p/ie-web-worker/",
},
{
title => "Tutorial",
url => "https://code.tutsplus.com/tutorials/getting-started-with-web-workers--net-27667",
},
],
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/workers.html",
stats => {
and_chr => { "2.1" => "y", "2.2" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "6" => "p", "10" => "y" },
firefox => { "2" => "p", "3.5" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "p", 11 => "y" },
opera => { "10.0-10.1" => "p", "10.6" => "y", "9" => "n" },
safari => { "3.1" => "p", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Web Workers",
ucprefix => 0,
},
"webxr" => {
categories => ["JS API"],
chrome_id => 5680169905815552,
description => "API for accessing virtual reality (VR) and augmented reality (AR) devices, including sensors and head-mounted displays.",
keywords => "navigator.xr",
links => [
{
title => "MDN Web Docs - WebXR Device API",
url => "https://developer.mozilla.org/docs/Web/API/WebXR_Device_API",
},
{
title => "Immersive Web - WebXR samples",
url => "https://immersive-web.github.io/webxr-samples/",
},
{
title => "Safari implementation bug",
url => "https://bugs.webkit.org/show_bug.cgi?id=208988",
},
],
notes_by_num => {
1 => "This API is very extensive. Many of its features are still in development and/or don't have finalised specs yet.",
2 => "Can be enabled in Firefox behind the `dom.vr.webxr.enabled` flag.",
3 => "Can be enabled in Safari with the `WebXR Device API` experimental feature.",
},
spec => "https://www.w3.org/TR/webxr/",
stats => {
and_chr => { "2.1" => "n" },
and_ff => { 137 => "n d #2" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 65 => "n d", 79 => "a #1" },
edge => { "5.5" => "n", "79" => "a #1" },
firefox => { 2 => "n", 77 => "n d #2" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n", "3.0-3.1" => "n d #2" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "a #1" },
opera => { 9 => "n", 52 => "n d", 66 => "a #1" },
safari => { "3.1" => "n", "13" => "n d #3" },
samsung => { "4" => "n", "12.0" => "a #1" },
},
status => "cr",
title => "WebXR Device API",
ucprefix => 0,
},
"will-change" => {
categories => ["CSS"],
chrome_id => 5954199330226176,
description => "Method of optimizing animations by informing the browser which elements will change and what properties will change.",
keywords => "scroll-position",
links => [
{
title => "Detailed article",
url => "https://dev.opera.com/articles/css-will-change-property/",
},
{
title => "Blog post",
url => "https://aerotwist.com/blog/bye-bye-layer-hacks/",
},
{
title => "MDN Web Docs - will-change",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/will-change",
},
],
notes_by_num => {
1 => "Supported in Firefox behind the `layout.css.will-change.enabled` flag",
},
spec => "https://w3c.github.io/csswg-drafts/css-will-change/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 36 => "y" },
edge => { "5.5" => "n", "79" => "y" },
firefox => { 2 => "n", 29 => "n d #1", 36 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n", "9.3" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 24 => "y" },
safari => { "3.1" => "n", "9.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS will-change property",
ucprefix => 0,
},
"woff" => {
categories => ["Other"],
description => "Compressed TrueType/OpenType font that contains information about the font's source.",
keywords => ".woff",
links => [
{
title => "Mozilla hacks blog post",
url => "https://hacks.mozilla.org/2009/10/woff/",
},
],
notes_by_num => {
1 => "Reported to be supported in some modified versions of the Android 4.0 browser.",
},
parent => "fontface",
spec => "https://www.w3.org/TR/WOFF/",
stats => {
and_chr => { "2.1" => "n", "4" => "n #1", "4.1" => "n", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "n", 5 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { "2" => "n", "3.6" => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "n", "5.0-5.1" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 11 => "y" },
opera => { "9" => "n", "11.1" => "y" },
safari => { "3.1" => "n", "5.1" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "WOFF - Web Open Font Format",
ucprefix => 0,
},
"woff2" => {
categories => ["Other"],
chrome_id => 6718644721549312,
description => "TrueType/OpenType font that provides better compression than WOFF 1.0.",
keywords => ".woff2,fontface,webfonts",
links => [
{
title => "Basics about WOFF 2.0",
url => "https://gist.github.com/sergejmueller/cf6b4f2133bcb3e2f64a",
},
{
title => "WOFF 2.0 converter",
url => "https://everythingfonts.com/ttf-to-woff2",
},
],
notes_by_num => {
1 => "Supported only on Safari for Mac OS Sierra, not El Capitan & older.",
},
parent => "fontface",
spec => "https://www.w3.org/TR/WOFF2/",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "n" },
chrome => { 4 => "n", 36 => "y" },
edge => { "5.5" => "n", "14" => "y" },
firefox => { 2 => "n", 39 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "10.0-10.2" => "y", "3.2" => "n" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 23 => "y" },
safari => { "3.1" => "n", "10" => "a #1", "12" => "y" },
samsung => { 4 => "y" },
},
status => "rec",
title => "WOFF 2.0 - Web Open Font Format",
ucprefix => 0,
},
"word-break" => {
categories => ["CSS3"],
description => "Property to prevent or allow words to be broken over multiple lines between letters.",
keywords => "break-all,keep-all",
links => [
{
title => "MDN Web Docs - CSS word-break",
url => "https://developer.mozilla.org/en/CSS/word-break",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/word-break",
},
],
notes => "Partial support refers to supporting the `break-all` value, but not the `keep-all` value.\r\n\r\nChrome, Safari and other WebKit/Blink browsers also support the unofficial `break-word` value which is treated like `word-wrap: break-word`.",
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-text/#word-break",
stats => {
and_chr => { "2.1" => "a", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a" },
chrome => { 4 => "a", 44 => "y" },
edge => { "5.5" => "y" },
firefox => { 2 => "n", 15 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a", "9.0-9.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 80 => "y" },
opera => { 9 => "n", 15 => "a", 31 => "y" },
safari => { "3.1" => "a", "9" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 word-break",
ucprefix => 0,
},
"wordwrap" => {
categories => ["CSS3"],
description => "Allows lines to be broken within words if an otherwise unbreakable string is too long to fit. Currently mostly supported using the `word-wrap` property.",
keywords => "wordwrap,word-wrap,break-word",
links => [
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/css/properties/word-wrap",
},
{
title => "Bug on Firefox support",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=955857",
},
{
title => "MDN Web Docs - CSS overflow-wrap",
url => "https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap",
},
],
notes => "Partial support refers to requiring the legacy name \"word-wrap\" (rather than \"overflow-wrap\") to work.",
notes_by_num => {},
spec => "https://www.w3.org/TR/css3-text/#overflow-wrap",
stats => {
and_chr => { "2.1" => "a", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a", 10 => "y" },
chrome => { 4 => "a", 23 => "y" },
edge => { "5.5" => "a", "18" => "y" },
firefox => { "2" => "n", "3.5" => "a", "49" => "y" },
ie_mob => { 10 => "a" },
ios_saf => { "3.2" => "a", "7.0-7.1" => "y" },
kaios => { "2.5" => "a", "3.0-3.1" => "y" },
op_mini => { all => "a" },
op_mob => { 10 => "a", 80 => "y" },
opera => { "9" => "n", "10.5" => "a", "12.1" => "y" },
safari => { "3.1" => "a", "6.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "CSS3 Overflow-wrap",
ucprefix => 0,
},
"x-doc-messaging" => {
categories => ["JS API"],
chrome_id => 4786174115708928,
description => "Method of sending information from a page on one domain to a page on a different one (using postMessage)",
links => [
{
title => "MDN Web Docs - window.postMessage",
url => "https://developer.mozilla.org/en/DOM/window.postMessage",
},
{
title => "Simple demo",
url => "https://html5demos.com/postmessage2",
},
{
title => "has.js test",
url => "https://raw.github.com/phiggins42/has.js/master/detect/features.js#native-crosswindowmessaging",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/web-messaging/MessagePort/postMessage",
},
],
notes_by_num => {
1 => "Partial support refers to only working in frames/iframes (not other tabs/windows). Also, objects cannot be sent using postMessage.",
2 => "Partial support refers to [limitations in certain conditions](https://stackoverflow.com/questions/16226924/is-cross-origin-postmessage-broken-in-ie10).",
},
spec => "https://html.spec.whatwg.org/multipage/comms.html#crossDocumentMessages",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "8" => "a #1", "10" => "a #2", "12" => "y" },
firefox => { 2 => "n", 3 => "y" },
ie_mob => { 10 => "a" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { "9" => "n", "9.5-9.6" => "y" },
safari => { "3.1" => "n", "4" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "Cross-document messaging",
ucprefix => 0,
},
"x-frame-options" => {
categories => ["Security"],
chrome_id => 5760041927835648,
description => "An HTTP header which indicates whether the browser should allow the webpage to be displayed in a frame within another webpage. Used as a defense against clickjacking attacks.",
keywords => "x-frame-options,frame,options,header,clickjacking",
links => [
{
title => "X-Frame-Options Compatibility Test",
url => "https://erlend.oftedal.no/blog/tools/xframeoptions/",
},
{
title => "MDN Web Docs - X-Frame-Options",
url => "https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options",
},
{
title => "OWASP Clickjacking Defense Cheat Sheet",
url => "https://www.owasp.org/index.php/Clickjacking_Defense_Cheat_Sheet",
},
{
title => "Combating ClickJacking With X-Frame-Options - IEInternals",
url => "https://blogs.msdn.microsoft.com/ieinternals/2010/03/30/combating-clickjacking-with-x-frame-options/",
},
{
title => "IE8 Security Part VII: ClickJacking Defenses - IEBlog",
url => "https://blogs.msdn.microsoft.com/ie/2009/01/27/ie8-security-part-vii-clickjacking-defenses/",
},
],
notes => "Partial support refers to not supporting the `ALLOW-FROM` option.\r\nThe `X-Frame-Options` header has been obsoleted by [the `frame-ancestors` directive](https://www.w3.org/TR/CSP2/#directive-frame-ancestors) from Content Security Policy Level 2.",
notes_by_num => {},
spec => "https://tools.ietf.org/html/rfc7034",
stats => {
and_chr => { "2.1" => "u", "4" => "a" },
and_ff => { 137 => "a" },
and_qq => { "14.9" => "a" },
and_uc => { "15.5" => "a" },
baidu => { "13.52" => "a" },
bb => { 7 => "a" },
chrome => { 4 => "u", 26 => "a" },
edge => { "5.5" => "n", "8" => "y", "79" => "a" },
firefox => { 2 => "u", 4 => "a", 18 => "y", 70 => "a" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "u", "7.0-7.1" => "a" },
kaios => { "2.5" => "y", "3.0-3.1" => "a" },
op_mini => { all => "n" },
op_mob => { "10" => "u", "12.1" => "a" },
opera => { "9" => "u", "11.6" => "a" },
safari => { "3.1" => "u", "5.1" => "a" },
samsung => { 4 => "a" },
},
status => "other",
title => "X-Frame-Options HTTP header",
ucprefix => 0,
},
"xhr2" => {
categories => ["DOM", "JS API"],
description => "Updated functionality to the original XHR specification including things like file uploads, transfer progress information and the ability to send FormData. Previously known as [XMLHttpRequest Level 2](https://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/), these features now appear simply in the XMLHttpRequest spec.",
keywords => "xhr level 2",
links => [
{
title => "MDN Web Docs - FormData",
url => "https://developer.mozilla.org/en/XMLHttpRequest/FormData",
},
{
title => "Polyfill for FormData object",
url => "https://github.com/jimmywarting/FormData",
},
{
title => "WebPlatform Docs",
url => "https://webplatform.github.io/docs/apis/xhr/XMLHttpRequest",
},
],
notes => "See also support for the [FormData API](/mdn-api_formdata) and its sub-features, which received more updates since the original XHR Level 2 specification was released.",
notes_by_num => {
1 => "Partial support refers to not supporting `json` as `responseType`",
2 => "Partial support refers to not supporting `.timeout` and `.ontimeout`",
3 => "Partial support refers to not supporting `blob` as `responseType`",
4 => "Partial support refers to missing some newer `FormData` functionality (search for specific APIs for details).",
},
spec => "https://xhr.spec.whatwg.org/",
stats => {
and_chr => {
"135" => "y",
"2.1" => "n",
"3" => "a #1 #2 #3 #4",
"4.4" => "a #1 #2 #4",
"4.4.3-4.4.4" => "a #4",
},
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1 #2 #4", 10 => "a #1 #4" },
chrome => { 4 => "u", 7 => "a #1 #2 #4", 29 => "a #1 #4", 31 => "a #4", 50 => "y" },
edge => { "5.5" => "n", "10" => "a #1 #4", "12" => "a #4", "79" => "y" },
firefox => {
"2" => "n",
"3.5" => "a #1 #2 #3 #4",
"6" => "a #1 #2 #4",
"10" => "a #2 #4",
"12" => "a #4",
"47" => "y",
},
ie_mob => { 10 => "a #1 #4" },
ios_saf => {
"11.0-11.2" => "y",
"3.2" => "n",
"5.0-5.1" => "a #1 #2 #4",
"7.0-7.1" => "a #1 #4",
"8" => "a #4",
},
kaios => { "2.5" => "y" },
op_mini => { all => "n" },
op_mob => { 10 => "n", 12 => "a #4", 80 => "y" },
opera => { 9 => "n", 12 => "a #4", 15 => "a #1", 18 => "a #4", 37 => "y" },
safari => {
"3.1" => "n",
"5" => "a #1 #2 #4",
"6.1" => "a #1 #4",
"7.1" => "a #4",
"11.1" => "y",
},
samsung => { "4" => "a #4", "5.0-5.4" => "y" },
},
status => "ls",
title => "XMLHttpRequest advanced features",
ucprefix => 0,
},
"xhtml" => {
categories => ["Other"],
description => "A strict form of HTML, and allows embedding of other XML languages",
keywords => "xhtml+xml",
links => [
{ title => "Wikipedia", url => "https://en.wikipedia.org/wiki/XHTML" },
{
title => "Information on XHTML5",
url => "http://www.xmlplease.com/xhtml/xhtml5polyglot/",
},
],
notes => "The XHTML syntax is very close to HTML, and thus is almost always ([incorrectly](https://developer.mozilla.org/en-US/docs/XHTML#MIME_type_versus_DOCTYPE)) served as text/html on the web.",
notes_by_num => {},
spec => "https://html.spec.whatwg.org/multipage/xhtml.html#the-xhtml-syntax",
stats => {
and_chr => { "2.1" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "y" },
chrome => { 4 => "y" },
edge => { "5.5" => "n", "9" => "y" },
firefox => { 2 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "y" },
op_mob => { 10 => "y" },
opera => { 9 => "y" },
safari => { "3.1" => "y" },
samsung => { 4 => "y" },
},
status => "ls",
title => "XHTML served as application/xhtml+xml",
ucprefix => 0,
},
"xhtmlsmil" => {
categories => ["Other"],
description => "Method of using SMIL animation in web pages",
links => [
{
title => "Wikipedia",
url => "https://en.wikipedia.org/wiki/XHTML%2BSMIL",
},
{
title => "JS library to support XHTML+SMIL",
url => "https://leunen.me/fakesmile/",
},
],
notes => "Internet Explorer supports the W3C proposal HTML+TIME, which is largely the same as XHTML+SMIL",
notes_by_num => {},
parent => "xhtml",
spec => "https://www.w3.org/TR/XHTMLplusSMIL/",
stats => {
and_chr => { "2.1" => "p" },
and_ff => { 137 => "p" },
and_qq => { "14.9" => "p" },
and_uc => { "15.5" => "p" },
baidu => { "13.52" => "p" },
bb => { 7 => "p" },
chrome => { 4 => "p" },
edge => { "5.5" => "n", "6" => "a", "9" => "n", "79" => "p" },
firefox => { 2 => "p" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "p" },
kaios => { "2.5" => "p" },
op_mini => { all => "p" },
op_mob => { 10 => "p" },
opera => { 9 => "p" },
safari => { "3.1" => "p" },
samsung => { 4 => "p" },
},
status => "unoff",
title => "XHTML+SMIL animation",
ucprefix => 0,
},
"xml-serializer" => {
categories => ["DOM", "JS API"],
description => "Various DOM parsing and serializing functions, specifically `DOMParser`, `XMLSerializer`, `innerHTML`, `outerHTML` and `insertAdjacentHTML`.",
keywords => "parseFromString",
links => [
{
title => "MDN Web Docs - XMLSerializer",
url => "https://developer.mozilla.org/en-US/docs/XMLSerializer",
},
{
title => "Comparing Document Position by John Resig",
url => "https://johnresig.com/blog/dom-insertadjacenthtml/",
},
],
notes_by_num => {
1 => "Partial support refers to lacking support for `parseFromString` on the DOMParser.",
2 => "Partial support refers to supporting only `innerHTML`.",
3 => "Partial support refers to supporting only `innerHTML` and `insertAdjacentHTML`.",
},
spec => "https://www.w3.org/TR/DOM-Parsing/",
stats => {
and_chr => { "2.1" => "a #1", "4.4" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "y" },
and_uc => { "15.5" => "y" },
baidu => { "13.52" => "y" },
bb => { 7 => "a #1" },
chrome => { 4 => "a #1", 31 => "y" },
edge => { "5.5" => "a #2", "10" => "y" },
firefox => { 2 => "a #2", 8 => "a #3", 11 => "a #1", 12 => "y" },
ie_mob => { 10 => "y" },
ios_saf => { "3.2" => "a #1", "8" => "y" },
kaios => { "2.5" => "y" },
op_mini => { all => "a #1" },
op_mob => { 10 => "u", 11 => "a #1", 80 => "y" },
opera => { "10.0-10.1" => "a #1", "18" => "y", "9" => "u" },
safari => { "3.1" => "a #1", "7.1" => "y" },
samsung => { 4 => "y" },
},
status => "cr",
title => "DOM Parsing and Serialization",
ucprefix => 0,
},
"zstd" => {
categories => ["Other"],
chrome_id => 6186023867908096,
description => "Data compression method providing faster page loading while using less CPU power on the server.",
keywords => "RFC8878",
links => [
{
title => "Official Zstandard site",
url => "https://facebook.github.io/zstd/",
},
{
title => "Wikipedia article",
url => "https://en.wikipedia.org/wiki/Zstd",
},
{
title => "Support test",
url => "https://www.daniel.priv.no/tools/zstd-browser-test/",
},
{
title => "Firefox support bug",
url => "https://bugzilla.mozilla.org/show_bug.cgi?id=zstd",
},
{
title => "WebKit position on zstd",
url => "https://github.com/WebKit/standards-positions/issues/168",
},
],
notes_by_num => {
1 => "Enabled through the `enable-zstd-content-encoding` feature flag in `chrome://flags`",
},
spec => "https://datatracker.ietf.org/doc/html/rfc8878",
stats => {
and_chr => { "2.1" => "n", "135" => "y" },
and_ff => { 137 => "y" },
and_qq => { "14.9" => "n" },
and_uc => { "15.5" => "n" },
baidu => { "13.52" => "n" },
bb => { 7 => "n" },
chrome => { 4 => "n", 118 => "n d #1", 123 => "y" },
edge => { "5.5" => "n", "118" => "n d #1", "123" => "y" },
firefox => { 2 => "n", 126 => "y" },
ie_mob => { 10 => "n" },
ios_saf => { "3.2" => "n" },
kaios => { "2.5" => "n" },
op_mini => { all => "n" },
op_mob => { 10 => "n" },
opera => { 9 => "n", 109 => "y" },
safari => { "3.1" => "n" },
samsung => { 4 => "n" },
},
status => "other",
title => "zstd (Zstandard) content-encoding",
ucprefix => 0,
},
},
statuses => {
cr => "W3C Candidate Recommendation",
ls => "WHATWG Living Standard",
other => "Other",
pr => "W3C Proposed Recommendation",
rec => "W3C Recommendation",
unoff => "Unofficial / Note",
wd => "W3C Working Draft",
},
}