diff options
| author | Rodrigo Arias Mallo <rodarima@gmail.com> | 2024-08-16 22:39:37 +0200 |
|---|---|---|
| committer | Rodrigo Arias Mallo <rodarima@gmail.com> | 2024-10-17 20:38:16 +0200 |
| commit | 51e023b7eb12e87a172e1d60e62ecc7448eff836 (patch) | |
| tree | 5af6199ad9d18a928507fd20798447c573897d5a /test/html/render | |
| parent | df3ed4822cbbdb7c5553ad9f03ecdbd53654aa65 (diff) | |
Add more image aspect ratio tests
Diffstat (limited to 'test/html/render')
| -rw-r--r-- | test/html/render/img-aspect-ratio-mix-border.html | 42 | ||||
| -rw-r--r-- | test/html/render/img-aspect-ratio-mix-border.ref.html | 42 | ||||
| -rw-r--r-- | test/html/render/img-aspect-ratio-mix-margin.html | 42 | ||||
| -rw-r--r-- | test/html/render/img-aspect-ratio-mix-margin.ref.html | 42 | ||||
| -rw-r--r-- | test/html/render/img-aspect-ratio-mix.html (renamed from test/html/render/img-max-bounds.html) | 0 | ||||
| -rw-r--r-- | test/html/render/img-aspect-ratio-mix.ref.html (renamed from test/html/render/img-max-bounds.ref.html) | 0 |
6 files changed, 168 insertions, 0 deletions
diff --git a/test/html/render/img-aspect-ratio-mix-border.html b/test/html/render/img-aspect-ratio-mix-border.html new file mode 100644 index 00000000..38cd25e8 --- /dev/null +++ b/test/html/render/img-aspect-ratio-mix-border.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> + <head> + <title>Test image aspect ratio while constrained</title> + <style> + body {margin: 20px} + div {width: 640px; height: 640px; background: lightblue;} + img {border: 10px solid green} + </style> + </head> + <body> + <div> + <p>All images should be 32px by 32px like this one:</p> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Only one max-* contraint</p> + <img src="pic.png" style="max-width :32px;"> + <img src="pic.png" style="max-height:32px;"> + <img src="pic.png" style="max-width :5%;"> + <img src="pic.png" style="max-height:5%;"> + <p>One max-* and fixed size contraint</p> + <img src="pic.png" style="height:32px; max-width:256px"> + <img src="pic.png" style="height:5%; max-width:256px"> + <img src="pic.png" style="max-height:256px; width:32px"> + <img src="pic.png" style="max-height:256px; width:5%"> + <p>Two max-* contraints</p> + <img src="pic.png" style="max-height:32px; max-width:256px"> + <img src="pic.png" style="max-height:5%; max-width:256px"> + <img src="pic.png" style="max-height:256px; max-width:32px"> + <img src="pic.png" style="max-height:256px; max-width:5%"> + <p>Both min-* and max-* constrained</p> + <img src="pic.png" style="min-width:32px; min-height:16px; max-width:32px; max-height:64px"> + <img src="pic.png" style="min-width:5%; min-height:16px; max-width:5%; max-height:64px"> + <img src="pic.png" style="min-width:16px; min-height:32px; max-width:64px; max-height:32px"> + <img src="pic.png" style="min-width:16px; min-height:5%; max-width:64px; max-height:5%"> + <p>Bad constraints</p> + <img src="pic.png" style="max-width: 16px; min-width: 32px;"> + <img src="pic.png" style="max-height:16px; min-height:32px;"> + <img src="pic.png" style="max-width: 16px; min-width: 5%;"> + <img src="pic.png" style="max-height:16px; min-height:5%;"> + </div> + </body> +</html> diff --git a/test/html/render/img-aspect-ratio-mix-border.ref.html b/test/html/render/img-aspect-ratio-mix-border.ref.html new file mode 100644 index 00000000..775c8cb2 --- /dev/null +++ b/test/html/render/img-aspect-ratio-mix-border.ref.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> + <head> + <title>Test image aspect ratio while constrained</title> + <style> + body {margin: 20px} + div {width: 640px; height: 640px; background: lightblue;} + img {border: 10px solid green} + </style> + </head> + <body> + <div> + <p>All images should be 32px by 32px like this one:</p> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Only one max-* contraint</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>One max-* and fixed size contraint</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Two max-* contraints</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Both min-* and max-* constrained</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Bad constraints</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + </div> + </body> +</html> diff --git a/test/html/render/img-aspect-ratio-mix-margin.html b/test/html/render/img-aspect-ratio-mix-margin.html new file mode 100644 index 00000000..af06cd76 --- /dev/null +++ b/test/html/render/img-aspect-ratio-mix-margin.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> + <head> + <title>Test image aspect ratio while constrained</title> + <style> + body {margin: 20px} + div {width: 640px; height: 640px; background: lightblue;} + img {margin: 10px} + </style> + </head> + <body> + <div> + <p>All images should be 32px by 32px like this one:</p> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Only one max-* contraint</p> + <img src="pic.png" style="max-width :32px;"> + <img src="pic.png" style="max-height:32px;"> + <img src="pic.png" style="max-width :5%;"> + <img src="pic.png" style="max-height:5%;"> + <p>One max-* and fixed size contraint</p> + <img src="pic.png" style="height:32px; max-width:256px"> + <img src="pic.png" style="height:5%; max-width:256px"> + <img src="pic.png" style="max-height:256px; width:32px"> + <img src="pic.png" style="max-height:256px; width:5%"> + <p>Two max-* contraints</p> + <img src="pic.png" style="max-height:32px; max-width:256px"> + <img src="pic.png" style="max-height:5%; max-width:256px"> + <img src="pic.png" style="max-height:256px; max-width:32px"> + <img src="pic.png" style="max-height:256px; max-width:5%"> + <p>Both min-* and max-* constrained</p> + <img src="pic.png" style="min-width:32px; min-height:16px; max-width:32px; max-height:64px"> + <img src="pic.png" style="min-width:5%; min-height:16px; max-width:5%; max-height:64px"> + <img src="pic.png" style="min-width:16px; min-height:32px; max-width:64px; max-height:32px"> + <img src="pic.png" style="min-width:16px; min-height:5%; max-width:64px; max-height:5%"> + <p>Bad constraints</p> + <img src="pic.png" style="max-width: 16px; min-width: 32px;"> + <img src="pic.png" style="max-height:16px; min-height:32px;"> + <img src="pic.png" style="max-width: 16px; min-width: 5%;"> + <img src="pic.png" style="max-height:16px; min-height:5%;"> + </div> + </body> +</html> diff --git a/test/html/render/img-aspect-ratio-mix-margin.ref.html b/test/html/render/img-aspect-ratio-mix-margin.ref.html new file mode 100644 index 00000000..36207ab6 --- /dev/null +++ b/test/html/render/img-aspect-ratio-mix-margin.ref.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> + <head> + <title>Test image aspect ratio while constrained</title> + <style> + body {margin: 20px} + div {width: 640px; height: 640px; background: lightblue;} + img {margin: 10px} + </style> + </head> + <body> + <div> + <p>All images should be 32px by 32px like this one:</p> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Only one max-* contraint</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>One max-* and fixed size contraint</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Two max-* contraints</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Both min-* and max-* constrained</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <p>Bad constraints</p> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + <img src="pic.png" style="width:32px;height:32px;"> + </div> + </body> +</html> diff --git a/test/html/render/img-max-bounds.html b/test/html/render/img-aspect-ratio-mix.html index 8adc2867..8adc2867 100644 --- a/test/html/render/img-max-bounds.html +++ b/test/html/render/img-aspect-ratio-mix.html diff --git a/test/html/render/img-max-bounds.ref.html b/test/html/render/img-aspect-ratio-mix.ref.html index 464767dd..464767dd 100644 --- a/test/html/render/img-max-bounds.ref.html +++ b/test/html/render/img-aspect-ratio-mix.ref.html |