1 files changed, 40 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-box/margin-trim/flex-row-style-change-triggers-layout-inline-end.html b/testing/web-platform/tests/css/css-box/margin-trim/flex-row-style-change-triggers-layout-inline-end.html
new file mode 100644
index 0000000000..c17e043548
--- /dev/null
+++ b/testing/web-platform/tests/css/css-box/margin-trim/flex-row-style-change-triggers-layout-inline-end.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+<head>
+<link rel="author" href="mailto:sammy.gill@apple.com">
+<link rel="help" href="https://drafts.csswg.org/css-box-4/#margin-trim-flex">
+<meta name="assert" content="Flex items react to change in their flexbox's margin-trim value">
+<link rel="match" href="flex-row-style-change-triggers-layout-inline-end-ref.html">
+<style>
+flexbox {
+    display: flex;
+    width: min-content;
+    flex-wrap: wrap;
+    border: 1px solid black;
+}
+.initial-margin-trim {
+    margin-trim: inline-end;
+}
+item {
+    display: block;
+    background-color: green;
+    width: 50px;
+    height: 50px;
+    margin-inline-end: 10px;
+}
+</style>
+</head>
+<body>
+    <flexbox id="to-no-margin-trim" class="initial-margin-trim">
+        <item></item>
+    </flexbox>
+    <flexbox id="to-margin-trim">
+        <item></item>
+    </flexbox>
+</body>
+<script>
+document.body.offsetHeight;
+document.getElementById("to-no-margin-trim").style["margin-trim"] = "none";
+document.getElementById("to-margin-trim").style["margin-trim"] = "inline-end";
+</script>
+</html>