Don't set nsIFrame::mMayHaveRoundedCorners to false when there are non-zero percent borders, as we don't track all sizes that are passed to this function.
I _think_ most of the sizes that get here are going to be equivalent to
mRect.Size(), but that seems really hard to prove.
Differential Revision: https://phabricator.services.mozilla.com/D32754
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1554755
gecko-commit: 9c1c939712a679a06c8520e81f7d9db0d7de6b93
gecko-integration-branch: autoland
gecko-reviewers: mattwoodrow
diff --git a/css/css-backgrounds/border-radius-dynamic-from-no-radius-ref.html b/css/css-backgrounds/border-radius-dynamic-from-no-radius-ref.html
new file mode 100644
index 0000000..72ada88
--- /dev/null
+++ b/css/css-backgrounds/border-radius-dynamic-from-no-radius-ref.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<title>CSS Test Reference</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="author" title="Mozilla" href="https://mozilla.org">
+<style>
+ #outer {
+ width: 100px;
+ height: 100px;
+ }
+ #inner {
+ width: 100%;
+ height: 100%;
+ background: green;
+ border-radius: 50px;
+ }
+</style>
+<p>Should be a green circle below</p>
+<div id="outer">
+ <div id="inner"></div>
+</div>
diff --git a/css/css-backgrounds/border-radius-dynamic-from-no-radius.html b/css/css-backgrounds/border-radius-dynamic-from-no-radius.html
new file mode 100644
index 0000000..335548f
--- /dev/null
+++ b/css/css-backgrounds/border-radius-dynamic-from-no-radius.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<html class="reftest-wait">
+<title>CSS Test: Relative dynamic border-radius change</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="author" title="Mozilla" href="https://mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-radius">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1554755">
+<link rel="match" href="border-radius-dynamic-from-no-radius-ref.html">
+<style>
+ #outer {
+ width: 100px;
+ height: 100px;
+ }
+ #inner {
+ width: 100%;
+ height: 100%;
+ background: green;
+ /* The key is that this starts off computing to zero */
+ border-radius: calc(100% - 1px);
+ }
+</style>
+<p>Should be a green circle below</p>
+<div id="outer" style="width: 1px; height: 1px;">
+ <div id="inner"></div>
+</div>
+<script>
+onload = function() {
+ requestAnimationFrame(function() {
+ requestAnimationFrame(function() {
+ outer.style.height = "";
+ outer.style.width = "";
+ document.documentElement.className = "";
+ });
+ });
+}
+</script>
