Implement viewport meta parsing with Device class integration and initial-scale support

[Copilot]

This PR implements comprehensive viewport meta tag parsing in HTMLMetaElement according to the MDN specification, with full integration into the client_cssom::Device class and initial-scale functionality.

Key Features

Viewport Meta Parsing

• Parses all standard viewport attributes: width, height, initial-scale, minimum-scale, maximum-scale, user-scalable
• Supports special keywords device-width and device-height
• Robust error handling for invalid values and malformed content
• Validates scale values within acceptable range (0.1-10.0)
• Handles various boolean formats (yes/no, 1/0, true/false)

Device Class Integration

• Added static device dimension fields (DeviceWidth, DeviceHeight, DeviceDepth) for proper device-width/device-height support
• Integrated viewport scaling properties with validation and clamping (0.1-10.0 range)
• Implemented initial-scale functionality that directly affects devicePixelRatio
• Enhanced setViewportWidth/setViewportHeight methods with device dimension flag support

Window Dimension Integration

• Automatically applies parsed width and height values using Device class methods
• Supports both explicit dimensions and device-width/device-height keywords with actual device dimensions
• Applies all scaling factors (initial-scale, minimum-scale, maximum-scale, user-scalable) through Device class
• Updates both inner and outer window dimensions consistently

Dynamic Updates

• Detects viewport meta tags during document parsing via Document::onNodeAdded
• Supports runtime updates when meta tag attributes change
• Handles multiple viewport meta tags gracefully

Example Usage

<!-- Sets window width to 640px and height to 480px -->
<meta name="viewport" content="width=640,height=480">

<!-- Uses actual device dimensions (1920x1080) with no user scaling -->
<meta name="viewport" content="width=device-width,height=device-height,user-scalable=no">

<!-- Complex viewport with scaling that affects devicePixelRatio -->
<meta name="viewport" content="width=320,initial-scale=2.0,maximum-scale=3.0,minimum-scale=0.5">

Implementation Details

• HTMLMetaElement: Added parseViewportMeta() method and viewport change notifications
• Device class: Added static device dimension fields and viewport scaling properties with proper validation
• Window class: Updated applyViewportMeta() method to use Device class methods for all viewport operations
• Document class: Added onViewportMetaChanged() handler and automatic detection in onNodeAdded

The implementation properly handles device dimensions using the actual device constants (1920x1080x400) and implements initial-scale functionality that affects the device pixel ratio for proper scaling behavior.

Testing

Comprehensive test coverage includes:

• Unit tests for viewport parsing logic (10 test cases)
• Integration tests for document workflow (4 test cases)
• Manual test fixture (fixtures/viewport-meta-test.html) for visual verification
• Edge case handling for invalid input, whitespace, and malformed content

Browser Compatibility

Follows MDN specification for viewport meta parsing with full backwards compatibility. The implementation handles edge cases gracefully and maintains existing window dimension behavior when no viewport meta is present.

Fixes #236.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[yorkie]

@copilot This could be implemented at client_cssom::Device(), you can add static fields DeviceWidth, DeviceHeight and DeviceDepth to represent the device size for such case: width=device-width.

[Copilot]

Implemented as requested. Added static DeviceWidth, DeviceHeight, and DeviceDepth fields to the client_cssom::Device class, and updated the device-width logic to use Device::DeviceWidth instead of placeholder comments. Commit f6b9e29.

[yorkie]

Ditto, implement this at client_cssom::Device().

[Copilot]

Implemented device-height logic using the client_cssom::Device class with the new static DeviceHeight field. The logic now properly uses device dimensions instead of placeholder comments. Commit f6b9e29.

[yorkie]

@copilot Please move the initial-scale, minimal-scale ... to the client_cssom::Device(), and implement the initial-scale at this PR.

[Copilot]

Moved all scaling factors (initial-scale, minimum-scale, maximum-scale, user-scalable) to the client_cssom::Device class and implemented the initial-scale functionality. The initial-scale now properly affects the devicePixelRatio when set. Commit f6b9e29.

[yorkie]

Suggested change

	// TODO: Add RPC call to notify about viewport size change
	// TODO(yorkie): Add RPC call to notify about viewport size change

[Copilot]

Updated the TODO comment format as suggested. Changed to use the TODO(yorkie): format for consistency. Commit f6b9e29.

[Copilot]

Just as a heads up, I was blocked by some firewall rules while working on your feedback. Expand below for details.

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:

• registry.npmmirror.com
  • Triggering command: npm ci (dns block)

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)