feat: add get_css_style tool

[samiyac]

Add get_css_styles tool which exposes matched styles and the CSS cascade to empower accurate CSS debugging workflows.

It integrates CssFormatter into McpPage and McpResponse, adding container query resolution and rule pagination support.

[OrKoN]

Thanks! Left a few comments on the overall approach.

[OrKoN]

A few comments from AI-review:

Code Style & Guidelines Compliance (AGENTS.md)

1. TypeScript Rules: as Keyword Usage

AGENTS.md specifies:

│ • Do not use as keyword for type casting.

In CssFormatter.test.ts, as unknown as ... is used repeatedly:

• createMockNode: as unknown as DevTools.DOMModel.DOMNode
• createMockProperty: as unknown as StyleProperty
• createMockStyle: as unknown as NodeStyle
• createMockMatchedStyles: as unknown as MatchedStyles

2. Mocking Guidelines

AGENTS.md specifies:

│
│ • Use sinon.createStubInstance(Class): Do not hand-roll mock objects or define custom mock interfaces.
│ • Centralize mocks in tests/mocks.ts.

In CssFormatter.test.ts, mock factories (createMockMatchedStyles, createMockRule, createMockStyle, createMockProperty) are hand-rolled using Object.create(Prototype) and contain simulated state logic (e.g.
isInherited: (style) => inheritedStylesSet.has(style)). They should leverage sinon.createStubInstance().
──────

Test Suite Performance

In McpPage.test.ts:

• There are 4 separate withMcpContext tests:
1. retrieves matched styles for a page element
2. retrieves matched styles for nodes inside open shadow roots
3. retrieves matched styles for nodes inside closed shadow roots
4. retrieves matched styles for nodes inside iframes
• Each test launches a separate Chromium process, opens a route, and creates a snapshot.
• Suggestion: Combine these test cases into a single HTML route (containing regular elements, open shadow root, closed shadow root, and an iframe). Testing all 4 scenarios in one browser session could save
multiple seconds on test execution.