Skip to main content

script/dom/html/
htmlstyleelement.rs

1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
4
5use std::cell::Cell;
6use std::sync::atomic::{AtomicBool, Ordering};
7
8use dom_struct::dom_struct;
9use html5ever::{LocalName, Prefix, local_name};
10use js::context::JSContext;
11use js::rust::HandleObject;
12use net_traits::ReferrerPolicy;
13use script_bindings::cell::DomRefCell;
14use script_bindings::root::Dom;
15use servo_arc::Arc;
16use style::media_queries::MediaList as StyleMediaList;
17use style::stylesheets::{Stylesheet, StylesheetInDocument, UrlExtraData};
18use stylo_atoms::Atom;
19
20use crate::dom::bindings::codegen::Bindings::DOMTokenListBinding::DOMTokenList_Binding::DOMTokenListMethods;
21use crate::dom::bindings::codegen::Bindings::HTMLStyleElementBinding::HTMLStyleElementMethods;
22use crate::dom::bindings::codegen::Bindings::NodeBinding::NodeMethods;
23use crate::dom::bindings::inheritance::Castable;
24use crate::dom::bindings::root::{DomRoot, MutNullableDom};
25use crate::dom::bindings::str::DOMString;
26use crate::dom::csp::{CspReporting, InlineCheckType};
27use crate::dom::css::cssstylesheet::CSSStyleSheet;
28use crate::dom::css::stylesheet::StyleSheet as DOMStyleSheet;
29use crate::dom::css::stylesheetcontentscache::{
30    StylesheetContentsCache, StylesheetContentsCacheKey,
31};
32use crate::dom::document::Document;
33use crate::dom::documentorshadowroot::StylesheetSource;
34use crate::dom::domtokenlist::DOMTokenList;
35use crate::dom::element::attributes::storage::AttrRef;
36use crate::dom::element::{AttributeMutation, Element, ElementCreator};
37use crate::dom::html::htmlelement::HTMLElement;
38use crate::dom::medialist::MediaList;
39use crate::dom::node::virtualmethods::VirtualMethods;
40use crate::dom::node::{BindContext, ChildrenMutation, Node, NodeTraits, UnbindContext};
41use crate::script_runtime::CanGc;
42use crate::stylesheet_loader::StylesheetOwner;
43
44#[dom_struct]
45pub(crate) struct HTMLStyleElement {
46    htmlelement: HTMLElement,
47    #[conditional_malloc_size_of]
48    #[no_trace]
49    stylesheet: DomRefCell<Option<Arc<Stylesheet>>>,
50    #[no_trace]
51    stylesheetcontents_cache_key: DomRefCell<Option<StylesheetContentsCacheKey>>,
52    cssom_stylesheet: MutNullableDom<CSSStyleSheet>,
53    /// <https://html.spec.whatwg.org/multipage/#a-style-sheet-that-is-blocking-scripts>
54    parser_inserted: Cell<bool>,
55    in_stack_of_open_elements: Cell<bool>,
56    pending_loads: Cell<u32>,
57    any_failed_load: Cell<bool>,
58    /// <https://html.spec.whatwg.org/multipage/#dom-style-blocking>
59    blocking: MutNullableDom<DOMTokenList>,
60}
61
62impl HTMLStyleElement {
63    fn new_inherited(
64        local_name: LocalName,
65        prefix: Option<Prefix>,
66        document: &Document,
67        creator: ElementCreator,
68    ) -> HTMLStyleElement {
69        HTMLStyleElement {
70            htmlelement: HTMLElement::new_inherited(local_name, prefix, document),
71            stylesheet: DomRefCell::new(None),
72            stylesheetcontents_cache_key: DomRefCell::new(None),
73            cssom_stylesheet: MutNullableDom::new(None),
74            parser_inserted: Cell::new(creator.is_parser_created()),
75            in_stack_of_open_elements: Cell::new(creator.is_parser_created()),
76            pending_loads: Cell::new(0),
77            any_failed_load: Cell::new(false),
78            blocking: Default::default(),
79        }
80    }
81
82    pub(crate) fn new(
83        cx: &mut JSContext,
84        local_name: LocalName,
85        prefix: Option<Prefix>,
86        document: &Document,
87        proto: Option<HandleObject>,
88        creator: ElementCreator,
89    ) -> DomRoot<HTMLStyleElement> {
90        Node::reflect_node_with_proto(
91            cx,
92            Box::new(HTMLStyleElement::new_inherited(
93                local_name, prefix, document, creator,
94            )),
95            document,
96            proto,
97        )
98    }
99
100    #[inline]
101    fn create_media_list(&self, mq_str: &str) -> StyleMediaList {
102        MediaList::parse_media_list(mq_str, &self.owner_window())
103    }
104
105    /// <https://html.spec.whatwg.org/multipage/#update-a-style-block>
106    pub(crate) fn update_a_style_block(&self, cx: &mut JSContext) {
107        // Step 1. Let element be the style element.
108        //
109        // That's self
110
111        // Step 2. If element has an associated CSS style sheet, remove the CSS style sheet in question.
112        self.remove_stylesheet();
113
114        // Step 3. If element is not connected, then return.
115        let node = self.upcast::<Node>();
116        if !node.is_connected() {
117            return;
118        }
119        assert!(
120            node.is_in_a_document_tree() || node.is_in_a_shadow_tree(),
121            "This stylesheet does not have an owner, so there's no reason to parse its contents"
122        );
123
124        // Step 4. If element's type attribute is present and its value is neither the empty string
125        // nor an ASCII case-insensitive match for "text/css", then return.
126        let mut type_attribute = self.Type();
127        type_attribute.make_ascii_lowercase();
128        if !type_attribute.is_empty() && type_attribute != "text/css" {
129            return;
130        }
131
132        // Step 5: If the Should element's inline behavior be blocked by Content Security Policy? algorithm
133        // returns "Blocked" when executed upon the style element, "style",
134        // and the style element's child text content, then return. [CSP]
135        let doc = self.owner_document();
136        let global = &self.owner_global();
137        if global
138            .get_csp_list()
139            .should_elements_inline_type_behavior_be_blocked(
140                cx,
141                global,
142                self.upcast(),
143                InlineCheckType::Style,
144                &node.child_text_content().str(),
145                doc.get_current_parser_line(),
146            )
147        {
148            return;
149        }
150
151        // Step 6. Create a CSS style sheet with the following properties:
152        let data = node
153            .GetTextContent()
154            .expect("Element.textContent must be a string");
155        let shared_lock = node.owner_doc().style_shared_author_lock().clone();
156        let mq = Arc::new(shared_lock.wrap(self.create_media_list(&self.Media().str())));
157
158        // For duplicate style sheets with identical content, `StylesheetContents` can be reused
159        // to avoid reedundant parsing of the style sheets. Additionally, the cache hit rate of
160        // stylo's `CascadeDataCache` can now be significantly improved. When shared `StylesheetContents`
161        // is modified, copy-on-write will occur, see `CSSStyleSheet::will_modify`.
162        let (cache_key, contents) = StylesheetContentsCache::get_or_insert_with(
163            &data.str(),
164            &shared_lock,
165            UrlExtraData(doc.base_url().get_arc()),
166            doc.quirks_mode(),
167            self.upcast(),
168        );
169
170        let sheet = Arc::new(Stylesheet {
171            contents: shared_lock.wrap(contents),
172            shared_lock,
173            media: mq,
174            disabled: AtomicBool::new(false),
175        });
176
177        // From here we differ from the spec. Since we have a cache,
178        // we have two situations:
179        //
180        // 1. We hit the cache. No fetch ever runs, hence we don't
181        // need to muddy with render-/load-blocking
182        // 2. We don't hit the cache. In this scenario, we once again
183        // have two sub-scenarios:
184        //   a. We synchronously parse the contents without any `@import`.
185        //      This means we can proceed as in situation 1
186        //   b. We synchronously parse the contents and we encounter 1+
187        //      `@import` rules. In that case, we do start to load urls.
188        //
189        // For situation 1 and 2a, we can immediately fire the load event
190        // since we are done.
191        if self.pending_loads.get() == 0 {
192            // Step 4 of https://html.spec.whatwg.org/multipage/#the-style-element:critical-subresources
193            //
194            // Step 4. Queue an element task on the networking task source given element and the following steps:
195            // Step 4.1. If success is true, fire an event named load at element.
196            self.owner_global()
197                .task_manager()
198                .networking_task_source()
199                .queue_simple_event(self.upcast(), atom!("load"));
200        }
201
202        // For situation 2b, we need to do more work.
203        // Therefore, the following steps are actually implemented in
204        // `ElementStylesheetLoader::load_with_element`.
205        //
206        //     Step 7. If element contributes a script-blocking style sheet,
207        //     append element to its node document's script-blocking style sheet set.
208        //
209        //     Step 8. If element's media attribute's value matches the environment
210        //     and element is potentially render-blocking, then block rendering on element.
211
212        // Finally, update our stylesheet, regardless of which scenario we ran into
213        self.clean_stylesheet_ownership();
214        self.set_stylesheet(cx, sheet, cache_key);
215    }
216
217    // FIXME(emilio): This is duplicated with HTMLLinkElement::set_stylesheet.
218    //
219    // With the reuse of `StylesheetContent` for same stylesheet string content,
220    // this function has a bit difference with `HTMLLinkElement::set_stylesheet` now.
221    pub(crate) fn set_stylesheet(
222        &self,
223        cx: &mut JSContext,
224        s: Arc<Stylesheet>,
225        cache_key: Option<StylesheetContentsCacheKey>,
226    ) {
227        *self.stylesheet.borrow_mut() = Some(s.clone());
228        *self.stylesheetcontents_cache_key.borrow_mut() = cache_key;
229        self.stylesheet_list_owner()
230            .add_owned_stylesheet(cx, self.upcast(), s);
231    }
232
233    pub(crate) fn will_modify_stylesheet(&self, cx: &mut JSContext) {
234        if let Some(stylesheet_with_owned_contents) = self.create_owned_contents_stylesheet() {
235            self.remove_stylesheet();
236            if let Some(cssom_stylesheet) = self.cssom_stylesheet.get() {
237                let guard = stylesheet_with_owned_contents.shared_lock.read();
238                cssom_stylesheet.update_style_stylesheet(&stylesheet_with_owned_contents, &guard);
239            }
240            self.set_stylesheet(cx, stylesheet_with_owned_contents, None);
241        }
242    }
243
244    pub(crate) fn get_stylesheet(&self) -> Option<Arc<Stylesheet>> {
245        self.stylesheet.borrow().clone()
246    }
247
248    pub(crate) fn get_cssom_stylesheet(&self) -> Option<DomRoot<CSSStyleSheet>> {
249        self.get_stylesheet().map(|sheet| {
250            self.cssom_stylesheet.or_init(|| {
251                CSSStyleSheet::new(
252                    &self.owner_window(),
253                    Some(self.upcast::<Element>()),
254                    "text/css".into(),
255                    None, // todo handle location
256                    None, // todo handle title
257                    sheet,
258                    None, // constructor_document
259                    CanGc::deprecated_note(),
260                )
261            })
262        })
263    }
264
265    fn create_owned_contents_stylesheet(&self) -> Option<Arc<Stylesheet>> {
266        let cache_key = self.stylesheetcontents_cache_key.borrow_mut().take()?;
267        if cache_key.is_uniquely_owned() {
268            StylesheetContentsCache::remove(cache_key);
269            return None;
270        }
271
272        let stylesheet_with_shared_contents = self.stylesheet.borrow().clone()?;
273        let lock = stylesheet_with_shared_contents.shared_lock.clone();
274        let guard = stylesheet_with_shared_contents.shared_lock.read();
275        let stylesheet_with_owned_contents = Arc::new(Stylesheet {
276            contents: lock.wrap(
277                stylesheet_with_shared_contents
278                    .contents(&guard)
279                    .deep_clone(&lock, None, &guard),
280            ),
281            shared_lock: lock,
282            media: stylesheet_with_shared_contents.media.clone(),
283            disabled: AtomicBool::new(
284                stylesheet_with_shared_contents
285                    .disabled
286                    .load(Ordering::SeqCst),
287            ),
288        });
289
290        Some(stylesheet_with_owned_contents)
291    }
292
293    fn clean_stylesheet_ownership(&self) {
294        if let Some(cssom_stylesheet) = self.cssom_stylesheet.get() {
295            // If the CSSOMs change from having an owner node to being ownerless, they may still
296            // potentially modify shared stylesheets. Thus, create an new `Stylesheet` with owned
297            // `StylesheetContents` to ensure that the potentially modifications are only made on
298            // the owned `StylesheetContents`.
299            if let Some(stylesheet) = self.create_owned_contents_stylesheet() {
300                let guard = stylesheet.shared_lock.read();
301                cssom_stylesheet.update_style_stylesheet(&stylesheet, &guard);
302            }
303            cssom_stylesheet.set_owner_node(None);
304        }
305        self.cssom_stylesheet.set(None);
306    }
307
308    fn remove_stylesheet(&self) {
309        self.clean_stylesheet_ownership();
310        if let Some(s) = self.stylesheet.borrow_mut().take() {
311            self.stylesheet_list_owner()
312                .remove_stylesheet(StylesheetSource::Element(Dom::from_ref(self.upcast())), &s);
313            let _ = self.stylesheetcontents_cache_key.borrow_mut().take();
314        }
315    }
316}
317
318impl VirtualMethods for HTMLStyleElement {
319    fn super_type(&self) -> Option<&dyn VirtualMethods> {
320        Some(self.upcast::<HTMLElement>() as &dyn VirtualMethods)
321    }
322
323    fn children_changed(&self, cx: &mut JSContext, mutation: &ChildrenMutation) {
324        self.super_type().unwrap().children_changed(cx, mutation);
325
326        // https://html.spec.whatwg.org/multipage/#update-a-style-block
327        // > The element is not on the stack of open elements of an HTML parser or XML parser, and its children changed steps run.
328        if !self.in_stack_of_open_elements.get() {
329            self.update_a_style_block(cx);
330        }
331    }
332
333    fn bind_to_tree(&self, cx: &mut JSContext, context: &BindContext) {
334        self.super_type().unwrap().bind_to_tree(cx, context);
335
336        // https://html.spec.whatwg.org/multipage/#update-a-style-block
337        // > The element is not on the stack of open elements of an HTML parser or XML parser, and it becomes connected or disconnected.
338        if !self.in_stack_of_open_elements.get() {
339            self.update_a_style_block(cx);
340        }
341    }
342
343    fn pop(&self, cx: &mut js::context::JSContext) {
344        self.super_type().unwrap().pop(cx);
345        self.in_stack_of_open_elements.set(false);
346
347        // https://html.spec.whatwg.org/multipage/#update-a-style-block
348        // > The element is popped off the stack of open elements of an HTML parser or XML parser.
349        self.update_a_style_block(cx);
350    }
351
352    fn unbind_from_tree(&self, cx: &mut js::context::JSContext, context: &UnbindContext) {
353        if let Some(s) = self.super_type() {
354            s.unbind_from_tree(cx, context);
355        }
356
357        // https://html.spec.whatwg.org/multipage/#update-a-style-block
358        // > The element is not on the stack of open elements of an HTML parser or XML parser, and it becomes connected or disconnected.
359        if !self.in_stack_of_open_elements.get() {
360            self.update_a_style_block(cx);
361        }
362    }
363
364    fn attribute_mutated(
365        &self,
366        cx: &mut js::context::JSContext,
367        attr: AttrRef<'_>,
368        mutation: AttributeMutation,
369    ) {
370        if let Some(s) = self.super_type() {
371            s.attribute_mutated(cx, attr, mutation);
372        }
373
374        let node = self.upcast::<Node>();
375        if !(node.is_in_a_document_tree() || node.is_in_a_shadow_tree()) ||
376            self.in_stack_of_open_elements.get()
377        {
378            return;
379        }
380
381        if attr.name() == "type" {
382            if let AttributeMutation::Set(Some(old_value), _) = mutation &&
383                **old_value == **attr.value()
384            {
385                return;
386            }
387            self.remove_stylesheet();
388            self.update_a_style_block(cx);
389        } else if attr.name() == "media" &&
390            let Some(ref stylesheet) = *self.stylesheet.borrow_mut()
391        {
392            let shared_lock = node.owner_doc().style_shared_author_lock().clone();
393            let mut guard = shared_lock.write();
394            let media = stylesheet.media.write_with(&mut guard);
395            match mutation {
396                AttributeMutation::Set(..) => *media = self.create_media_list(&attr.value()),
397                AttributeMutation::Removed => *media = StyleMediaList::empty(),
398            };
399            self.owner_document().invalidate_stylesheets();
400        }
401    }
402}
403
404impl StylesheetOwner for HTMLStyleElement {
405    fn increment_pending_loads_count(&self) {
406        self.pending_loads.set(self.pending_loads.get() + 1)
407    }
408
409    fn load_finished(&self, succeeded: bool) -> Option<bool> {
410        assert!(self.pending_loads.get() > 0, "What finished?");
411        if !succeeded {
412            self.any_failed_load.set(true);
413        }
414
415        self.pending_loads.set(self.pending_loads.get() - 1);
416        if self.pending_loads.get() != 0 {
417            return None;
418        }
419
420        let any_failed = self.any_failed_load.get();
421        self.any_failed_load.set(false);
422        Some(any_failed)
423    }
424
425    fn parser_inserted(&self) -> bool {
426        self.parser_inserted.get()
427    }
428
429    /// <https://html.spec.whatwg.org/multipage/#potentially-render-blocking>
430    fn potentially_render_blocking(&self) -> bool {
431        // An element is potentially render-blocking if its blocking tokens set contains "render",
432        // or if it is implicitly potentially render-blocking, which will be defined at the individual elements.
433        // By default, an element is not implicitly potentially render-blocking.
434        //
435        // https://html.spec.whatwg.org/multipage/#the-style-element:implicitly-potentially-render-blocking
436        // > A style element is implicitly potentially render-blocking if the element was created by its node document's parser.
437        self.parser_inserted() ||
438            self.blocking
439                .get()
440                .is_some_and(|list| list.Contains("render".into()))
441    }
442
443    fn referrer_policy(&self, _cx: &mut js::context::JSContext) -> ReferrerPolicy {
444        ReferrerPolicy::EmptyString
445    }
446
447    fn set_origin_clean(&self, origin_clean: bool) {
448        if let Some(stylesheet) = self.get_cssom_stylesheet() {
449            stylesheet.set_origin_clean(origin_clean);
450        }
451    }
452}
453
454impl HTMLStyleElementMethods<crate::DomTypeHolder> for HTMLStyleElement {
455    /// <https://drafts.csswg.org/cssom/#dom-linkstyle-sheet>
456    fn GetSheet(&self) -> Option<DomRoot<DOMStyleSheet>> {
457        self.get_cssom_stylesheet().map(DomRoot::upcast)
458    }
459
460    /// <https://html.spec.whatwg.org/multipage/#dom-style-disabled>
461    fn Disabled(&self) -> bool {
462        self.get_cssom_stylesheet()
463            .is_some_and(|sheet| sheet.disabled())
464    }
465
466    /// <https://html.spec.whatwg.org/multipage/#dom-style-disabled>
467    fn SetDisabled(&self, _cx: &mut js::context::JSContext, value: bool) {
468        if let Some(sheet) = self.get_cssom_stylesheet() {
469            sheet.set_disabled(value);
470        }
471    }
472
473    // <https://html.spec.whatwg.org/multipage/#HTMLStyleElement-partial>
474    make_getter!(Type, "type");
475
476    // <https://html.spec.whatwg.org/multipage/#HTMLStyleElement-partial>
477    make_setter!(SetType, "type");
478
479    // <https://html.spec.whatwg.org/multipage/#attr-style-media>
480    make_getter!(Media, "media");
481
482    // <https://html.spec.whatwg.org/multipage/#attr-style-media>
483    make_setter!(SetMedia, "media");
484
485    /// <https://html.spec.whatwg.org/multipage/#attr-style-blocking>
486    fn Blocking(&self, cx: &mut js::context::JSContext) -> DomRoot<DOMTokenList> {
487        self.blocking.or_init(|| {
488            DOMTokenList::new(
489                cx,
490                self.upcast(),
491                &local_name!("blocking"),
492                Some(vec![Atom::from("render")]),
493            )
494        })
495    }
496}