diff --git a/css/css-contain/container-queries/at-container-parsing.html b/css/css-contain/container-queries/at-container-parsing.html
index d0aef94de55eca..b0196b5e5a124c 100644
--- a/css/css-contain/container-queries/at-container-parsing.html
+++ b/css/css-contain/container-queries/at-container-parsing.html
@@ -136,6 +136,7 @@
test_condition_unknown('(asdf)');
test_condition_unknown('(resolution > 100dpi)');
test_condition_unknown('(resolution: 150dpi)');
+ test_condition_unknown('(resolution: calc(2x))');
test_condition_unknown('(color)');
test_condition_unknown('(min-color: 1)');
test_condition_unknown('(color-index >= 1)');
diff --git a/css/css-images/image-set/image-set-calc-x-rendering-2.html b/css/css-images/image-set/image-set-calc-x-rendering-2.html
new file mode 100644
index 00000000000000..b7c02fce25d45b
--- /dev/null
+++ b/css/css-images/image-set/image-set-calc-x-rendering-2.html
@@ -0,0 +1,16 @@
+
+
Image set calc x rendering
+
+
+
+
+
diff --git a/css/css-images/image-set/image-set-calc-x-rendering.html b/css/css-images/image-set/image-set-calc-x-rendering.html
new file mode 100644
index 00000000000000..a5444fd76901a4
--- /dev/null
+++ b/css/css-images/image-set/image-set-calc-x-rendering.html
@@ -0,0 +1,13 @@
+
+Image set calc x rendering
+
+
+
+
+
diff --git a/css/css-images/image-set/image-set-computed.sub.html b/css/css-images/image-set/image-set-computed.sub.html
index a25ca17835b5dc..6d54fd0d09b4ad 100644
--- a/css/css-images/image-set/image-set-computed.sub.html
+++ b/css/css-images/image-set/image-set-computed.sub.html
@@ -16,6 +16,32 @@
test_computed_value(property, "-webkit-" + specified, computed);
}
+function test_calculated_resolution_units() {
+ test_computed_value_variants(
+ 'background-image',
+ "image-set(url('http://{{host}}/example.png') calc(1x * 2))",
+ 'image-set(url("http://{{host}}/example.png") 2dppx)'
+ );
+
+ test_computed_value_variants(
+ 'background-image',
+ "image-set(url('http://{{host}}/example.png') calc(6dppx / 3))",
+ 'image-set(url("http://{{host}}/example.png") 2dppx)'
+ );
+
+ test_computed_value_variants(
+ 'background-image',
+ "image-set(url('http://{{host}}/example.png') calc(100dpi - 4dpi))",
+ 'image-set(url("http://{{host}}/example.png") 1dppx)'
+ );
+
+ test_computed_value_variants(
+ 'background-image',
+ "image-set(url('http://{{host}}/example.png') calc(37dpcm + 0.79532dpcm))",
+ 'image-set(url("http://{{host}}/example.png") 1dppx)'
+ );
+}
+
// The resolution unit is expected to be converted to the canonical unit 'dppx'
// for computed style.
test_computed_value_variants('background-image', "image-set(url(http://{{host}}/example.png) 1x)", 'image-set(url("http://{{host}}/example.png") 1dppx)');
@@ -33,4 +59,6 @@
// Unsupported type should still serialize.
test_computed_value_variants('background-image', 'image-set(url("http://{{host}}/example.png") type("image/unsupported"))', 'image-set(url("http://{{host}}/example.png") 1dppx type("image/unsupported"))');
test_computed_value_variants('background-image', 'image-set(url("http://{{host}}/example.png") 2x type("image/unsupported"), url("http://{{host}}/example.png") 1x type("image/unsupported"))', 'image-set(url("http://{{host}}/example.png") 2dppx type("image/unsupported"), url("http://{{host}}/example.png") 1dppx type("image/unsupported"))');
+
+test_calculated_resolution_units();
diff --git a/css/mediaqueries/match-media-parsing.html b/css/mediaqueries/match-media-parsing.html
index bbb326eb1893e0..c029f5494569f1 100644
--- a/css/mediaqueries/match-media-parsing.html
+++ b/css/mediaqueries/match-media-parsing.html
@@ -16,12 +16,20 @@
function test_resolution_parsing() {
test_parsing("(min-resolution: 1x)");
+ test_parsing("(min-resolution: calc(1x))", "(min-resolution: calc(1dppx))");
test_parsing("(resolution: 2x)");
+ test_parsing("(resolution: calc(2x))", "(resolution: calc(2dppx))");
test_parsing("(max-resolution: 7x)");
+ test_parsing("(max-resolution: calc(7x))", "(max-resolution: calc(7dppx))");
test_parsing("(resolution: 2dppx)");
test_parsing("(resolution: 600dpi)");
test_parsing("(resolution: 77dpcm)");
+
+ test_parsing("(resolution: calc(1x + 2x))", "(resolution: calc(3dppx))");
+ test_parsing("(resolution: calc(5x - 2x))", "(resolution: calc(3dppx))");
+ test_parsing("(resolution: calc(1x * 3))", "(resolution: calc(3dppx))");
+ test_parsing("(resolution: calc(6x / 2))", "(resolution: calc(3dppx))");
}
test_parsing("", "");
diff --git a/css/mediaqueries/mq-calc-resolution.html b/css/mediaqueries/mq-calc-resolution.html
new file mode 100644
index 00000000000000..da649eb753f4ca
--- /dev/null
+++ b/css/mediaqueries/mq-calc-resolution.html
@@ -0,0 +1,20 @@
+
+Test: support for calc resolution in Media Queries
+
+
+
+
+Test passes if there is a filled green square and no red.
+
diff --git a/css/mediaqueries/test_media_queries.html b/css/mediaqueries/test_media_queries.html
index fe3ba8195f9815..20fca4affd24e5 100644
--- a/css/mediaqueries/test_media_queries.html
+++ b/css/mediaqueries/test_media_queries.html
@@ -466,6 +466,7 @@
expression_should_be_known(feature + ": -3dpi");
expression_should_be_known(feature + ": 0dppx");
expression_should_be_known(feature + ": 0x");
+ expression_should_be_known(feature + ": calc(6x / 2)");
}
// Find the resolution using max-resolution