Skip to content
This repository has been archived by the owner on Jul 30, 2022. It is now read-only.

Commit

Permalink
Bug 1658344 [wpt PR 24935] - Test some visual effects on MathML conte…
Browse files Browse the repository at this point in the history
…nt, a=testonly

Automatic update from web-platform-tests
Test some visual effects on MathML content (#24935)

See https://github.com/mathml-refresh/mathml/issues/179.
--

wpt-commits: 9b98f401e54a7acf9f2dc889318ee7c5d56c1263
wpt-pr: 24935
  • Loading branch information
rwlbuis authored and moz-wptsync-bot committed Sep 23, 2020
1 parent 620007c commit aed4b4c
Show file tree
Hide file tree
Showing 8 changed files with 136 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Blur filter (reference)</title>
</head>
<body>
<p>Rectangles should be blurred.</p>
<div style="background: green; filter: blur(5px); width: 200px; height: 200px;"></div>
<div style="background: green; filter: blur(5px); width: 200px; height: 200px; position: absolute; top: 300px"></div>
</div>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Blur filter</title>
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#css-styling">
<link rel="match" href="blur-filter-ref.html"/>
<meta name="assert" content="Verify that 'filter: blur' works on MathML elements.">
</head>
<body>
<p>Rectangles should be blurred.</p>
<div>
<math><mspace width="200px" height="200px" style="background: green; filter: blur(5px)"/></math>
</div>
<div style="position: absolute; top: 300px">
<math style="filter: blur(5px)"><mspace width="200px" height="200px" style="background: green"/></math>
</div>
<script src="/mathml/support/feature-detection.js"></script>
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mspace");</script>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Clip property (reference)</title>
</head>
<body>
<p>Rectangles should be clipped to a polygon.</p>
<div style="background: green; width: 200px; height: 200px; clip-path: polygon(10% 10%, 90% 10%, 90% 90%, 10% 90%)"></div>
<div style="background: green; width: 200px; height: 200px; position: absolute; top: 300px; clip-path: polygon(10% 10%, 90% 10%, 90% 90%, 10% 90%)"></div>
</div>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Clip property</title>
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#css-styling">
<link rel="match" href="clip-path-ref.html"/>
<meta name="assert" content="Verify that the clip property works on MathML elements.">
</head>
<body>
<p>Rectangles should be clipped to a polygon.</p>
<div>
<math><mspace width="200px" height="200px" style="background: green; clip-path: polygon(10% 10%, 90% 10%, 90% 90%, 10% 90%)"/></math>
</div>
<div style="position: absolute; top: 300px; width: 200px; height: 200px">
<math style="position: absolute; clip-path: polygon(10% 10%, 90% 10%, 90% 90%, 10% 90%)"><mspace width="200px" height="200px" style="background: green"/></math>
</div>
<script src="/mathml/support/feature-detection.js"></script>
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mspace");</script>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Clip property (reference)</title>
</head>
<body>
<p>Rectangles should be clipped.</p>
<div style="background: green; width: 200px; height: 200px; position: absolute; top: 100px; clip: rect(0px 100px 100px 0px)"></div>
<div style="background: green; width: 200px; height: 200px; position: absolute; top: 300px; clip: rect(0px 100px 100px 0px)"></div>
</div>
</body>
</html>
21 changes: 21 additions & 0 deletions testing/web-platform/tests/mathml/relations/css-styling/clip.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Clip property</title>
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#css-styling">
<link rel="match" href="clip-ref.html"/>
<meta name="assert" content="Verify that the clip property works on MathML elements.">
</head>
<body>
<p>Rectangles should be clipped.</p>
<div>
<math><mspace width="200px" height="200px" style="position:absolute; top:100px; background: green; clip: rect(0px 100px 100px 0px)"/></math>
</div>
<div style="position: absolute; top: 300px; width: 200px; height: 200px">
<math style="position: absolute; clip: rect(0px 100px 100px 0px)"><mspace width="200px" height="200px" style="background: green"/></math>
</div>
<script src="/mathml/support/feature-detection.js"></script>
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mspace");</script>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Transform property (reference)</title>
</head>
<body>
<p>Rectangles should be rotated.</p>
<div style="background: green; width: 200px; height: 200px; position: absolute; top: 100px; transform: rotate(90deg)"></div>
<div style="background: green; width: 200px; height: 200px; position: absolute; top: 300px; transform: rotate(90deg)"></div>
</div>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Transform property</title>
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#css-styling">
<link rel="match" href="transform-ref.html"/>
<meta name="assert" content="Verify that the transform property works on MathML elements.">
</head>
<body>
<p>Rectangles should be rotated.</p>
<div>
<math><mspace width="200px" height="200px" style="position:absolute; top:100px; background: green; transform: rotate(90deg)"/></math>
</div>
<div style="position: absolute; top: 300px; width: 200px; height: 200px">
<math style="position: absolute; transform: rotate(90deg)"><mspace width="200px" height="200px" style="background: green"/></math>
</div>
<script src="/mathml/support/feature-detection.js"></script>
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mspace");</script>
</body>
</html>

0 comments on commit aed4b4c

Please sign in to comment.