Implements support for the 12 new CSS viewport units introduced in htmlunit-cssparser 4.21.0: dynamic viewport (dvw, dvh, dvmin, dvmax), large viewport (lvw, lvh, lvmin, lvmax), and small viewport (svw, svh, svmin, svmax).
Changes
-
CssStyleSheet.java: Added switch cases for all 12 new viewport unit types in
pixelValue(), using the same 0.16f conversion factor as existing viewport units. Updated warning messages to include new units. -
CSSStyleDeclaration.java: Extended
setStyleLengthAttribute()to parse new viewport units:- 3-letter units: dvw, dvh, lvw, lvh, svw, svh
- 5-letter units: dvmin, dvmax, lvmin, lvmax, svmin, svmax
-
ComputedCSSStyleDeclarationTest.java: Added test coverage for all new viewport units plus previously untested vmin/vmax units (14 tests total).
Example usage:
.container { width: 100dvw; /* dynamic viewport width */ height: 50lvh; /* large viewport height */ min-width: 20svmin; /* small viewport minimum */ }
Warning
Firewall rules blocked me from connecting to one or more addresses (expand for details)I tried to connect to the following addresses, but was blocked by firewall rules:
central.sonatype.com- Triggering command:
/usr/lib/jvm/temurin-17-jdk-amd64/bin/java /usr/lib/jvm/temurin-17-jdk-amd64/bin/java --enable-native-access=ALL-UNNAMED -classpath /usr/share/apache-maven-3.9.11/boot/plexus-classworlds-2.9.0.jar -Dclassworlds.conf=/usr/share/apache-maven-3.9.11/bin/m2.conf -Dmaven.home=/usr/share/apache-maven-3.9.11 -Dlibrary.jansi.path=/usr/share/apache-maven-3.9.11/lib/jansi-native -Dmaven.multiModuleProjectDirectory=/home/REDACTED/work/htmlunit/htmlunit org.codehaus.plexus.classworlds.launcher.Launcher clean compile -DskipTests(dns block) - Triggering command:
/usr/lib/jvm/temurin-17-jdk-amd64/bin/java /usr/lib/jvm/temurin-17-jdk-amd64/bin/java --enable-native-access=ALL-UNNAMED -classpath /usr/share/apache-maven-3.9.11/boot/plexus-classworlds-2.9.0.jar -Dclassworlds.conf=/usr/share/apache-maven-3.9.11/bin/m2.conf -Dmaven.home=/usr/share/apache-maven-3.9.11 -Dlibrary.jansi.path=/usr/share/apache-maven-3.9.11/lib/jansi-native -Dmaven.multiModuleProjectDirectory=/home/REDACTED/work/htmlunit/htmlunit org.codehaus.plexus.classworlds.launcher.Launcher test -Dtest=ComputedCSSStyleDeclarationTest#fontSizeVW -q(dns block)
- Triggering command:
If you need me to access, download, or install something from one of these locations, you can either:
- Configure Actions setup steps to set up my environment, which run before the firewall is enabled
- Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)
Summary
The latest htmlunit-cssparser now supports the new CSS viewport units: dvw, dvh, dvmin, dvmax, lvw, lvh, lvmin, lvmax, svw, svh, svmin, svmax. These units need to be implemented in HtmlUnit alongside the existing viewport units (vw, vh, vmin, vmax).
Tasks
1. Add Implementation for New Viewport Units
File:
src/main/java/org/htmlunit/css/CssStyleSheet.javaIn the
pixelValue()method (around line 1464-1535), add switch cases for the new viewport units after the existing VMIN and VMAX cases:
- DVW, DVH, DVMIN, DVMAX (dynamic viewport)
- LVW, LVH, LVMIN, LVMAX (large viewport)
- SVW, SVH, SVMIN, SVMAX (small viewport)
Each should follow the same pattern as the existing VW, VH, VMIN, VMAX units (returning
0.16f * cssValue.getDoubleValue()).Also update the warning messages in this method to include all the new units.
File:
src/main/java/org/htmlunit/javascript/host/css/CSSStyleDeclaration.javaIn the
setStyleLengthAttribute()method (around lines 1991-2010), extend the unit parsing logic:
Add a new
else ifblock for 4-letter units after the existing 3-letter units check:else if (valueString.endsWith("dvw") || valueString.endsWith("dvh") || valueString.endsWith("lvw") || valueString.endsWith("lvh") || valueString.endsWith("svw") || valueString.endsWith("svh")) { unit = valueString.substring(valueString.length() - 3); valueString = valueString.substring(0, valueString.length() - 3); }Extend the existing 4-letter block (or create new) for 5-letter units:
else if (valueString.endsWith("dvmin") || valueString.endsWith("dvmax") || valueString.endsWith("lvmin") || valueString.endsWith("lvmax") || valueString.endsWith("svmin") || valueString.endsWith("svmax")) { unit = valueString.substring(valueString.length() - 5); valueString = valueString.substring(0, valueString.length() - 5); }2. Add Tests for All Viewport Units
File:
src/test/java/org/htmlunit/javascript/host/css/ComputedCSSStyleDeclarationTest.javaAdd comprehensive tests similar to the existing
fontSizeVH()andfontSizeVW()tests (around lines 1152-1235):
Add tests for existing units that are missing tests:
fontSizeVMin()- test with style='font-size: 0.6vmin;'fontSizeVMax()- test with style='font-size: 0.6vmax;'Add tests for all new viewport units:
fontSizeDVW()- dynamic viewport widthfontSizeDVH()- dynamic viewport heightfontSizeDVMin()- dynamic viewport minimumfontSizeDVMax()- dynamic viewport maximumfontSizeLVW()- large viewport widthfontSizeLVH()- large viewport heightfontSizeLVMin()- large viewport minimumfontSizeLVMax()- large viewport maximumfontSizeSVW()- small viewport widthfontSizeSVH()- small viewport heightfontSizeSVMin()- small viewport minimumfontSizeSVMax()- small viewport maximumEach test should follow this pattern:
@Test @Alerts(CHROME = "7.536px", EDGE = "7.488px", FF = "7.53333px", FF_ESR = "7.53333px") @HtmlUnitNYI(CHROME = "1px", EDGE = "1px", FF = "1px", FF_ESR = "1px") public void fontSizeUNIT() throws Exception { final String html = DOCTYPE_HTML + "<html><body>\n" + "<div id='d0' style='font-size: 0.6UNIT;'>\n" + "<div id='d1'>inside</div>\n" + "</div>\n" + "<script>\n" + LOG_TITLE_FUNCTION + " function getStyle(x) {\n" + " var d = document.getElementById(x);\n" + " var cs = window.getComputedStyle(d, null);\n" + " return cs;\n" + " }\n" + " var cs1 = getStyle('d1');\n" + " log(cs1.fontSize);\n" + "</script>\n" + "</body></html>"; loadPageVerifyTitle2(html); }Implementation Notes
- All new viewport units should use the same hardcoded default conversion as the existing viewport units (
0.16f * cssValue.getDoubleValue())- The order of parsing in
setStyleLengthAttribute()is important - check longer unit strings before shorter ones to avoid incorrect matches- Ensure all warning/log messages are updated to include the new units
- Follow the existing code style and patterns
References
- Existing implementation:
src/main/java/org/htmlunit/css/CssStyleSheet.javalines 1464-1535- Existing implementation:
src/main/java/org/htmlunit/javascript/host/css/CSSStyleDeclaration.javalines 1991-2010- Existing tests:
src/test/java/org/htmlunit/javascript/host/css/ComputedCSSStyleDeclarationTest.javalines 1152-1235
This pull request was created from Copilot chat.
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.