Query layout to resolve canvas font property value

components/script/canvas_state.rs

@@ -1006,6 +1006,16 @@ impl CanvasState {
         )
     }
 
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-font
+    pub fn set_font(&self, _canvas: Option<&HTMLCanvasElement>, _value: DOMString) {
+        unimplemented!()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-font
+    pub fn font(&self) -> DOMString {
+        unimplemented!()
+    }
+
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
     pub fn line_width(&self) -> f64 {
         self.state.borrow().line_width

components/script/dom/canvasrenderingcontext2d.rs

@@ -297,6 +297,17 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         self.canvas_state.measure_text(&self.global(), text)
     }
 
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-font
+    fn Font(&self) -> DOMString {
+        self.canvas_state.font()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-font
+    fn SetFont(&self, value: DOMString) {
+        self.canvas_state
+            .set_font(self.canvas.as_ref().map(|c| &**c), value)
+    }
+
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
     fn DrawImage(&self, image: CanvasImageSource, dx: f64, dy: f64) -> ErrorResult {
         self.canvas_state

components/script/dom/offscreencanvasrenderingcontext2d.rs

@@ -257,6 +257,17 @@ impl OffscreenCanvasRenderingContext2DMethods for OffscreenCanvasRenderingContex
         self.canvas_state.measure_text(&self.global(), text)
     }
 
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-font
+    fn Font(&self) -> DOMString {
+        self.canvas_state.font()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-font
+    fn SetFont(&self, value: DOMString) {
+        self.canvas_state
+            .set_font(self.htmlcanvas.as_ref().map(|c| &**c), value)
+    }
+
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
     fn LineWidth(&self) -> f64 {
         self.canvas_state.line_width()

components/script/dom/webidls/CanvasRenderingContext2D.webidl

@@ -211,7 +211,7 @@ interface mixin CanvasPathDrawingStyles {
 [Exposed=(PaintWorklet, Window, Worker)]
 interface mixin CanvasTextDrawingStyles {
   // text
-  //attribute DOMString font; // (default 10px sans-serif)
+  attribute DOMString font; // (default 10px sans-serif)
   //attribute CanvasTextAlign textAlign; // "start", "end", "left", "right", "center" (default: "start")
   //attribute CanvasTextBaseline textBaseline; // "top", "hanging", "middle", "alphabetic",
                                       // "ideographic", "bottom" (default: "alphabetic")

components/script/dom/window.rs

@@ -118,6 +118,7 @@ use script_traits::{
 };
 use script_traits::{TimerSchedulerMsg, WebrenderIpcSender, WindowSizeData, WindowSizeType};
 use selectors::attr::CaseSensitivity;
+use servo_arc::Arc as ServoArc;
 use servo_geometry::{f32_rect_to_au_rect, MaxRect};
 use servo_url::{ImmutableOrigin, MutableOrigin, ServoUrl};
 use std::borrow::Cow;
@@ -136,7 +137,7 @@ use style::dom::OpaqueNode;
 use style::error_reporting::{ContextualParseError, ParseErrorReporter};
 use style::media_queries;
 use style::parser::ParserContext as CssParserContext;
-use style::properties::PropertyId;
+use style::properties::{ComputedValues, PropertyId, ShorthandId};
 use style::selector_parser::PseudoElement;
 use style::str::HTML_SPACE_CHARACTERS;
 use style::stylesheets::CssRuleType;
@@ -1847,6 +1848,21 @@ impl Window {
         )
     }
 
+    pub fn parse_font_query(&self, node: &Node, value: String) -> Option<ServoArc<ComputedValues>> {
+        if !node.is_connected() {
+            return None;
+        }
+        let id = PropertyId::Shorthand(ShorthandId::Font);
+        if !self.layout_reflow(QueryMsg::ParseFontQuery(
+            node.to_trusted_node_address(),
+            id,
+            value,
+        )) {
+            return None;
+        }
+        self.layout_rpc.parsed_font()
+    }
+
     pub fn layout(&self) -> &dyn LayoutRPC {
         &*self.layout_rpc
     }
@@ -2504,6 +2520,7 @@ fn debug_reflow_events(id: PipelineId, reflow_goal: &ReflowGoal, reason: &Reflow
             &QueryMsg::StyleQuery => "\tStyleQuery",
             &QueryMsg::TextIndexQuery(..) => "\tTextIndexQuery",
             &QueryMsg::ElementInnerTextQuery(_) => "\tElementInnerTextQuery",
+            &QueryMsg::ParseFontQuery(..) => "\nParseFontQuery",
             &QueryMsg::InnerWindowDimensionsQuery(_) => "\tInnerWindowDimensionsQuery",
         },
     };