1use std::cell::Cell;
6use std::collections::HashSet;
7use std::default::Default;
8use std::rc::Rc;
9use std::sync::{Arc, LazyLock};
10use std::{char, mem};
11
12use app_units::{AU_PER_PX, Au};
13use cssparser::{Parser, ParserInput};
14use dom_struct::dom_struct;
15use euclid::default::{Point2D, Size2D};
16use html5ever::{LocalName, Prefix, QualName, local_name, ns};
17use js::jsapi::JSAutoRealm;
18use js::rust::HandleObject;
19use mime::{self, Mime};
20use net_traits::http_status::HttpStatus;
21use net_traits::image_cache::{
22 Image, ImageCache, ImageCacheResult, ImageLoadListener, ImageOrMetadataAvailable,
23 ImageResponse, PendingImageId, UsePlaceholder,
24};
25use net_traits::request::{Destination, Initiator, RequestId};
26use net_traits::{
27 FetchMetadata, FetchResponseListener, FetchResponseMsg, NetworkError, ReferrerPolicy,
28 ResourceFetchTiming, ResourceTimingType,
29};
30use num_traits::ToPrimitive;
31use pixels::{
32 CorsStatus, ImageMetadata, PixelFormat, Snapshot, SnapshotAlphaMode, SnapshotPixelFormat,
33};
34use regex::Regex;
35use servo_url::ServoUrl;
36use servo_url::origin::MutableOrigin;
37use style::attr::{AttrValue, LengthOrPercentageOrAuto, parse_unsigned_integer};
38use style::context::QuirksMode;
39use style::parser::ParserContext;
40use style::stylesheets::{CssRuleType, Origin};
41use style::values::specified::source_size_list::SourceSizeList;
42use style_traits::ParsingMode;
43use url::Url;
44
45use crate::document_loader::{LoadBlocker, LoadType};
46use crate::dom::activation::Activatable;
47use crate::dom::attr::Attr;
48use crate::dom::bindings::cell::{DomRefCell, RefMut};
49use crate::dom::bindings::codegen::Bindings::DOMRectBinding::DOMRect_Binding::DOMRectMethods;
50use crate::dom::bindings::codegen::Bindings::ElementBinding::Element_Binding::ElementMethods;
51use crate::dom::bindings::codegen::Bindings::HTMLImageElementBinding::HTMLImageElementMethods;
52use crate::dom::bindings::codegen::Bindings::MouseEventBinding::MouseEventMethods;
53use crate::dom::bindings::codegen::Bindings::NodeBinding::Node_Binding::NodeMethods;
54use crate::dom::bindings::codegen::Bindings::WindowBinding::WindowMethods;
55use crate::dom::bindings::error::{Error, Fallible};
56use crate::dom::bindings::inheritance::Castable;
57use crate::dom::bindings::refcounted::{Trusted, TrustedPromise};
58use crate::dom::bindings::reflector::DomGlobal;
59use crate::dom::bindings::root::{DomRoot, LayoutDom, MutNullableDom};
60use crate::dom::bindings::str::{DOMString, USVString};
61use crate::dom::csp::{GlobalCspReporting, Violation};
62use crate::dom::document::{Document, determine_policy_for_token};
63use crate::dom::element::{
64 AttributeMutation, CustomElementCreationMode, Element, ElementCreator, LayoutElementHelpers,
65 cors_setting_for_element, referrer_policy_for_element, reflect_cross_origin_attribute,
66 reflect_referrer_policy_attribute, set_cross_origin_attribute,
67};
68use crate::dom::event::Event;
69use crate::dom::eventtarget::EventTarget;
70use crate::dom::globalscope::GlobalScope;
71use crate::dom::html::htmlareaelement::HTMLAreaElement;
72use crate::dom::html::htmlelement::HTMLElement;
73use crate::dom::html::htmlformelement::{FormControl, HTMLFormElement};
74use crate::dom::html::htmlmapelement::HTMLMapElement;
75use crate::dom::html::htmlpictureelement::HTMLPictureElement;
76use crate::dom::html::htmlsourceelement::HTMLSourceElement;
77use crate::dom::medialist::MediaList;
78use crate::dom::mouseevent::MouseEvent;
79use crate::dom::node::{BindContext, Node, NodeDamage, NodeTraits, ShadowIncluding, UnbindContext};
80use crate::dom::performanceresourcetiming::InitiatorType;
81use crate::dom::promise::Promise;
82use crate::dom::values::UNSIGNED_LONG_MAX;
83use crate::dom::virtualmethods::VirtualMethods;
84use crate::dom::window::Window;
85use crate::fetch::create_a_potential_cors_request;
86use crate::microtask::{Microtask, MicrotaskRunnable};
87use crate::network_listener::{self, PreInvoke, ResourceTimingListener};
88use crate::realms::enter_realm;
89use crate::script_runtime::CanGc;
90use crate::script_thread::ScriptThread;
91
92const SUPPORTED_IMAGE_MIME_TYPES: &[&str] = &[
96 "image/bmp",
97 "image/gif",
98 "image/jpeg",
99 "image/jpg",
100 "image/pjpeg",
101 "image/png",
102 "image/apng",
103 "image/x-png",
104 "image/svg+xml",
105 "image/vnd.microsoft.icon",
106 "image/x-icon",
107 "image/webp",
108];
109
110#[derive(Clone, Copy, Debug)]
111enum ParseState {
112 InDescriptor,
113 InParens,
114 AfterDescriptor,
115}
116
117#[derive(MallocSizeOf)]
119pub(crate) struct SourceSet {
120 image_sources: Vec<ImageSource>,
121 source_size: SourceSizeList,
122}
123
124impl SourceSet {
125 fn new() -> SourceSet {
126 SourceSet {
127 image_sources: Vec::new(),
128 source_size: SourceSizeList::empty(),
129 }
130 }
131}
132
133#[derive(Clone, Debug, MallocSizeOf, PartialEq)]
134pub struct ImageSource {
135 pub url: String,
136 pub descriptor: Descriptor,
137}
138
139#[derive(Clone, Debug, MallocSizeOf, PartialEq)]
140pub struct Descriptor {
141 pub width: Option<u32>,
142 pub density: Option<f64>,
143}
144
145#[derive(Clone, Copy, JSTraceable, MallocSizeOf)]
146#[allow(dead_code)]
147enum State {
148 Unavailable,
149 PartiallyAvailable,
150 CompletelyAvailable,
151 Broken,
152}
153
154#[derive(Clone, Copy, JSTraceable, MallocSizeOf)]
155enum ImageRequestPhase {
156 Pending,
157 Current,
158}
159#[derive(JSTraceable, MallocSizeOf)]
160#[cfg_attr(crown, crown::unrooted_must_root_lint::must_root)]
161struct ImageRequest {
162 state: State,
163 #[no_trace]
164 parsed_url: Option<ServoUrl>,
165 source_url: Option<USVString>,
166 blocker: DomRefCell<Option<LoadBlocker>>,
167 #[no_trace]
168 image: Option<Image>,
169 #[no_trace]
170 metadata: Option<ImageMetadata>,
171 #[no_trace]
172 final_url: Option<ServoUrl>,
173 current_pixel_density: Option<f64>,
174}
175#[dom_struct]
176pub(crate) struct HTMLImageElement {
177 htmlelement: HTMLElement,
178 image_request: Cell<ImageRequestPhase>,
179 current_request: DomRefCell<ImageRequest>,
180 pending_request: DomRefCell<ImageRequest>,
181 form_owner: MutNullableDom<HTMLFormElement>,
182 generation: Cell<u32>,
183 source_set: DomRefCell<SourceSet>,
184 dimension_attribute_source: MutNullableDom<Element>,
187 last_selected_source: DomRefCell<Option<USVString>>,
188 #[ignore_malloc_size_of = "promises are hard"]
189 image_decode_promises: DomRefCell<Vec<Rc<Promise>>>,
190 line_number: u64,
192}
193
194impl HTMLImageElement {
195 pub(crate) fn is_usable(&self) -> Fallible<bool> {
197 if let Some(image) = &self.current_request.borrow().image {
199 let intrinsic_size = image.metadata();
200 if intrinsic_size.width == 0 || intrinsic_size.height == 0 {
201 return Ok(false);
202 }
203 }
204
205 match self.current_request.borrow().state {
206 State::Broken => Err(Error::InvalidState),
208 State::CompletelyAvailable => Ok(true),
209 State::PartiallyAvailable | State::Unavailable => Ok(false),
211 }
212 }
213
214 pub(crate) fn image_data(&self) -> Option<Image> {
215 self.current_request.borrow().image.clone()
216 }
217
218 pub(crate) fn get_raster_image_data(&self) -> Option<Snapshot> {
220 let Some(img) = self.image_data()?.as_raster_image() else {
221 warn!("Vector image is not supported as raster image source");
222 return None;
223 };
224
225 let size = Size2D::new(img.metadata.width, img.metadata.height);
226 let format = match img.format {
227 PixelFormat::BGRA8 => SnapshotPixelFormat::BGRA,
228 PixelFormat::RGBA8 => SnapshotPixelFormat::RGBA,
229 pixel_format => {
230 unimplemented!("unsupported pixel format ({:?})", pixel_format)
231 },
232 };
233
234 let alpha_mode = SnapshotAlphaMode::Transparent {
235 premultiplied: false,
236 };
237
238 let snapshot = Snapshot::from_vec(
239 size.cast(),
240 format,
241 alpha_mode,
242 img.first_frame().bytes.to_vec(),
243 );
244
245 Some(snapshot)
246 }
247}
248
249struct ImageContext {
251 image_cache: Arc<dyn ImageCache>,
253 status: Result<(), NetworkError>,
255 id: PendingImageId,
257 aborted: bool,
259 doc: Trusted<Document>,
261 resource_timing: ResourceFetchTiming,
263 url: ServoUrl,
264 element: Trusted<HTMLImageElement>,
265}
266
267impl FetchResponseListener for ImageContext {
268 fn process_request_body(&mut self, _: RequestId) {}
269 fn process_request_eof(&mut self, _: RequestId) {}
270
271 fn process_response(
272 &mut self,
273 request_id: RequestId,
274 metadata: Result<FetchMetadata, NetworkError>,
275 ) {
276 debug!("got {:?} for {:?}", metadata.as_ref().map(|_| ()), self.url);
277 self.image_cache.notify_pending_response(
278 self.id,
279 FetchResponseMsg::ProcessResponse(request_id, metadata.clone()),
280 );
281
282 let metadata = metadata.ok().map(|meta| match meta {
283 FetchMetadata::Unfiltered(m) => m,
284 FetchMetadata::Filtered { unsafe_, .. } => unsafe_,
285 });
286
287 if let Some(metadata) = metadata.as_ref() {
289 if let Some(ref content_type) = metadata.content_type {
290 let mime: Mime = content_type.clone().into_inner().into();
291 if mime.type_() == mime::MULTIPART && mime.subtype().as_str() == "x-mixed-replace" {
292 self.aborted = true;
293 }
294 }
295 }
296
297 let status = metadata
298 .as_ref()
299 .map(|m| m.status.clone())
300 .unwrap_or_else(HttpStatus::new_error);
301
302 self.status = {
303 if status.is_error() {
304 Err(NetworkError::Internal(
305 "No http status code received".to_owned(),
306 ))
307 } else if status.is_success() {
308 Ok(())
309 } else {
310 Err(NetworkError::Internal(format!(
311 "HTTP error code {}",
312 status.code()
313 )))
314 }
315 };
316 }
317
318 fn process_response_chunk(&mut self, request_id: RequestId, payload: Vec<u8>) {
319 if self.status.is_ok() {
320 self.image_cache.notify_pending_response(
321 self.id,
322 FetchResponseMsg::ProcessResponseChunk(request_id, payload),
323 );
324 }
325 }
326
327 fn process_response_eof(
328 &mut self,
329 request_id: RequestId,
330 response: Result<ResourceFetchTiming, NetworkError>,
331 ) {
332 self.image_cache.notify_pending_response(
333 self.id,
334 FetchResponseMsg::ProcessResponseEOF(request_id, response),
335 );
336 }
337
338 fn resource_timing_mut(&mut self) -> &mut ResourceFetchTiming {
339 &mut self.resource_timing
340 }
341
342 fn resource_timing(&self) -> &ResourceFetchTiming {
343 &self.resource_timing
344 }
345
346 fn submit_resource_timing(&mut self) {
347 network_listener::submit_timing(self, CanGc::note())
348 }
349
350 fn process_csp_violations(&mut self, _request_id: RequestId, violations: Vec<Violation>) {
351 let global = &self.resource_timing_global();
352 let elem = self.element.root();
353 let source_position = elem
354 .upcast::<Element>()
355 .compute_source_position(elem.line_number as u32);
356 global.report_csp_violations(violations, None, Some(source_position));
357 }
358}
359
360impl ResourceTimingListener for ImageContext {
361 fn resource_timing_information(&self) -> (InitiatorType, ServoUrl) {
362 (
363 InitiatorType::LocalName("img".to_string()),
364 self.url.clone(),
365 )
366 }
367
368 fn resource_timing_global(&self) -> DomRoot<GlobalScope> {
369 self.doc.root().global()
370 }
371}
372
373impl PreInvoke for ImageContext {
374 fn should_invoke(&self) -> bool {
375 !self.aborted
376 }
377}
378
379#[allow(non_snake_case)]
380impl HTMLImageElement {
381 fn fetch_image(&self, img_url: &ServoUrl, can_gc: CanGc) {
383 let window = self.owner_window();
384
385 let cache_result = window.image_cache().get_cached_image_status(
386 img_url.clone(),
387 window.origin().immutable().clone(),
388 cors_setting_for_element(self.upcast()),
389 UsePlaceholder::Yes,
390 );
391
392 match cache_result {
393 ImageCacheResult::Available(ImageOrMetadataAvailable::ImageAvailable {
394 image,
395 url,
396 is_placeholder,
397 }) => {
398 if is_placeholder {
399 if let Some(raster_image) = image.as_raster_image() {
400 self.process_image_response(
401 ImageResponse::PlaceholderLoaded(raster_image, url),
402 can_gc,
403 )
404 }
405 } else {
406 self.process_image_response(ImageResponse::Loaded(image, url), can_gc)
407 }
408 },
409 ImageCacheResult::Available(ImageOrMetadataAvailable::MetadataAvailable(
410 metadata,
411 id,
412 )) => {
413 self.process_image_response(ImageResponse::MetadataLoaded(metadata), can_gc);
414 self.register_image_cache_callback(id, ChangeType::Element);
415 },
416 ImageCacheResult::Pending(id) => {
417 self.register_image_cache_callback(id, ChangeType::Element);
418 },
419 ImageCacheResult::ReadyForRequest(id) => {
420 self.fetch_request(img_url, id);
421 self.register_image_cache_callback(id, ChangeType::Element);
422 },
423 ImageCacheResult::LoadError => self.process_image_response(ImageResponse::None, can_gc),
424 };
425 }
426
427 fn register_image_cache_callback(&self, id: PendingImageId, change_type: ChangeType) {
428 let trusted_node = Trusted::new(self);
429 let generation = self.generation_id();
430 let window = self.owner_window();
431 let sender = window.register_image_cache_listener(id, move |response| {
432 let trusted_node = trusted_node.clone();
433 let window = trusted_node.root().owner_window();
434 let callback_type = change_type.clone();
435
436 window
437 .as_global_scope()
438 .task_manager()
439 .networking_task_source()
440 .queue(task!(process_image_response: move || {
441 let element = trusted_node.root();
442
443 if generation != element.generation_id() {
445 return;
446 }
447
448 match callback_type {
449 ChangeType::Element => {
450 element.process_image_response(response.response, CanGc::note());
451 }
452 ChangeType::Environment { selected_source, selected_pixel_density } => {
453 element.process_image_response_for_environment_change(
454 response.response, selected_source, generation, selected_pixel_density, CanGc::note()
455 );
456 }
457 }
458 }));
459 });
460
461 window
462 .image_cache()
463 .add_listener(ImageLoadListener::new(sender, window.pipeline_id(), id));
464 }
465
466 fn fetch_request(&self, img_url: &ServoUrl, id: PendingImageId) {
467 let document = self.owner_document();
468 let window = self.owner_window();
469
470 let context = ImageContext {
471 image_cache: window.image_cache(),
472 status: Ok(()),
473 id,
474 aborted: false,
475 doc: Trusted::new(&document),
476 element: Trusted::new(self),
477 resource_timing: ResourceFetchTiming::new(ResourceTimingType::Resource),
478 url: img_url.clone(),
479 };
480
481 let global = document.global();
484 let mut request = create_a_potential_cors_request(
485 Some(window.webview_id()),
486 img_url.clone(),
487 Destination::Image,
488 cors_setting_for_element(self.upcast()),
489 None,
490 global.get_referrer(),
491 document.insecure_requests_policy(),
492 document.has_trustworthy_ancestor_or_current_origin(),
493 global.policy_container(),
494 )
495 .origin(document.origin().immutable().clone())
496 .pipeline_id(Some(document.global().pipeline_id()))
497 .referrer_policy(referrer_policy_for_element(self.upcast()));
498
499 if Self::uses_srcset_or_picture(self.upcast()) {
500 request = request.initiator(Initiator::ImageSet);
501 }
502
503 document.fetch_background(request, context);
506 }
507
508 fn handle_loaded_image(&self, image: Image, url: ServoUrl, can_gc: CanGc) {
510 self.current_request.borrow_mut().metadata = Some(image.metadata());
511 self.current_request.borrow_mut().final_url = Some(url);
512 self.current_request.borrow_mut().image = Some(image);
513 self.current_request.borrow_mut().state = State::CompletelyAvailable;
514 LoadBlocker::terminate(&self.current_request.borrow().blocker, can_gc);
515 self.upcast::<Node>().dirty(NodeDamage::Other);
517 self.resolve_image_decode_promises();
518 }
519
520 fn process_image_response(&self, image: ImageResponse, can_gc: CanGc) {
522 let (trigger_image_load, trigger_image_error) = match (image, self.image_request.get()) {
524 (ImageResponse::Loaded(image, url), ImageRequestPhase::Current) => {
525 self.handle_loaded_image(image, url, can_gc);
526 (true, false)
527 },
528 (ImageResponse::PlaceholderLoaded(image, url), ImageRequestPhase::Current) => {
529 self.handle_loaded_image(Image::Raster(image), url, can_gc);
530 (false, true)
531 },
532 (ImageResponse::Loaded(image, url), ImageRequestPhase::Pending) => {
533 self.abort_request(State::Unavailable, ImageRequestPhase::Pending, can_gc);
534 self.image_request.set(ImageRequestPhase::Current);
535 self.handle_loaded_image(image, url, can_gc);
536 (true, false)
537 },
538 (ImageResponse::PlaceholderLoaded(image, url), ImageRequestPhase::Pending) => {
539 self.abort_request(State::Unavailable, ImageRequestPhase::Pending, can_gc);
540 self.image_request.set(ImageRequestPhase::Current);
541 self.handle_loaded_image(Image::Raster(image), url, can_gc);
542 (false, true)
543 },
544 (ImageResponse::MetadataLoaded(meta), ImageRequestPhase::Current) => {
545 self.current_request.borrow_mut().state = State::PartiallyAvailable;
546 self.current_request.borrow_mut().metadata = Some(meta);
547 (false, false)
548 },
549 (ImageResponse::MetadataLoaded(_), ImageRequestPhase::Pending) => {
550 self.pending_request.borrow_mut().state = State::PartiallyAvailable;
551 (false, false)
552 },
553 (ImageResponse::None, ImageRequestPhase::Current) => {
554 self.abort_request(State::Broken, ImageRequestPhase::Current, can_gc);
555 (false, true)
556 },
557 (ImageResponse::None, ImageRequestPhase::Pending) => {
558 self.abort_request(State::Broken, ImageRequestPhase::Current, can_gc);
559 self.abort_request(State::Broken, ImageRequestPhase::Pending, can_gc);
560 self.image_request.set(ImageRequestPhase::Current);
561 (false, true)
562 },
563 };
564
565 if trigger_image_load {
567 self.upcast::<EventTarget>()
569 .fire_event(atom!("load"), can_gc);
570 self.upcast::<EventTarget>()
571 .fire_event(atom!("loadend"), can_gc);
572 }
573
574 if trigger_image_error {
576 self.upcast::<EventTarget>()
577 .fire_event(atom!("error"), can_gc);
578 self.upcast::<EventTarget>()
579 .fire_event(atom!("loadend"), can_gc);
580 }
581 }
582
583 fn process_image_response_for_environment_change(
584 &self,
585 image: ImageResponse,
586 src: USVString,
587 generation: u32,
588 selected_pixel_density: f64,
589 can_gc: CanGc,
590 ) {
591 match image {
592 ImageResponse::Loaded(image, url) => {
593 self.pending_request.borrow_mut().metadata = Some(image.metadata());
594 self.pending_request.borrow_mut().final_url = Some(url);
595 self.pending_request.borrow_mut().image = Some(image);
596 self.finish_reacting_to_environment_change(src, generation, selected_pixel_density);
597 },
598 ImageResponse::PlaceholderLoaded(image, url) => {
599 let image = Image::Raster(image);
600 self.pending_request.borrow_mut().metadata = Some(image.metadata());
601 self.pending_request.borrow_mut().final_url = Some(url);
602 self.pending_request.borrow_mut().image = Some(image);
603 self.finish_reacting_to_environment_change(src, generation, selected_pixel_density);
604 },
605 ImageResponse::MetadataLoaded(meta) => {
606 self.pending_request.borrow_mut().metadata = Some(meta);
607 },
608 ImageResponse::None => {
609 self.abort_request(State::Unavailable, ImageRequestPhase::Pending, can_gc);
610 },
611 };
612 }
613
614 fn abort_request(&self, state: State, request: ImageRequestPhase, can_gc: CanGc) {
616 let mut request = match request {
617 ImageRequestPhase::Current => self.current_request.borrow_mut(),
618 ImageRequestPhase::Pending => self.pending_request.borrow_mut(),
619 };
620 LoadBlocker::terminate(&request.blocker, can_gc);
621 request.state = state;
622 request.image = None;
623 request.metadata = None;
624
625 if matches!(state, State::Broken) {
626 self.reject_image_decode_promises();
627 } else if matches!(state, State::CompletelyAvailable) {
628 self.resolve_image_decode_promises();
629 }
630 }
631
632 fn create_source_set(&self) -> SourceSet {
634 let element = self.upcast::<Element>();
635
636 let mut source_set = SourceSet::new();
638
639 if let Some(srcset) = element.get_attribute(&ns!(), &local_name!("srcset")) {
642 source_set.image_sources = parse_a_srcset_attribute(&srcset.value());
643 }
644
645 if let Some(sizes) = element.get_attribute(&ns!(), &local_name!("sizes")) {
647 source_set.source_size = parse_a_sizes_attribute(&sizes.value());
648 }
649
650 let src_attribute = element.get_string_attribute(&local_name!("src"));
654 let is_src_empty = src_attribute.is_empty();
655 let no_density_source_of_1 = source_set
656 .image_sources
657 .iter()
658 .all(|source| source.descriptor.density != Some(1.));
659 let no_width_descriptor = source_set
660 .image_sources
661 .iter()
662 .all(|source| source.descriptor.width.is_none());
663 if !is_src_empty && no_density_source_of_1 && no_width_descriptor {
664 source_set.image_sources.push(ImageSource {
665 url: src_attribute.to_string(),
666 descriptor: Descriptor {
667 width: None,
668 density: None,
669 },
670 })
671 }
672
673 self.normalise_source_densities(&mut source_set);
675
676 source_set
678 }
679
680 fn update_source_set(&self) {
682 *self.source_set.borrow_mut() = SourceSet::new();
684
685 let elem = self.upcast::<Element>();
690 let parent = elem.upcast::<Node>().GetParentElement();
691 let elements = match parent.as_ref() {
692 Some(p) => {
693 if p.is::<HTMLPictureElement>() {
694 p.upcast::<Node>()
695 .children()
696 .filter_map(DomRoot::downcast::<Element>)
697 .map(|n| DomRoot::from_ref(&*n))
698 .collect()
699 } else {
700 vec![DomRoot::from_ref(elem)]
701 }
702 },
703 None => vec![DomRoot::from_ref(elem)],
704 };
705
706 for element in &elements {
708 if *element == DomRoot::from_ref(elem) {
710 *self.source_set.borrow_mut() = self.create_source_set();
713
714 return;
716 }
717
718 if !element.is::<HTMLSourceElement>() {
720 continue;
721 }
722
723 let mut source_set = SourceSet::new();
724
725 match element.get_attribute(&ns!(), &local_name!("srcset")) {
729 Some(srcset) => {
730 source_set.image_sources = parse_a_srcset_attribute(&srcset.value());
731 },
732 _ => continue,
733 }
734
735 if source_set.image_sources.is_empty() {
737 continue;
738 }
739
740 if let Some(media) = element.get_attribute(&ns!(), &local_name!("media")) {
743 if !MediaList::matches_environment(&element.owner_document(), &media.value()) {
744 continue;
745 }
746 }
747
748 if let Some(sizes) = element.get_attribute(&ns!(), &local_name!("sizes")) {
751 source_set.source_size = parse_a_sizes_attribute(&sizes.value());
752 }
753
754 if let Some(type_) = element.get_attribute(&ns!(), &local_name!("type")) {
757 if !is_supported_image_mime_type(&type_.value()) {
758 continue;
759 }
760 }
761
762 if element
765 .get_attribute(&ns!(), &local_name!("width"))
766 .is_some() ||
767 element
768 .get_attribute(&ns!(), &local_name!("height"))
769 .is_some()
770 {
771 self.dimension_attribute_source.set(Some(element));
772 } else {
773 self.dimension_attribute_source.set(Some(elem));
774 }
775
776 self.normalise_source_densities(&mut source_set);
778
779 *self.source_set.borrow_mut() = source_set;
781
782 return;
784 }
785 }
786
787 fn evaluate_source_size_list(&self, source_size_list: &SourceSizeList) -> Au {
788 let document = self.owner_document();
789 let quirks_mode = document.quirks_mode();
790 source_size_list.evaluate(document.window().layout().device(), quirks_mode)
791 }
792
793 fn normalise_source_densities(&self, source_set: &mut SourceSet) {
795 let source_size = self.evaluate_source_size_list(&source_set.source_size);
797
798 for image_source in &mut source_set.image_sources {
800 if image_source.descriptor.density.is_some() {
803 continue;
804 }
805
806 if image_source.descriptor.width.is_some() {
810 let width = image_source.descriptor.width.unwrap();
811 image_source.descriptor.density = Some(width as f64 / source_size.to_f64_px());
812 } else {
813 image_source.descriptor.density = Some(1_f64);
815 }
816 }
817 }
818
819 fn select_image_source(&self) -> Option<(USVString, f64)> {
821 self.update_source_set();
823
824 if self.source_set.borrow().image_sources.is_empty() {
827 return None;
828 }
829
830 self.select_image_source_from_source_set()
832 }
833
834 fn select_image_source_from_source_set(&self) -> Option<(USVString, f64)> {
836 let source_set = self.source_set.borrow();
841 let len = source_set.image_sources.len();
842
843 let mut repeat_indices = HashSet::new();
844 for outer_index in 0..len {
845 if repeat_indices.contains(&outer_index) {
846 continue;
847 }
848 let imgsource = &source_set.image_sources[outer_index];
849 let pixel_density = imgsource.descriptor.density.unwrap();
850 for inner_index in (outer_index + 1)..len {
851 let imgsource2 = &source_set.image_sources[inner_index];
852 if pixel_density == imgsource2.descriptor.density.unwrap() {
853 repeat_indices.insert(inner_index);
854 }
855 }
856 }
857
858 let mut max = (0f64, 0);
859 let img_sources = &mut vec![];
860 for (index, image_source) in source_set.image_sources.iter().enumerate() {
861 if repeat_indices.contains(&index) {
862 continue;
863 }
864 let den = image_source.descriptor.density.unwrap();
865 if max.0 < den {
866 max = (den, img_sources.len());
867 }
868 img_sources.push(image_source);
869 }
870
871 let mut best_candidate = max;
874 let device_pixel_ratio = self
875 .owner_document()
876 .window()
877 .viewport_details()
878 .hidpi_scale_factor
879 .get() as f64;
880 for (index, image_source) in img_sources.iter().enumerate() {
881 let current_den = image_source.descriptor.density.unwrap();
882 if current_den < best_candidate.0 && current_den >= device_pixel_ratio {
883 best_candidate = (current_den, index);
884 }
885 }
886 let selected_source = img_sources.remove(best_candidate.1).clone();
887
888 Some((
890 USVString(selected_source.url),
891 selected_source.descriptor.density.unwrap(),
892 ))
893 }
894
895 fn init_image_request(
896 &self,
897 request: &mut RefMut<'_, ImageRequest>,
898 url: &ServoUrl,
899 src: &USVString,
900 can_gc: CanGc,
901 ) {
902 request.parsed_url = Some(url.clone());
903 request.source_url = Some(src.clone());
904 request.image = None;
905 request.metadata = None;
906 let document = self.owner_document();
907 LoadBlocker::terminate(&request.blocker, can_gc);
908 *request.blocker.borrow_mut() =
909 Some(LoadBlocker::new(&document, LoadType::Image(url.clone())));
910 }
911
912 fn prepare_image_request(
914 &self,
915 url: &ServoUrl,
916 src: &USVString,
917 selected_pixel_density: f64,
918 can_gc: CanGc,
919 ) {
920 match self.image_request.get() {
921 ImageRequestPhase::Pending => {
922 if let Some(pending_url) = self.pending_request.borrow().parsed_url.clone() {
923 if pending_url == *url {
925 return;
926 }
927 }
928 },
929 ImageRequestPhase::Current => {
930 let mut current_request = self.current_request.borrow_mut();
931 let mut pending_request = self.pending_request.borrow_mut();
932 match (current_request.parsed_url.clone(), current_request.state) {
934 (Some(parsed_url), State::PartiallyAvailable) => {
935 if parsed_url == *url {
937 pending_request.image = None;
939 pending_request.parsed_url = None;
940 LoadBlocker::terminate(&pending_request.blocker, can_gc);
941 return;
943 }
944 pending_request.current_pixel_density = Some(selected_pixel_density);
945 self.image_request.set(ImageRequestPhase::Pending);
946 self.init_image_request(&mut pending_request, url, src, can_gc);
947 },
948 (_, State::Broken) | (_, State::Unavailable) => {
949 current_request.current_pixel_density = Some(selected_pixel_density);
951 self.init_image_request(&mut current_request, url, src, can_gc);
952 self.reject_image_decode_promises();
953 },
954 (_, _) => {
955 pending_request.current_pixel_density = Some(selected_pixel_density);
957 self.image_request.set(ImageRequestPhase::Pending);
958 self.init_image_request(&mut pending_request, url, src, can_gc);
959 },
960 }
961 },
962 }
963 self.fetch_image(url, can_gc);
964 }
965
966 fn update_the_image_data_sync_steps(&self, can_gc: CanGc) {
968 let document = self.owner_document();
969 let global = self.owner_global();
970 let task_manager = global.task_manager();
971 let task_source = task_manager.dom_manipulation_task_source();
972 let this = Trusted::new(self);
973 let (src, pixel_density) = match self.select_image_source() {
974 Some(data) => data,
976 None => {
977 self.abort_request(State::Broken, ImageRequestPhase::Current, can_gc);
978 self.abort_request(State::Broken, ImageRequestPhase::Pending, can_gc);
979 task_source.queue(task!(image_null_source_error: move || {
981 let this = this.root();
982 {
983 let mut current_request =
984 this.current_request.borrow_mut();
985 current_request.source_url = None;
986 current_request.parsed_url = None;
987 }
988 let elem = this.upcast::<Element>();
989 let src_present = elem.has_attribute(&local_name!("src"));
990
991 if src_present || Self::uses_srcset_or_picture(elem) {
992 this.upcast::<EventTarget>().fire_event(atom!("error"), CanGc::note());
993 }
994 }));
995 return;
996 },
997 };
998
999 let base_url = document.base_url();
1001 let parsed_url = base_url.join(&src.0);
1002 match parsed_url {
1003 Ok(url) => {
1004 self.prepare_image_request(&url, &src, pixel_density, can_gc);
1006 },
1007 Err(_) => {
1008 self.abort_request(State::Broken, ImageRequestPhase::Current, can_gc);
1009 self.abort_request(State::Broken, ImageRequestPhase::Pending, can_gc);
1010 let src = src.0;
1012 task_source.queue(task!(image_selected_source_error: move || {
1013 let this = this.root();
1014 {
1015 let mut current_request =
1016 this.current_request.borrow_mut();
1017 current_request.source_url = Some(USVString(src))
1018 }
1019 this.upcast::<EventTarget>().fire_event(atom!("error"), CanGc::note());
1020
1021 }));
1022 },
1023 }
1024 }
1025
1026 pub(crate) fn update_the_image_data(&self, can_gc: CanGc) {
1028 let document = self.owner_document();
1029 let window = document.window();
1030 let elem = self.upcast::<Element>();
1031 let src = elem.get_url_attribute(&local_name!("src"));
1032 let base_url = document.base_url();
1033
1034 {
1038 let mut current_request = self.current_request.borrow_mut();
1039 current_request.state = State::Unavailable;
1040 }
1041
1042 if !document.is_active() {
1043 }
1047 let mut selected_source = None;
1052 let mut pixel_density = None;
1053 let src_set = elem.get_url_attribute(&local_name!("srcset"));
1054 let is_parent_picture = elem
1055 .upcast::<Node>()
1056 .GetParentElement()
1057 .is_some_and(|p| p.is::<HTMLPictureElement>());
1058 if src_set.is_empty() && !is_parent_picture && !src.is_empty() {
1059 selected_source = Some(src.clone());
1060 pixel_density = Some(1_f64);
1061 };
1062
1063 self.last_selected_source
1065 .borrow_mut()
1066 .clone_from(&selected_source);
1067
1068 if let Some(src) = selected_source {
1070 if let Ok(img_url) = base_url.join(&src) {
1071 let image_cache = window.image_cache();
1072 let response = image_cache.get_image(
1073 img_url.clone(),
1074 window.origin().immutable().clone(),
1075 cors_setting_for_element(self.upcast()),
1076 );
1077
1078 if let Some(image) = response {
1079 self.generation.set(self.generation.get() + 1);
1082 let metadata = image.metadata();
1084 self.abort_request(
1086 State::CompletelyAvailable,
1087 ImageRequestPhase::Current,
1088 can_gc,
1089 );
1090 self.abort_request(State::Unavailable, ImageRequestPhase::Pending, can_gc);
1091 let mut current_request = self.current_request.borrow_mut();
1092 current_request.final_url = Some(img_url.clone());
1093 current_request.image = Some(image);
1094 current_request.metadata = Some(metadata);
1095 current_request.current_pixel_density = pixel_density;
1097 let this = Trusted::new(self);
1098 let src = src.0;
1099
1100 self.owner_global()
1101 .task_manager()
1102 .dom_manipulation_task_source()
1103 .queue(task!(image_load_event: move || {
1104 let this = this.root();
1105 {
1106 let mut current_request =
1107 this.current_request.borrow_mut();
1108 current_request.parsed_url = Some(img_url);
1109 current_request.source_url = Some(USVString(src));
1110 }
1111 this.upcast::<EventTarget>().fire_event(atom!("load"), CanGc::note());
1113 }));
1114 return;
1115 }
1116 }
1117 }
1118 self.generation.set(self.generation.get() + 1);
1120 let task = ImageElementMicrotask::StableStateUpdateImageData {
1121 elem: DomRoot::from_ref(self),
1122 generation: self.generation.get(),
1123 };
1124 ScriptThread::await_stable_state(Microtask::ImageElement(task));
1125 }
1126
1127 pub(crate) fn react_to_environment_changes(&self) {
1129 let task = ImageElementMicrotask::EnvironmentChanges {
1131 elem: DomRoot::from_ref(self),
1132 generation: self.generation.get(),
1133 };
1134 ScriptThread::await_stable_state(Microtask::ImageElement(task));
1135 }
1136
1137 fn react_to_environment_changes_sync_steps(&self, generation: u32, can_gc: CanGc) {
1139 let elem = self.upcast::<Element>();
1140 let document = elem.owner_document();
1141 let has_pending_request = matches!(self.image_request.get(), ImageRequestPhase::Pending);
1142
1143 if !document.is_active() || !Self::uses_srcset_or_picture(elem) || has_pending_request {
1145 return;
1146 }
1147
1148 let (selected_source, selected_pixel_density) = match self.select_image_source() {
1150 Some(selected) => selected,
1151 None => return,
1152 };
1153
1154 let same_source = match *self.last_selected_source.borrow() {
1156 Some(ref last_src) => *last_src == selected_source,
1157 _ => false,
1158 };
1159
1160 let same_selected_pixel_density = match self.current_request.borrow().current_pixel_density
1161 {
1162 Some(den) => selected_pixel_density == den,
1163 _ => false,
1164 };
1165
1166 if same_source && same_selected_pixel_density {
1167 return;
1168 }
1169
1170 let base_url = document.base_url();
1171 let img_url = match base_url.join(&selected_source.0) {
1173 Ok(url) => url,
1174 Err(_) => return,
1175 };
1176
1177 self.image_request.set(ImageRequestPhase::Pending);
1179 self.init_image_request(
1180 &mut self.pending_request.borrow_mut(),
1181 &img_url,
1182 &selected_source,
1183 can_gc,
1184 );
1185
1186 let window = self.owner_window();
1188 let cache_result = window.image_cache().get_cached_image_status(
1189 img_url.clone(),
1190 window.origin().immutable().clone(),
1191 cors_setting_for_element(self.upcast()),
1192 UsePlaceholder::No,
1193 );
1194
1195 let change_type = ChangeType::Environment {
1196 selected_source: selected_source.clone(),
1197 selected_pixel_density,
1198 };
1199
1200 match cache_result {
1201 ImageCacheResult::Available(ImageOrMetadataAvailable::ImageAvailable { .. }) => {
1202 self.finish_reacting_to_environment_change(
1204 selected_source,
1205 generation,
1206 selected_pixel_density,
1207 )
1208 },
1209 ImageCacheResult::Available(ImageOrMetadataAvailable::MetadataAvailable(m, id)) => {
1210 self.process_image_response_for_environment_change(
1211 ImageResponse::MetadataLoaded(m),
1212 selected_source,
1213 generation,
1214 selected_pixel_density,
1215 can_gc,
1216 );
1217 self.register_image_cache_callback(id, change_type);
1218 },
1219 ImageCacheResult::LoadError => {
1220 self.process_image_response_for_environment_change(
1221 ImageResponse::None,
1222 selected_source,
1223 generation,
1224 selected_pixel_density,
1225 can_gc,
1226 );
1227 },
1228 ImageCacheResult::ReadyForRequest(id) => {
1229 self.fetch_request(&img_url, id);
1230 self.register_image_cache_callback(id, change_type);
1231 },
1232 ImageCacheResult::Pending(id) => {
1233 self.register_image_cache_callback(id, change_type);
1234 },
1235 }
1236 }
1237
1238 fn react_to_decode_image_sync_steps(&self, promise: Rc<Promise>, can_gc: CanGc) {
1240 let document = self.owner_document();
1241 if !document.is_fully_active() ||
1243 matches!(self.current_request.borrow().state, State::Broken)
1244 {
1245 promise.reject_error(Error::Encoding, can_gc);
1246 } else if matches!(
1247 self.current_request.borrow().state,
1248 State::CompletelyAvailable
1249 ) {
1250 promise.resolve_native(&(), can_gc);
1252 } else {
1253 self.image_decode_promises
1254 .borrow_mut()
1255 .push(promise.clone());
1256 }
1257 }
1258
1259 fn resolve_image_decode_promises(&self) {
1261 if self.image_decode_promises.borrow().is_empty() {
1262 return;
1263 }
1264
1265 let trusted_image_decode_promises: Vec<TrustedPromise> = self
1269 .image_decode_promises
1270 .borrow()
1271 .iter()
1272 .map(|promise| TrustedPromise::new(promise.clone()))
1273 .collect();
1274
1275 self.image_decode_promises.borrow_mut().clear();
1276
1277 self.owner_global()
1278 .task_manager()
1279 .dom_manipulation_task_source()
1280 .queue(task!(fulfill_image_decode_promises: move || {
1281 for trusted_promise in trusted_image_decode_promises {
1282 trusted_promise.root().resolve_native(&(), CanGc::note());
1283 }
1284 }));
1285 }
1286
1287 fn reject_image_decode_promises(&self) {
1289 if self.image_decode_promises.borrow().is_empty() {
1290 return;
1291 }
1292
1293 let trusted_image_decode_promises: Vec<TrustedPromise> = self
1296 .image_decode_promises
1297 .borrow()
1298 .iter()
1299 .map(|promise| TrustedPromise::new(promise.clone()))
1300 .collect();
1301
1302 self.image_decode_promises.borrow_mut().clear();
1303
1304 self.owner_global()
1305 .task_manager()
1306 .dom_manipulation_task_source()
1307 .queue(task!(reject_image_decode_promises: move || {
1308 for trusted_promise in trusted_image_decode_promises {
1309 trusted_promise.root().reject_error(Error::Encoding, CanGc::note());
1310 }
1311 }));
1312 }
1313
1314 fn finish_reacting_to_environment_change(
1316 &self,
1317 src: USVString,
1318 generation: u32,
1319 selected_pixel_density: f64,
1320 ) {
1321 let this = Trusted::new(self);
1322 let src = src.0;
1323 self.owner_global().task_manager().dom_manipulation_task_source().queue(
1324 task!(image_load_event: move || {
1325 let this = this.root();
1326 let relevant_mutation = this.generation.get() != generation;
1327 if relevant_mutation {
1329 this.abort_request(State::Unavailable, ImageRequestPhase::Pending, CanGc::note());
1330 return;
1331 }
1332 *this.last_selected_source.borrow_mut() = Some(USVString(src));
1334
1335 {
1336 let mut pending_request = this.pending_request.borrow_mut();
1337 pending_request.current_pixel_density = Some(selected_pixel_density);
1338
1339 pending_request.state = State::CompletelyAvailable;
1341
1342 #[allow(clippy::swap_with_temporary)]
1347 mem::swap(&mut this.current_request.borrow_mut(), &mut pending_request);
1348 }
1349 this.abort_request(State::Unavailable, ImageRequestPhase::Pending, CanGc::note());
1350
1351 this.upcast::<Node>().dirty(NodeDamage::Other);
1353
1354 this.upcast::<EventTarget>().fire_event(atom!("load"), CanGc::note());
1356 })
1357 );
1358 }
1359
1360 fn uses_srcset_or_picture(elem: &Element) -> bool {
1361 let has_src = elem.has_attribute(&local_name!("srcset"));
1362 let is_parent_picture = elem
1363 .upcast::<Node>()
1364 .GetParentElement()
1365 .is_some_and(|p| p.is::<HTMLPictureElement>());
1366 has_src || is_parent_picture
1367 }
1368
1369 fn new_inherited(
1370 local_name: LocalName,
1371 prefix: Option<Prefix>,
1372 document: &Document,
1373 creator: ElementCreator,
1374 ) -> HTMLImageElement {
1375 HTMLImageElement {
1376 htmlelement: HTMLElement::new_inherited(local_name, prefix, document),
1377 image_request: Cell::new(ImageRequestPhase::Current),
1378 current_request: DomRefCell::new(ImageRequest {
1379 state: State::Unavailable,
1380 parsed_url: None,
1381 source_url: None,
1382 image: None,
1383 metadata: None,
1384 blocker: DomRefCell::new(None),
1385 final_url: None,
1386 current_pixel_density: None,
1387 }),
1388 pending_request: DomRefCell::new(ImageRequest {
1389 state: State::Unavailable,
1390 parsed_url: None,
1391 source_url: None,
1392 image: None,
1393 metadata: None,
1394 blocker: DomRefCell::new(None),
1395 final_url: None,
1396 current_pixel_density: None,
1397 }),
1398 form_owner: Default::default(),
1399 generation: Default::default(),
1400 source_set: DomRefCell::new(SourceSet::new()),
1401 dimension_attribute_source: Default::default(),
1402 last_selected_source: DomRefCell::new(None),
1403 image_decode_promises: DomRefCell::new(vec![]),
1404 line_number: creator.return_line_number(),
1405 }
1406 }
1407
1408 #[cfg_attr(crown, allow(crown::unrooted_must_root))]
1409 pub(crate) fn new(
1410 local_name: LocalName,
1411 prefix: Option<Prefix>,
1412 document: &Document,
1413 proto: Option<HandleObject>,
1414 creator: ElementCreator,
1415 can_gc: CanGc,
1416 ) -> DomRoot<HTMLImageElement> {
1417 let image_element = Node::reflect_node_with_proto(
1418 Box::new(HTMLImageElement::new_inherited(
1419 local_name, prefix, document, creator,
1420 )),
1421 document,
1422 proto,
1423 can_gc,
1424 );
1425 image_element
1426 .dimension_attribute_source
1427 .set(Some(image_element.upcast()));
1428 image_element
1429 }
1430
1431 pub(crate) fn areas(&self) -> Option<Vec<DomRoot<HTMLAreaElement>>> {
1432 let elem = self.upcast::<Element>();
1433 let usemap_attr = elem.get_attribute(&ns!(), &local_name!("usemap"))?;
1434
1435 let value = usemap_attr.value();
1436
1437 if value.is_empty() || !value.is_char_boundary(1) {
1438 return None;
1439 }
1440
1441 let (first, last) = value.split_at(1);
1442
1443 if first != "#" || last.is_empty() {
1444 return None;
1445 }
1446
1447 let useMapElements = self
1448 .owner_document()
1449 .upcast::<Node>()
1450 .traverse_preorder(ShadowIncluding::No)
1451 .filter_map(DomRoot::downcast::<HTMLMapElement>)
1452 .find(|n| {
1453 n.upcast::<Element>()
1454 .get_name()
1455 .is_some_and(|n| *n == *last)
1456 });
1457
1458 useMapElements.map(|mapElem| mapElem.get_area_elements())
1459 }
1460
1461 pub(crate) fn same_origin(&self, origin: &MutableOrigin) -> bool {
1462 if let Some(ref image) = self.current_request.borrow().image {
1463 return image.cors_status() == CorsStatus::Safe;
1464 }
1465
1466 self.current_request
1467 .borrow()
1468 .final_url
1469 .as_ref()
1470 .is_some_and(|url| url.scheme() == "data" || url.origin().same_origin(origin))
1471 }
1472
1473 fn generation_id(&self) -> u32 {
1474 self.generation.get()
1475 }
1476}
1477
1478#[derive(JSTraceable, MallocSizeOf)]
1479pub(crate) enum ImageElementMicrotask {
1480 StableStateUpdateImageData {
1481 elem: DomRoot<HTMLImageElement>,
1482 generation: u32,
1483 },
1484 EnvironmentChanges {
1485 elem: DomRoot<HTMLImageElement>,
1486 generation: u32,
1487 },
1488 Decode {
1489 elem: DomRoot<HTMLImageElement>,
1490 #[ignore_malloc_size_of = "promises are hard"]
1491 promise: Rc<Promise>,
1492 },
1493}
1494
1495impl MicrotaskRunnable for ImageElementMicrotask {
1496 fn handler(&self, can_gc: CanGc) {
1497 match *self {
1498 ImageElementMicrotask::StableStateUpdateImageData {
1499 ref elem,
1500 ref generation,
1501 } => {
1502 if elem.generation.get() == *generation {
1505 elem.update_the_image_data_sync_steps(can_gc);
1506 }
1507 },
1508 ImageElementMicrotask::EnvironmentChanges {
1509 ref elem,
1510 ref generation,
1511 } => {
1512 elem.react_to_environment_changes_sync_steps(*generation, can_gc);
1513 },
1514 ImageElementMicrotask::Decode {
1515 ref elem,
1516 ref promise,
1517 } => {
1518 elem.react_to_decode_image_sync_steps(promise.clone(), can_gc);
1519 },
1520 }
1521 }
1522
1523 fn enter_realm(&self) -> JSAutoRealm {
1524 match self {
1525 &ImageElementMicrotask::StableStateUpdateImageData { ref elem, .. } |
1526 &ImageElementMicrotask::EnvironmentChanges { ref elem, .. } |
1527 &ImageElementMicrotask::Decode { ref elem, .. } => enter_realm(&**elem),
1528 }
1529 }
1530}
1531
1532pub(crate) trait LayoutHTMLImageElementHelpers {
1533 fn image_url(self) -> Option<ServoUrl>;
1534 fn image_density(self) -> Option<f64>;
1535 fn image_data(self) -> (Option<Image>, Option<ImageMetadata>);
1536 fn get_width(self) -> LengthOrPercentageOrAuto;
1537 fn get_height(self) -> LengthOrPercentageOrAuto;
1538}
1539
1540impl<'dom> LayoutDom<'dom, HTMLImageElement> {
1541 #[allow(unsafe_code)]
1542 fn current_request(self) -> &'dom ImageRequest {
1543 unsafe { self.unsafe_get().current_request.borrow_for_layout() }
1544 }
1545
1546 #[allow(unsafe_code)]
1547 fn dimension_attribute_source(self) -> LayoutDom<'dom, Element> {
1548 unsafe {
1549 self.unsafe_get()
1550 .dimension_attribute_source
1551 .get_inner_as_layout()
1552 .expect("dimension attribute source should be always non-null")
1553 }
1554 }
1555}
1556
1557impl LayoutHTMLImageElementHelpers for LayoutDom<'_, HTMLImageElement> {
1558 fn image_url(self) -> Option<ServoUrl> {
1559 self.current_request().parsed_url.clone()
1560 }
1561
1562 fn image_data(self) -> (Option<Image>, Option<ImageMetadata>) {
1563 let current_request = self.current_request();
1564 (current_request.image.clone(), current_request.metadata)
1565 }
1566
1567 fn image_density(self) -> Option<f64> {
1568 self.current_request().current_pixel_density
1569 }
1570
1571 fn get_width(self) -> LengthOrPercentageOrAuto {
1572 self.dimension_attribute_source()
1573 .get_attr_for_layout(&ns!(), &local_name!("width"))
1574 .map(|x| *AttrValue::from_dimension(x.to_string()).as_dimension())
1575 .unwrap_or(LengthOrPercentageOrAuto::Auto)
1576 }
1577
1578 fn get_height(self) -> LengthOrPercentageOrAuto {
1579 self.dimension_attribute_source()
1580 .get_attr_for_layout(&ns!(), &local_name!("height"))
1581 .map(|x| *AttrValue::from_dimension(x.to_string()).as_dimension())
1582 .unwrap_or(LengthOrPercentageOrAuto::Auto)
1583 }
1584}
1585
1586fn parse_a_sizes_attribute(value: &str) -> SourceSizeList {
1588 let mut input = ParserInput::new(value);
1589 let mut parser = Parser::new(&mut input);
1590 let url_data = Url::parse("about:blank").unwrap().into();
1591 let context = ParserContext::new(
1592 Origin::Author,
1593 &url_data,
1594 Some(CssRuleType::Style),
1595 ParsingMode::empty(),
1598 QuirksMode::NoQuirks,
1599 Default::default(),
1600 None,
1601 None,
1602 );
1603 SourceSizeList::parse(&context, &mut parser)
1604}
1605
1606fn get_correct_referrerpolicy_from_raw_token(token: &DOMString) -> DOMString {
1607 if token.is_empty() {
1608 DOMString::new()
1611 } else {
1612 let policy = determine_policy_for_token(token);
1613
1614 if policy == ReferrerPolicy::EmptyString {
1615 return DOMString::new();
1616 }
1617
1618 DOMString::from_string(policy.to_string())
1619 }
1620}
1621
1622#[allow(non_snake_case)]
1623impl HTMLImageElementMethods<crate::DomTypeHolder> for HTMLImageElement {
1624 fn Image(
1626 window: &Window,
1627 proto: Option<HandleObject>,
1628 can_gc: CanGc,
1629 width: Option<u32>,
1630 height: Option<u32>,
1631 ) -> Fallible<DomRoot<HTMLImageElement>> {
1632 let element = Element::create(
1633 QualName::new(None, ns!(html), local_name!("img")),
1634 None,
1635 &window.Document(),
1636 ElementCreator::ScriptCreated,
1637 CustomElementCreationMode::Synchronous,
1638 proto,
1639 can_gc,
1640 );
1641
1642 let image = DomRoot::downcast::<HTMLImageElement>(element).unwrap();
1643 if let Some(w) = width {
1644 image.SetWidth(w, can_gc);
1645 }
1646 if let Some(h) = height {
1647 image.SetHeight(h, can_gc);
1648 }
1649
1650 image.update_the_image_data(can_gc);
1653
1654 Ok(image)
1655 }
1656
1657 make_getter!(Alt, "alt");
1659 make_setter!(SetAlt, "alt");
1661
1662 make_url_getter!(Src, "src");
1664
1665 make_url_setter!(SetSrc, "src");
1667
1668 make_url_getter!(Srcset, "srcset");
1670 make_url_setter!(SetSrcset, "srcset");
1672
1673 fn GetCrossOrigin(&self) -> Option<DOMString> {
1675 reflect_cross_origin_attribute(self.upcast::<Element>())
1676 }
1677
1678 fn SetCrossOrigin(&self, value: Option<DOMString>, can_gc: CanGc) {
1680 set_cross_origin_attribute(self.upcast::<Element>(), value, can_gc);
1681 }
1682
1683 make_getter!(UseMap, "usemap");
1685 make_setter!(SetUseMap, "usemap");
1687
1688 make_bool_getter!(IsMap, "ismap");
1690 make_bool_setter!(SetIsMap, "ismap");
1692
1693 fn Width(&self) -> u32 {
1695 let node = self.upcast::<Node>();
1696 node.content_box()
1697 .map(|rect| rect.size.width.to_px() as u32)
1698 .unwrap_or_else(|| self.NaturalWidth())
1699 }
1700
1701 fn SetWidth(&self, value: u32, can_gc: CanGc) {
1703 image_dimension_setter(self.upcast(), local_name!("width"), value, can_gc);
1704 }
1705
1706 fn Height(&self) -> u32 {
1708 let node = self.upcast::<Node>();
1709 node.content_box()
1710 .map(|rect| rect.size.height.to_px() as u32)
1711 .unwrap_or_else(|| self.NaturalHeight())
1712 }
1713
1714 fn SetHeight(&self, value: u32, can_gc: CanGc) {
1716 image_dimension_setter(self.upcast(), local_name!("height"), value, can_gc);
1717 }
1718
1719 fn NaturalWidth(&self) -> u32 {
1721 let request = self.current_request.borrow();
1722 let pixel_density = request.current_pixel_density.unwrap_or(1f64);
1723
1724 match request.metadata {
1725 Some(ref metadata) => (metadata.width as f64 / pixel_density) as u32,
1726 None => 0,
1727 }
1728 }
1729
1730 fn NaturalHeight(&self) -> u32 {
1732 let request = self.current_request.borrow();
1733 let pixel_density = request.current_pixel_density.unwrap_or(1f64);
1734
1735 match request.metadata {
1736 Some(ref metadata) => (metadata.height as f64 / pixel_density) as u32,
1737 None => 0,
1738 }
1739 }
1740
1741 fn Complete(&self) -> bool {
1743 let elem = self.upcast::<Element>();
1744 let srcset_absent = !elem.has_attribute(&local_name!("srcset"));
1745 if !elem.has_attribute(&local_name!("src")) && srcset_absent {
1746 return true;
1747 }
1748 let src = elem.get_string_attribute(&local_name!("src"));
1749 if srcset_absent && src.is_empty() {
1750 return true;
1751 }
1752 let request = self.current_request.borrow();
1753 let request_state = request.state;
1754 match request_state {
1755 State::CompletelyAvailable | State::Broken => true,
1756 State::PartiallyAvailable | State::Unavailable => false,
1757 }
1758 }
1759
1760 fn CurrentSrc(&self) -> USVString {
1762 let current_request = self.current_request.borrow();
1763 let url = ¤t_request.parsed_url;
1764 match *url {
1765 Some(ref url) => USVString(url.clone().into_string()),
1766 None => {
1767 let unparsed_url = ¤t_request.source_url;
1768 match *unparsed_url {
1769 Some(ref url) => url.clone(),
1770 None => USVString("".to_owned()),
1771 }
1772 },
1773 }
1774 }
1775
1776 fn ReferrerPolicy(&self) -> DOMString {
1778 reflect_referrer_policy_attribute(self.upcast::<Element>())
1779 }
1780
1781 fn SetReferrerPolicy(&self, value: DOMString, can_gc: CanGc) {
1783 let referrerpolicy_attr_name = local_name!("referrerpolicy");
1784 let element = self.upcast::<Element>();
1785 let previous_correct_attribute_value = get_correct_referrerpolicy_from_raw_token(
1786 &element.get_string_attribute(&referrerpolicy_attr_name),
1787 );
1788 let correct_value_or_empty_string = get_correct_referrerpolicy_from_raw_token(&value);
1789 if previous_correct_attribute_value != correct_value_or_empty_string {
1790 element.set_string_attribute(
1793 &referrerpolicy_attr_name,
1794 correct_value_or_empty_string,
1795 can_gc,
1796 );
1797 }
1798 }
1799
1800 fn Decode(&self, can_gc: CanGc) -> Rc<Promise> {
1802 let promise = Promise::new(&self.global(), can_gc);
1804
1805 let task = ImageElementMicrotask::Decode {
1807 elem: DomRoot::from_ref(self),
1808 promise: promise.clone(),
1809 };
1810 ScriptThread::await_stable_state(Microtask::ImageElement(task));
1811
1812 promise
1814 }
1815
1816 make_getter!(Name, "name");
1818
1819 make_atomic_setter!(SetName, "name");
1821
1822 make_getter!(Align, "align");
1824
1825 make_setter!(SetAlign, "align");
1827
1828 make_uint_getter!(Hspace, "hspace");
1830
1831 make_uint_setter!(SetHspace, "hspace");
1833
1834 make_uint_getter!(Vspace, "vspace");
1836
1837 make_uint_setter!(SetVspace, "vspace");
1839
1840 make_getter!(LongDesc, "longdesc");
1842
1843 make_setter!(SetLongDesc, "longdesc");
1845
1846 make_getter!(Border, "border");
1848
1849 make_setter!(SetBorder, "border");
1851}
1852
1853impl VirtualMethods for HTMLImageElement {
1854 fn super_type(&self) -> Option<&dyn VirtualMethods> {
1855 Some(self.upcast::<HTMLElement>() as &dyn VirtualMethods)
1856 }
1857
1858 fn adopting_steps(&self, old_doc: &Document, can_gc: CanGc) {
1859 self.super_type().unwrap().adopting_steps(old_doc, can_gc);
1860 self.update_the_image_data(can_gc);
1861 }
1862
1863 fn attribute_mutated(&self, attr: &Attr, mutation: AttributeMutation, can_gc: CanGc) {
1864 self.super_type()
1865 .unwrap()
1866 .attribute_mutated(attr, mutation, can_gc);
1867 match attr.local_name() {
1868 &local_name!("src") |
1869 &local_name!("srcset") |
1870 &local_name!("width") |
1871 &local_name!("crossorigin") |
1872 &local_name!("sizes") |
1873 &local_name!("referrerpolicy") => self.update_the_image_data(can_gc),
1874 _ => {},
1875 }
1876 }
1877
1878 fn parse_plain_attribute(&self, name: &LocalName, value: DOMString) -> AttrValue {
1879 match name {
1880 &local_name!("width") | &local_name!("height") => {
1881 AttrValue::from_dimension(value.into())
1882 },
1883 &local_name!("hspace") | &local_name!("vspace") => AttrValue::from_u32(value.into(), 0),
1884 _ => self
1885 .super_type()
1886 .unwrap()
1887 .parse_plain_attribute(name, value),
1888 }
1889 }
1890
1891 fn handle_event(&self, event: &Event, can_gc: CanGc) {
1892 if event.type_() != atom!("click") {
1893 return;
1894 }
1895
1896 let area_elements = self.areas();
1897 let elements = match area_elements {
1898 Some(x) => x,
1899 None => return,
1900 };
1901
1902 let mouse_event = match event.downcast::<MouseEvent>() {
1904 Some(x) => x,
1905 None => return,
1906 };
1907
1908 let point = Point2D::new(
1909 mouse_event.ClientX().to_f32().unwrap(),
1910 mouse_event.ClientY().to_f32().unwrap(),
1911 );
1912 let bcr = self.upcast::<Element>().GetBoundingClientRect(can_gc);
1913 let bcr_p = Point2D::new(bcr.X() as f32, bcr.Y() as f32);
1914
1915 for element in elements {
1917 let shape = element.get_shape_from_coords();
1918 let shp = match shape {
1919 Some(x) => x.absolute_coords(bcr_p),
1920 None => return,
1921 };
1922 if shp.hit_test(&point) {
1923 element.activation_behavior(event, self.upcast(), can_gc);
1924 return;
1925 }
1926 }
1927 }
1928
1929 fn bind_to_tree(&self, context: &BindContext, can_gc: CanGc) {
1930 if let Some(s) = self.super_type() {
1931 s.bind_to_tree(context, can_gc);
1932 }
1933 let document = self.owner_document();
1934 if context.tree_connected {
1935 document.register_responsive_image(self);
1936 }
1937
1938 if let Some(parent) = self.upcast::<Node>().GetParentElement() {
1941 if parent.is::<HTMLPictureElement>() {
1942 self.update_the_image_data(can_gc);
1943 }
1944 }
1945 }
1946
1947 fn unbind_from_tree(&self, context: &UnbindContext, can_gc: CanGc) {
1948 self.super_type().unwrap().unbind_from_tree(context, can_gc);
1949 let document = self.owner_document();
1950 document.unregister_responsive_image(self);
1951
1952 if context.parent.is::<HTMLPictureElement>() {
1955 self.update_the_image_data(can_gc);
1956 }
1957 }
1958}
1959
1960impl FormControl for HTMLImageElement {
1961 fn form_owner(&self) -> Option<DomRoot<HTMLFormElement>> {
1962 self.form_owner.get()
1963 }
1964
1965 fn set_form_owner(&self, form: Option<&HTMLFormElement>) {
1966 self.form_owner.set(form);
1967 }
1968
1969 fn to_element(&self) -> &Element {
1970 self.upcast::<Element>()
1971 }
1972
1973 fn is_listed(&self) -> bool {
1974 false
1975 }
1976}
1977
1978fn image_dimension_setter(element: &Element, attr: LocalName, value: u32, can_gc: CanGc) {
1979 let value = if value > UNSIGNED_LONG_MAX { 0 } else { value };
1982
1983 let pixel_value = if value > (i32::MAX / AU_PER_PX) as u32 {
1989 0
1990 } else {
1991 value
1992 };
1993
1994 let dim = LengthOrPercentageOrAuto::Length(Au::from_px(pixel_value as i32));
1995 let value = AttrValue::Dimension(value.to_string(), dim);
1996 element.set_attribute(&attr, value, can_gc);
1997}
1998
1999pub(crate) fn collect_sequence_characters(
2002 s: &str,
2003 mut predicate: impl FnMut(&char) -> bool,
2004) -> (&str, &str) {
2005 let i = s.find(|ch| !predicate(&ch)).unwrap_or(s.len());
2006 (&s[0..i], &s[i..])
2007}
2008
2009fn is_valid_non_negative_integer_string(s: &str) -> bool {
2012 s.chars().all(|c| c.is_ascii_digit())
2013}
2014
2015fn is_valid_floating_point_number_string(s: &str) -> bool {
2018 static RE: LazyLock<Regex> =
2019 LazyLock::new(|| Regex::new(r"^-?(?:\d+\.\d+|\d+|\.\d+)(?:(e|E)(\+|\-)?\d+)?$").unwrap());
2020
2021 RE.is_match(s)
2022}
2023
2024pub fn parse_a_srcset_attribute(input: &str) -> Vec<ImageSource> {
2027 let mut current_index = 0;
2030
2031 let mut candidates = vec![];
2033 while current_index < input.len() {
2034 let remaining_string = &input[current_index..];
2035
2036 let (collected_characters, string_after_whitespace) =
2043 collect_sequence_characters(remaining_string, |character| {
2044 *character == ',' || character.is_ascii_whitespace()
2045 });
2046
2047 current_index += collected_characters.len();
2050
2051 if string_after_whitespace.is_empty() {
2053 return candidates;
2054 }
2055
2056 let (url, _) =
2059 collect_sequence_characters(string_after_whitespace, |c| !char::is_ascii_whitespace(c));
2060
2061 current_index += url.len();
2064
2065 let mut descriptors = Vec::new();
2067
2068 if url.ends_with(',') {
2072 let image_source = ImageSource {
2073 url: url.trim_end_matches(',').into(),
2074 descriptor: Descriptor {
2075 width: None,
2076 density: None,
2077 },
2078 };
2079 candidates.push(image_source);
2080 continue;
2081 }
2082
2083 let descriptors_string = &input[current_index..];
2086 let (spaces, descriptors_string) =
2087 collect_sequence_characters(descriptors_string, |character| {
2088 character.is_ascii_whitespace()
2089 });
2090 current_index += spaces.len();
2091
2092 let mut current_descriptor = String::new();
2094
2095 let mut state = ParseState::InDescriptor;
2097
2098 let mut characters = descriptors_string.chars();
2102 let mut character = characters.next();
2103 if let Some(character) = character {
2104 current_index += character.len_utf8();
2105 }
2106
2107 loop {
2108 match (state, character) {
2109 (ParseState::InDescriptor, Some(character)) if character.is_ascii_whitespace() => {
2110 if !current_descriptor.is_empty() {
2114 descriptors.push(current_descriptor);
2115 current_descriptor = String::new();
2116 state = ParseState::AfterDescriptor;
2117 }
2118 },
2119 (ParseState::InDescriptor, Some(',')) => {
2120 if !current_descriptor.is_empty() {
2124 descriptors.push(current_descriptor);
2125 }
2126 break;
2127 },
2128 (ParseState::InDescriptor, Some('(')) => {
2129 current_descriptor.push('(');
2131 state = ParseState::InParens;
2132 },
2133 (ParseState::InDescriptor, Some(character)) => {
2134 current_descriptor.push(character);
2136 },
2137 (ParseState::InDescriptor, None) => {
2138 if !current_descriptor.is_empty() {
2141 descriptors.push(current_descriptor);
2142 }
2143 break;
2144 },
2145 (ParseState::InParens, Some(')')) => {
2146 current_descriptor.push(')');
2148 state = ParseState::InDescriptor;
2149 },
2150 (ParseState::InParens, Some(character)) => {
2151 current_descriptor.push(character);
2153 },
2154 (ParseState::InParens, None) => {
2155 descriptors.push(current_descriptor);
2158 break;
2159 },
2160 (ParseState::AfterDescriptor, Some(character))
2161 if character.is_ascii_whitespace() =>
2162 {
2163 },
2165 (ParseState::AfterDescriptor, Some(_)) => {
2166 state = ParseState::InDescriptor;
2169 continue;
2170 },
2171 (ParseState::AfterDescriptor, None) => {
2172 break;
2174 },
2175 }
2176
2177 character = characters.next();
2178 if let Some(character) = character {
2179 current_index += character.len_utf8();
2180 }
2181 }
2182
2183 let mut error = false;
2185 let mut width: Option<u32> = None;
2187 let mut density: Option<f64> = None;
2189 let mut future_compat_h: Option<u32> = None;
2191
2192 for descriptor in descriptors.into_iter() {
2195 let Some(last_character) = descriptor.chars().last() else {
2196 break;
2197 };
2198
2199 let first_part_of_string = &descriptor[0..descriptor.len() - last_character.len_utf8()];
2200 match last_character {
2201 'w' if is_valid_non_negative_integer_string(first_part_of_string) &&
2208 density.is_none() &&
2209 width.is_none() =>
2210 {
2211 match parse_unsigned_integer(first_part_of_string.chars()) {
2212 Ok(number) if number > 0 => {
2213 width = Some(number);
2214 continue;
2215 },
2216 _ => error = true,
2217 }
2218 },
2219
2220 'x' if is_valid_floating_point_number_string(first_part_of_string) &&
2234 width.is_none() &&
2235 density.is_none() &&
2236 future_compat_h.is_none() =>
2237 {
2238 match first_part_of_string.parse::<f64>() {
2239 Ok(number) if number.is_finite() && number >= 0. => {
2240 density = Some(number);
2241 continue;
2242 },
2243 _ => error = true,
2244 }
2245 },
2246
2247 'h' if is_valid_non_negative_integer_string(first_part_of_string) &&
2256 future_compat_h.is_none() &&
2257 density.is_none() =>
2258 {
2259 match parse_unsigned_integer(first_part_of_string.chars()) {
2260 Ok(number) if number > 0 => {
2261 future_compat_h = Some(number);
2262 continue;
2263 },
2264 _ => error = true,
2265 }
2266 },
2267
2268 _ => error = true,
2271 }
2272
2273 if error {
2274 break;
2275 }
2276 }
2277
2278 if future_compat_h.is_some() && width.is_none() {
2280 error = true;
2281 }
2282
2283 if !error {
2287 let image_source = ImageSource {
2288 url: url.into(),
2289 descriptor: Descriptor { width, density },
2290 };
2291 candidates.push(image_source);
2292 }
2293
2294 }
2296 candidates
2297}
2298
2299#[derive(Clone)]
2300enum ChangeType {
2301 Environment {
2302 selected_source: USVString,
2303 selected_pixel_density: f64,
2304 },
2305 Element,
2306}
2307
2308fn is_supported_image_mime_type(input: &str) -> bool {
2310 let mime_type = input.trim();
2312
2313 let mime_type_essence = match mime_type.find(';') {
2315 Some(semi) => &mime_type[..semi],
2316 _ => mime_type,
2317 };
2318
2319 if mime_type_essence.is_empty() {
2324 return true;
2325 }
2326
2327 SUPPORTED_IMAGE_MIME_TYPES.contains(&mime_type_essence)
2328}