Scaffold module script

6 files changed, 1620 insertions, 63 deletions

diff --git a/components/script/dom/globalscope.rs b/components/script/dom/globalscope.rs
index f6937427eda..04f8d948a24 100644
--- a/components/script/dom/globalscope.rs
+++ b/components/script/dom/globalscope.rs
@@ -24,6 +24,7 @@ use crate::dom::event::{Event, EventBubbles, EventCancelable, EventStatus};
 use crate::dom::eventsource::EventSource;
 use crate::dom::eventtarget::EventTarget;
 use crate::dom::file::File;
+use crate::dom::htmlscriptelement::ScriptId;
 use crate::dom::messageevent::MessageEvent;
 use crate::dom::messageport::MessagePort;
 use crate::dom::paintworkletglobalscope::PaintWorkletGlobalScope;
@@ -32,6 +33,7 @@ use crate::dom::window::Window;
 use crate::dom::workerglobalscope::WorkerGlobalScope;
 use crate::dom::workletglobalscope::WorkletGlobalScope;
 use crate::microtask::{Microtask, MicrotaskQueue};
+use crate::script_module::ModuleTree;
 use crate::script_runtime::{CommonScriptMsg, JSContext as SafeJSContext, ScriptChan, ScriptPort};
 use crate::script_thread::{MainThreadScriptChan, ScriptThread};
 use crate::task::TaskCanceller;
@@ -119,6 +121,14 @@ pub struct GlobalScope {
     /// Timers used by the Console API.
     console_timers: DomRefCell<HashMap<DOMString, u64>>,
 
+    /// module map is used when importing JavaScript modules
+    /// https://html.spec.whatwg.org/multipage/#concept-settings-object-module-map
+    #[ignore_malloc_size_of = "mozjs"]
+    module_map: DomRefCell<HashMap<ServoUrl, Rc<ModuleTree>>>,
+
+    #[ignore_malloc_size_of = "mozjs"]
+    inline_module_map: DomRefCell<HashMap<ScriptId, Rc<ModuleTree>>>,
+
     /// For providing instructions to an optional devtools server.
     #[ignore_malloc_size_of = "channels are hard"]
     devtools_chan: Option<IpcSender<ScriptToDevtoolsControlMsg>>,
@@ -391,6 +401,8 @@ impl GlobalScope {
             pipeline_id,
             devtools_wants_updates: Default::default(),
             console_timers: DomRefCell::new(Default::default()),
+            module_map: DomRefCell::new(Default::default()),
+            inline_module_map: DomRefCell::new(Default::default()),
             devtools_chan,
             mem_profiler_chan,
             time_profiler_chan,
@@ -1357,6 +1369,24 @@ impl GlobalScope {
         &self.consumed_rejections
     }
 
+    pub fn set_module_map(&self, url: ServoUrl, module: ModuleTree) {
+        self.module_map.borrow_mut().insert(url, Rc::new(module));
+    }
+
+    pub fn get_module_map(&self) -> &DomRefCell<HashMap<ServoUrl, Rc<ModuleTree>>> {
+        &self.module_map
+    }
+
+    pub fn set_inline_module_map(&self, script_id: ScriptId, module: ModuleTree) {
+        self.inline_module_map
+            .borrow_mut()
+            .insert(script_id, Rc::new(module));
+    }
+
+    pub fn get_inline_module_map(&self) -> &DomRefCell<HashMap<ScriptId, Rc<ModuleTree>>> {
+        &self.inline_module_map
+    }
+
     #[allow(unsafe_code)]
     pub fn get_cx(&self) -> SafeJSContext {
         unsafe { SafeJSContext::from_ptr(Runtime::get()) }
diff --git a/components/script/dom/htmlscriptelement.rs b/components/script/dom/htmlscriptelement.rs
index fdeca285e30..b594660a835 100644
--- a/components/script/dom/htmlscriptelement.rs
+++ b/components/script/dom/htmlscriptelement.rs
@@ -12,6 +12,7 @@ use crate::dom::bindings::inheritance::Castable;
 use crate::dom::bindings::refcounted::Trusted;
 use crate::dom::bindings::reflector::DomObject;
 use crate::dom::bindings::root::{Dom, DomRoot};
+use crate::dom::bindings::settings_stack::AutoEntryScript;
 use crate::dom::bindings::str::{DOMString, USVString};
 use crate::dom::document::Document;
 use crate::dom::element::{
@@ -27,6 +28,8 @@ use crate::dom::performanceresourcetiming::InitiatorType;
 use crate::dom::virtualmethods::VirtualMethods;
 use crate::fetch::create_a_potential_CORS_request;
 use crate::network_listener::{self, NetworkListener, PreInvoke, ResourceTimingListener};
+use crate::script_module::fetch_inline_module_script;
+use crate::script_module::{fetch_external_module_script, ModuleOwner};
 use content_security_policy as csp;
 use dom_struct::dom_struct;
 use encoding_rs::Encoding;
@@ -51,6 +54,10 @@ use std::sync::{Arc, Mutex};
 use style::str::{StaticStringVec, HTML_SPACE_CHARACTERS};
 use uuid::Uuid;
 
+/// An unique id for script element.
+#[derive(Clone, Copy, Debug, Eq, Hash, JSTraceable, PartialEq)]
+pub struct ScriptId(Uuid);
+
 #[dom_struct]
 pub struct HTMLScriptElement {
     htmlelement: HTMLElement,
@@ -71,6 +78,10 @@ pub struct HTMLScriptElement {
 
     /// Track line line_number
     line_number: u64,
+
+    /// Unique id for each script element
+    #[ignore_malloc_size_of = "Defined in uuid"]
+    id: ScriptId,
 }
 
 impl HTMLScriptElement {
@@ -81,6 +92,7 @@ impl HTMLScriptElement {
         creator: ElementCreator,
     ) -> HTMLScriptElement {
         HTMLScriptElement {
+            id: ScriptId(Uuid::new_v4()),
             htmlelement: HTMLElement::new_inherited(local_name, prefix, document),
             already_started: Cell::new(false),
             parser_inserted: Cell::new(creator.is_parser_created()),
@@ -105,11 +117,15 @@ impl HTMLScriptElement {
             HTMLScriptElementBinding::Wrap,
         )
     }
+
+    pub fn get_script_id(&self) -> ScriptId {
+        self.id.clone()
+    }
 }
 
 /// Supported script types as defined by
 /// <https://html.spec.whatwg.org/multipage/#javascript-mime-type>.
-static SCRIPT_JS_MIMES: StaticStringVec = &[
+pub static SCRIPT_JS_MIMES: StaticStringVec = &[
     "application/ecmascript",
     "application/javascript",
     "application/x-ecmascript",
@@ -143,7 +159,7 @@ pub struct ScriptOrigin {
 }
 
 impl ScriptOrigin {
-    fn internal(text: DOMString, url: ServoUrl, type_: ScriptType) -> ScriptOrigin {
+    pub fn internal(text: DOMString, url: ServoUrl, type_: ScriptType) -> ScriptOrigin {
         ScriptOrigin {
             text: text,
             url: url,
@@ -152,7 +168,7 @@ impl ScriptOrigin {
         }
     }
 
-    fn external(text: DOMString, url: ServoUrl, type_: ScriptType) -> ScriptOrigin {
+    pub fn external(text: DOMString, url: ServoUrl, type_: ScriptType) -> ScriptOrigin {
         ScriptOrigin {
             text: text,
             url: url,
@@ -160,6 +176,10 @@ impl ScriptOrigin {
             type_,
         }
     }
+
+    pub fn text(&self) -> DOMString {
+        self.text.clone()
+    }
 }
 
 pub type ScriptResult = Result<ScriptOrigin, NetworkError>;
@@ -441,23 +461,25 @@ impl HTMLScriptElement {
         }
 
         // Step 14.
-        let for_attribute = element.get_attribute(&ns!(), &local_name!("for"));
-        let event_attribute = element.get_attribute(&ns!(), &local_name!("event"));
-        match (for_attribute, event_attribute) {
-            (Some(ref for_attribute), Some(ref event_attribute)) => {
-                let for_value = for_attribute.value().to_ascii_lowercase();
-                let for_value = for_value.trim_matches(HTML_SPACE_CHARACTERS);
-                if for_value != "window" {
-                    return;
-                }
+        if script_type == ScriptType::Classic {
+            let for_attribute = element.get_attribute(&ns!(), &local_name!("for"));
+            let event_attribute = element.get_attribute(&ns!(), &local_name!("event"));
+            match (for_attribute, event_attribute) {
+                (Some(ref for_attribute), Some(ref event_attribute)) => {
+                    let for_value = for_attribute.value().to_ascii_lowercase();
+                    let for_value = for_value.trim_matches(HTML_SPACE_CHARACTERS);
+                    if for_value != "window" {
+                        return;
+                    }
 
-                let event_value = event_attribute.value().to_ascii_lowercase();
-                let event_value = event_value.trim_matches(HTML_SPACE_CHARACTERS);
-                if event_value != "onload" && event_value != "onload()" {
-                    return;
-                }
-            },
-            (_, _) => (),
+                    let event_value = event_attribute.value().to_ascii_lowercase();
+                    let event_value = event_value.trim_matches(HTML_SPACE_CHARACTERS);
+                    if event_value != "onload" && event_value != "onload()" {
+                        return;
+                    }
+                },
+                (_, _) => (),
+            }
         }
 
         // Step 15.
@@ -514,6 +536,7 @@ impl HTMLScriptElement {
                 },
             };
 
+            // Step 24.6.
             match script_type {
                 ScriptType::Classic => {
                     // Preparation for step 26.
@@ -555,50 +578,66 @@ impl HTMLScriptElement {
                     }
                 },
                 ScriptType::Module => {
-                    warn!(
-                        "{} is a module script. It should be fixed after #23545 landed.",
-                        url.clone()
+                    fetch_external_module_script(
+                        ModuleOwner::Window(Trusted::new(self)),
+                        url.clone(),
+                        Destination::Script,
                     );
-                    self.global().issue_page_warning(&format!(
-                        "Module scripts are not supported; {} will not be executed.",
-                        url.clone()
-                    ));
+
+                    if !r#async && was_parser_inserted {
+                        doc.add_deferred_script(self);
+                    } else if !r#async && !self.non_blocking.get() {
+                        doc.push_asap_in_order_script(self);
+                    } else {
+                        doc.add_asap_script(self);
+                    };
                 },
             }
         } else {
             // Step 25.
             assert!(!text.is_empty());
 
-            // Step 25-1.
+            // Step 25-1. & 25-2.
             let result = Ok(ScriptOrigin::internal(
                 text.clone(),
                 base_url.clone(),
                 script_type.clone(),
             ));
 
-            // TODO: Step 25-2.
-            if let ScriptType::Module = script_type {
-                warn!(
-                    "{} is a module script. It should be fixed after #23545 landed.",
-                    base_url.clone()
-                );
-                self.global().issue_page_warning(
-                    "Module scripts are not supported; ignoring inline module script.",
-                );
-                return;
-            }
+            // Step 25-2.
+            match script_type {
+                ScriptType::Classic => {
+                    if was_parser_inserted &&
+                        doc.get_current_parser()
+                            .map_or(false, |parser| parser.script_nesting_level() <= 1) &&
+                        doc.get_script_blocking_stylesheets_count() > 0
+                    {
+                        // Step 26.h: classic, has no src, was parser-inserted, is blocked on stylesheet.
+                        doc.set_pending_parsing_blocking_script(self, Some(result));
+                    } else {
+                        // Step 26.i: otherwise.
+                        self.execute(result);
+                    }
+                },
+                ScriptType::Module => {
+                    // We should add inline module script elements
+                    // into those vectors in case that there's no
+                    // descendants in the inline module script.
+                    if !r#async && was_parser_inserted {
+                        doc.add_deferred_script(self);
+                    } else if !r#async && !self.non_blocking.get() {
+                        doc.push_asap_in_order_script(self);
+                    } else {
+                        doc.add_asap_script(self);
+                    };
 
-            // Step 26.
-            if was_parser_inserted &&
-                doc.get_current_parser()
-                    .map_or(false, |parser| parser.script_nesting_level() <= 1) &&
-                doc.get_script_blocking_stylesheets_count() > 0
-            {
-                // Step 26.h: classic, has no src, was parser-inserted, is blocked on stylesheet.
-                doc.set_pending_parsing_blocking_script(self, Some(result));
-            } else {
-                // Step 26.i: otherwise.
-                self.execute(result);
+                    fetch_inline_module_script(
+                        ModuleOwner::Window(Trusted::new(self)),
+                        text.clone(),
+                        base_url.clone(),
+                        self.id.clone(),
+                    );
+                },
             }
         }
     }
@@ -656,7 +695,7 @@ impl HTMLScriptElement {
     }
 
     /// <https://html.spec.whatwg.org/multipage/#execute-the-script-block>
-    pub fn execute(&self, result: Result<ScriptOrigin, NetworkError>) {
+    pub fn execute(&self, result: ScriptResult) {
         // Step 1.
         let doc = document_from_node(self);
         if self.parser_inserted.get() && &*doc != &*self.parser_document {
@@ -674,10 +713,12 @@ impl HTMLScriptElement {
             Ok(script) => script,
         };
 
-        self.unminify_js(&mut script);
+        if script.type_ == ScriptType::Classic {
+            self.unminify_js(&mut script);
+        }
 
         // Step 3.
-        let neutralized_doc = if script.external {
+        let neutralized_doc = if script.external || script.type_ == ScriptType::Module {
             debug!("loading external script, url = {}", script.url);
             let doc = document_from_node(self);
             doc.incr_ignore_destructive_writes_counter();
@@ -690,21 +731,24 @@ impl HTMLScriptElement {
         let document = document_from_node(self);
         let old_script = document.GetCurrentScript();
 
-        // Step 5.a.1.
-        document.set_current_script(Some(self));
-
-        // Step 5.a.2.
-        self.run_a_classic_script(&script);
-
-        // Step 6.
-        document.set_current_script(old_script.as_deref());
+        match script.type_ {
+            ScriptType::Classic => {
+                document.set_current_script(Some(self));
+                self.run_a_classic_script(&script);
+                document.set_current_script(old_script.as_deref());
+            },
+            ScriptType::Module => {
+                assert!(old_script.is_none());
+                self.run_a_module_script(&script, false);
+            },
+        }
 
-        // Step 7.
+        // Step 5.
         if let Some(doc) = neutralized_doc {
             doc.decr_ignore_destructive_writes_counter();
         }
 
-        // Step 8.
+        // Step 6.
         if script.external {
             self.dispatch_load_event();
         }
@@ -736,6 +780,72 @@ impl HTMLScriptElement {
         );
     }
 
+    #[allow(unsafe_code)]
+    /// https://html.spec.whatwg.org/multipage/#run-a-module-script
+    pub fn run_a_module_script(&self, script: &ScriptOrigin, _rethrow_errors: bool) {
+        // TODO use a settings object rather than this element's document/window
+        // Step 2
+        let document = document_from_node(self);
+        if !document.is_fully_active() || !document.is_scripting_enabled() {
+            return;
+        }
+
+        // Step 4
+        let window = window_from_node(self);
+        let global = window.upcast::<GlobalScope>();
+        let _aes = AutoEntryScript::new(&global);
+
+        if script.external {
+            let module_map = global.get_module_map().borrow();
+
+            if let Some(module_tree) = module_map.get(&script.url) {
+                // Step 6.
+                {
+                    let module_error = module_tree.get_error().borrow();
+                    if module_error.is_some() {
+                        module_tree.report_error(&global);
+                        return;
+                    }
+                }
+
+                let module_record = module_tree.get_record().borrow();
+                if let Some(record) = &*module_record {
+                    let evaluated = module_tree.execute_module(global, record.handle());
+
+                    if let Err(exception) = evaluated {
+                        module_tree.set_error(Some(exception.clone()));
+                        module_tree.report_error(&global);
+                        return;
+                    }
+                }
+            }
+        } else {
+            let inline_module_map = global.get_inline_module_map().borrow();
+
+            if let Some(module_tree) = inline_module_map.get(&self.id.clone()) {
+                // Step 6.
+                {
+                    let module_error = module_tree.get_error().borrow();
+                    if module_error.is_some() {
+                        module_tree.report_error(&global);
+                        return;
+                    }
+                }
+
+                let module_record = module_tree.get_record().borrow();
+                if let Some(record) = &*module_record {
+                    let evaluated = module_tree.execute_module(global, record.handle());
+
+                    if let Err(exception) = evaluated {
+                        module_tree.set_error(Some(exception.clone()));
+                        module_tree.report_error(&global);
+                        return;
+                    }
+                }
+            }
+        }
+    }
+
     pub fn queue_error_event(&self) {
         let window = window_from_node(self);
         window
@@ -818,10 +928,18 @@ impl HTMLScriptElement {
         self.parser_inserted.set(parser_inserted);
     }
 
+    pub fn get_parser_inserted(&self) -> bool {
+        self.parser_inserted.get()
+    }
+
     pub fn set_already_started(&self, already_started: bool) {
         self.already_started.set(already_started);
     }
 
+    pub fn get_non_blocking(&self) -> bool {
+        self.non_blocking.get()
+    }
+
     fn dispatch_event(
         &self,
         type_: Atom,
diff --git a/components/script/dom/promise.rs b/components/script/dom/promise.rs
index d2e209b98dd..785c1be8939 100644
--- a/components/script/dom/promise.rs
+++ b/components/script/dom/promise.rs
@@ -225,7 +225,7 @@ impl Promise {
     }
 
     #[allow(unsafe_code)]
-    fn promise_obj(&self) -> HandleObject {
+    pub fn promise_obj(&self) -> HandleObject {
         let obj = self.reflector().get_jsobject();
         unsafe {
             assert!(IsPromiseObject(obj));
diff --git a/components/script/lib.rs b/components/script/lib.rs
index 79c0657b996..2ae7f76923a 100644
--- a/components/script/lib.rs
+++ b/components/script/lib.rs
@@ -83,6 +83,8 @@ mod microtask;
 #[warn(deprecated)]
 mod network_listener;
 #[warn(deprecated)]
+mod script_module;
+#[warn(deprecated)]
 pub mod script_runtime;
 #[warn(deprecated)]
 #[allow(unsafe_code)]
diff --git a/components/script/script_module.rs b/components/script/script_module.rs
new file mode 100644
index 00000000000..9a1c297aac0
--- /dev/null
+++ b/components/script/script_module.rs
@@ -0,0 +1,1404 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+//! The script module mod contains common traits and structs
+//! related to `type=module` for script thread or worker threads.
+
+use crate::compartments::{enter_realm, AlreadyInCompartment, InCompartment};
+use crate::document_loader::LoadType;
+use crate::dom::bindings::cell::DomRefCell;
+use crate::dom::bindings::codegen::Bindings::WindowBinding::WindowBinding::WindowMethods;
+use crate::dom::bindings::conversions::jsstring_to_str;
+use crate::dom::bindings::error::report_pending_exception;
+use crate::dom::bindings::error::Error;
+use crate::dom::bindings::inheritance::Castable;
+use crate::dom::bindings::refcounted::{Trusted, TrustedPromise};
+use crate::dom::bindings::reflector::DomObject;
+use crate::dom::bindings::root::DomRoot;
+use crate::dom::bindings::settings_stack::AutoIncumbentScript;
+use crate::dom::bindings::str::DOMString;
+use crate::dom::bindings::trace::RootedTraceableBox;
+use crate::dom::document::Document;
+use crate::dom::element::Element;
+use crate::dom::globalscope::GlobalScope;
+use crate::dom::htmlscriptelement::{HTMLScriptElement, ScriptId};
+use crate::dom::htmlscriptelement::{ScriptOrigin, ScriptType, SCRIPT_JS_MIMES};
+use crate::dom::node::document_from_node;
+use crate::dom::performanceresourcetiming::InitiatorType;
+use crate::dom::promise::Promise;
+use crate::dom::promisenativehandler::{Callback, PromiseNativeHandler};
+use crate::dom::window::Window;
+use crate::dom::worker::TrustedWorkerAddress;
+use crate::network_listener::{self, NetworkListener};
+use crate::network_listener::{PreInvoke, ResourceTimingListener};
+use crate::task::TaskBox;
+use crate::task_source::TaskSourceName;
+use encoding_rs::UTF_8;
+use hyper_serde::Serde;
+use ipc_channel::ipc;
+use ipc_channel::router::ROUTER;
+use js::glue::{AppendToAutoObjectVector, CreateAutoObjectVector};
+use js::jsapi::Handle as RawHandle;
+use js::jsapi::HandleObject;
+use js::jsapi::HandleValue as RawHandleValue;
+use js::jsapi::{AutoObjectVector, JSAutoRealm, JSObject, JSString};
+use js::jsapi::{GetModuleResolveHook, JSRuntime, SetModuleResolveHook};
+use js::jsapi::{GetRequestedModules, SetModuleMetadataHook};
+use js::jsapi::{GetWaitForAllPromise, ModuleEvaluate, ModuleInstantiate, SourceText};
+use js::jsapi::{Heap, JSContext, JS_ClearPendingException, SetModulePrivate};
+use js::jsapi::{SetModuleDynamicImportHook, SetScriptPrivateReferenceHooks};
+use js::jsval::{JSVal, PrivateValue, UndefinedValue};
+use js::rust::jsapi_wrapped::{CompileModule, JS_GetArrayLength, JS_GetElement};
+use js::rust::jsapi_wrapped::{GetRequestedModuleSpecifier, JS_GetPendingException};
+use js::rust::wrappers::JS_SetPendingException;
+use js::rust::CompileOptionsWrapper;
+use js::rust::IntoHandle;
+use js::rust::{Handle, HandleValue};
+use net_traits::request::{Destination, ParserMetadata, Referrer, RequestBuilder, RequestMode};
+use net_traits::{FetchMetadata, Metadata};
+use net_traits::{FetchResponseListener, NetworkError};
+use net_traits::{ResourceFetchTiming, ResourceTimingType};
+use servo_url::ServoUrl;
+use std::cmp::Ordering;
+use std::collections::{HashMap, HashSet};
+use std::ffi;
+use std::marker::PhantomData;
+use std::ptr;
+use std::rc::Rc;
+use std::sync::{Arc, Mutex};
+use url::ParseError as UrlParseError;
+
+pub fn get_source_text(source: &[u16]) -> SourceText<u16> {
+    SourceText {
+        units_: source.as_ptr() as *const _,
+        length_: source.len() as u32,
+        ownsUnits_: false,
+        _phantom_0: PhantomData,
+    }
+}
+
+#[allow(unsafe_code)]
+unsafe fn gen_type_error(global: &GlobalScope, string: String) -> ModuleError {
+    rooted!(in(*global.get_cx()) let mut thrown = UndefinedValue());
+    Error::Type(string).to_jsval(*global.get_cx(), &global, thrown.handle_mut());
+
+    return ModuleError::RawException(RootedTraceableBox::from_box(Heap::boxed(thrown.get())));
+}
+
+#[derive(JSTraceable)]
+pub struct ModuleObject(Box<Heap<*mut JSObject>>);
+
+impl ModuleObject {
+    #[allow(unsafe_code)]
+    pub fn handle(&self) -> HandleObject {
+        unsafe { self.0.handle() }
+    }
+}
+
+#[derive(JSTraceable)]
+pub enum ModuleError {
+    Network(NetworkError),
+    RawException(RootedTraceableBox<Heap<JSVal>>),
+}
+
+impl Eq for ModuleError {}
+
+impl PartialEq for ModuleError {
+    fn eq(&self, other: &Self) -> bool {
+        match (self, other) {
+            (Self::Network(_), Self::RawException(_)) |
+            (Self::RawException(_), Self::Network(_)) => false,
+            _ => true,
+        }
+    }
+}
+
+impl Ord for ModuleError {
+    fn cmp(&self, other: &Self) -> Ordering {
+        match (self, other) {
+            (Self::Network(_), Self::RawException(_)) => Ordering::Greater,
+            (Self::RawException(_), Self::Network(_)) => Ordering::Less,
+            _ => Ordering::Equal,
+        }
+    }
+}
+
+impl PartialOrd for ModuleError {
+    fn partial_cmp(&self, other: &Self) -> Option<Ordering> {
+        Some(self.cmp(other))
+    }
+}
+
+impl ModuleError {
+    #[allow(unsafe_code)]
+    pub fn handle(&self) -> Handle<JSVal> {
+        match self {
+            Self::Network(_) => unreachable!(),
+            Self::RawException(exception) => exception.handle(),
+        }
+    }
+}
+
+impl Clone for ModuleError {
+    fn clone(&self) -> Self {
+        match self {
+            Self::Network(network_error) => Self::Network(network_error.clone()),
+            Self::RawException(exception) => Self::RawException(RootedTraceableBox::from_box(
+                Heap::boxed(exception.get().clone()),
+            )),
+        }
+    }
+}
+
+struct ModuleScript {
+    base_url: ServoUrl,
+}
+
+#[derive(JSTraceable)]
+pub struct ModuleTree {
+    url: ServoUrl,
+    text: DomRefCell<DOMString>,
+    record: DomRefCell<Option<ModuleObject>>,
+    status: DomRefCell<ModuleStatus>,
+    parent_urls: DomRefCell<HashSet<ServoUrl>>,
+    descendant_urls: DomRefCell<HashSet<ServoUrl>>,
+    visited_urls: DomRefCell<HashSet<ServoUrl>>,
+    error: DomRefCell<Option<ModuleError>>,
+    promise: DomRefCell<Option<Rc<Promise>>>,
+}
+
+impl ModuleTree {
+    pub fn new(url: ServoUrl) -> Self {
+        ModuleTree {
+            url,
+            text: DomRefCell::new(DOMString::new()),
+            record: DomRefCell::new(None),
+            status: DomRefCell::new(ModuleStatus::Initial),
+            parent_urls: DomRefCell::new(HashSet::new()),
+            descendant_urls: DomRefCell::new(HashSet::new()),
+            visited_urls: DomRefCell::new(HashSet::new()),
+            error: DomRefCell::new(None),
+            promise: DomRefCell::new(None),
+        }
+    }
+
+    pub fn get_promise(&self) -> &DomRefCell<Option<Rc<Promise>>> {
+        &self.promise
+    }
+
+    pub fn set_promise(&self, promise: Rc<Promise>) {
+        *self.promise.borrow_mut() = Some(promise);
+    }
+
+    pub fn get_status(&self) -> ModuleStatus {
+        self.status.borrow().clone()
+    }
+
+    pub fn set_status(&self, status: ModuleStatus) {
+        *self.status.borrow_mut() = status;
+    }
+
+    pub fn get_record(&self) -> &DomRefCell<Option<ModuleObject>> {
+        &self.record
+    }
+
+    pub fn set_record(&self, record: ModuleObject) {
+        *self.record.borrow_mut() = Some(record);
+    }
+
+    pub fn get_error(&self) -> &DomRefCell<Option<ModuleError>> {
+        &self.error
+    }
+
+    pub fn set_error(&self, error: Option<ModuleError>) {
+        *self.error.borrow_mut() = error;
+    }
+
+    pub fn get_text(&self) -> &DomRefCell<DOMString> {
+        &self.text
+    }
+
+    pub fn set_text(&self, module_text: DOMString) {
+        *self.text.borrow_mut() = module_text;
+    }
+
+    pub fn get_parent_urls(&self) -> &DomRefCell<HashSet<ServoUrl>> {
+        &self.parent_urls
+    }
+
+    pub fn insert_parent_url(&self, parent_url: ServoUrl) {
+        self.parent_urls.borrow_mut().insert(parent_url);
+    }
+
+    pub fn append_parent_urls(&self, parent_urls: HashSet<ServoUrl>) {
+        self.parent_urls.borrow_mut().extend(parent_urls);
+    }
+
+    pub fn get_descendant_urls(&self) -> &DomRefCell<HashSet<ServoUrl>> {
+        &self.descendant_urls
+    }
+
+    pub fn append_descendant_urls(&self, descendant_urls: HashSet<ServoUrl>) {
+        self.descendant_urls.borrow_mut().extend(descendant_urls);
+    }
+
+    /// recursively checks if all of the transitive descendants are
+    /// in the FetchingDescendants or later status
+    fn recursive_check_descendants(
+        module_tree: &ModuleTree,
+        module_map: &HashMap<ServoUrl, Rc<ModuleTree>>,
+        discovered_urls: &mut HashSet<ServoUrl>,
+    ) -> bool {
+        discovered_urls.insert(module_tree.url.clone());
+
+        let descendant_urls = module_tree.descendant_urls.borrow();
+
+        for descendant_module in descendant_urls
+            .iter()
+            .filter_map(|url| module_map.get(&url.clone()))
+        {
+            if discovered_urls.contains(&descendant_module.url) {
+                continue;
+            }
+
+            let descendant_status = descendant_module.get_status();
+            if descendant_status < ModuleStatus::FetchingDescendants {
+                return false;
+            }
+
+            let all_ready_descendants = ModuleTree::recursive_check_descendants(
+                &descendant_module,
+                module_map,
+                discovered_urls,
+            );
+
+            if !all_ready_descendants {
+                return false;
+            }
+        }
+
+        return true;
+    }
+
+    fn has_all_ready_descendants(&self, module_map: &HashMap<ServoUrl, Rc<ModuleTree>>) -> bool {
+        let mut discovered_urls = HashSet::new();
+
+        return ModuleTree::recursive_check_descendants(&self, module_map, &mut discovered_urls);
+    }
+
+    pub fn get_visited_urls(&self) -> &DomRefCell<HashSet<ServoUrl>> {
+        &self.visited_urls
+    }
+
+    pub fn append_handler(&self, owner: ModuleOwner, module_url: ServoUrl, is_top_level: bool) {
+        let promise = self.promise.borrow();
+
+        let resolve_this = owner.clone();
+        let reject_this = owner.clone();
+
+        let resolved_url = module_url.clone();
+        let rejected_url = module_url.clone();
+
+        let handler = PromiseNativeHandler::new(
+            &owner.global(),
+            Some(ModuleHandler::new(Box::new(
+                task!(fetched_resolve: move || {
+                    resolve_this.finish_module_load(Some(resolved_url), is_top_level);
+                }),
+            ))),
+            Some(ModuleHandler::new(Box::new(
+                task!(failure_reject: move || {
+                    reject_this.finish_module_load(Some(rejected_url), is_top_level);
+                }),
+            ))),
+        );
+
+        let _compartment = enter_realm(&*owner.global());
+        AlreadyInCompartment::assert(&*owner.global());
+        let _ais = AutoIncumbentScript::new(&*owner.global());
+
+        let promise = promise.as_ref().unwrap();
+
+        promise.append_native_handler(&handler);
+    }
+}
+
+#[derive(Clone, Copy, Debug, JSTraceable, PartialEq, PartialOrd)]
+pub enum ModuleStatus {
+    Initial,
+    Fetching,
+    FetchingDescendants,
+    FetchFailed,
+    Ready,
+    Finished,
+}
+
+impl ModuleTree {
+    #[allow(unsafe_code)]
+    /// https://html.spec.whatwg.org/multipage/#creating-a-module-script
+    /// Step 7-11.
+    fn compile_module_script(
+        &self,
+        global: &GlobalScope,
+        module_script_text: DOMString,
+        url: ServoUrl,
+    ) -> Result<ModuleObject, ModuleError> {
+        let module: Vec<u16> = module_script_text.encode_utf16().collect();
+
+        let url_cstr = ffi::CString::new(url.as_str().as_bytes()).unwrap();
+
+        let _ac = JSAutoRealm::new(*global.get_cx(), *global.reflector().get_jsobject());
+
+        let compile_options = CompileOptionsWrapper::new(*global.get_cx(), url_cstr.as_ptr(), 1);
+
+        rooted!(in(*global.get_cx()) let mut module_script = ptr::null_mut::<JSObject>());
+
+        let mut source = get_source_text(&module);
+
+        unsafe {
+            if !CompileModule(
+                *global.get_cx(),
+                compile_options.ptr,
+                &mut source,
+                &mut module_script.handle_mut(),
+            ) {
+                warn!("fail to compile module script of {}", url);
+
+                rooted!(in(*global.get_cx()) let mut exception = UndefinedValue());
+                assert!(JS_GetPendingException(
+                    *global.get_cx(),
+                    &mut exception.handle_mut()
+                ));
+                JS_ClearPendingException(*global.get_cx());
+
+                return Err(ModuleError::RawException(RootedTraceableBox::from_box(
+                    Heap::boxed(exception.get()),
+                )));
+            }
+
+            let module_script_data = Box::new(ModuleScript {
+                base_url: url.clone(),
+            });
+
+            SetModulePrivate(
+                module_script.get(),
+                &PrivateValue(Box::into_raw(module_script_data) as *const _),
+            );
+        }
+
+        debug!("module script of {} compile done", url);
+
+        self.resolve_requested_module_specifiers(
+            &global,
+            module_script.handle().into_handle(),
+            url.clone(),
+        )
+        .map(|_| ModuleObject(Heap::boxed(*module_script)))
+    }
+
+    #[allow(unsafe_code)]
+    pub fn instantiate_module_tree(
+        &self,
+        global: &GlobalScope,
+        module_record: HandleObject,
+    ) -> Result<(), ModuleError> {
+        let _ac = JSAutoRealm::new(*global.get_cx(), *global.reflector().get_jsobject());
+
+        unsafe {
+            if !ModuleInstantiate(*global.get_cx(), module_record) {
+                warn!("fail to instantiate module");
+
+                rooted!(in(*global.get_cx()) let mut exception = UndefinedValue());
+                assert!(JS_GetPendingException(
+                    *global.get_cx(),
+                    &mut exception.handle_mut()
+                ));
+                JS_ClearPendingException(*global.get_cx());
+
+                Err(ModuleError::RawException(RootedTraceableBox::from_box(
+                    Heap::boxed(exception.get()),
+                )))
+            } else {
+                debug!("module instantiated successfully");
+
+                Ok(())
+            }
+        }
+    }
+
+    #[allow(unsafe_code)]
+    pub fn execute_module(
+        &self,
+        global: &GlobalScope,
+        module_record: HandleObject,
+    ) -> Result<(), ModuleError> {
+        let _ac = JSAutoRealm::new(*global.get_cx(), *global.reflector().get_jsobject());
+
+        unsafe {
+            if !ModuleEvaluate(*global.get_cx(), module_record) {
+                warn!("fail to evaluate module");
+
+                rooted!(in(*global.get_cx()) let mut exception = UndefinedValue());
+                assert!(JS_GetPendingException(
+                    *global.get_cx(),
+                    &mut exception.handle_mut()
+                ));
+                JS_ClearPendingException(*global.get_cx());
+
+                Err(ModuleError::RawException(RootedTraceableBox::from_box(
+                    Heap::boxed(exception.get()),
+                )))
+            } else {
+                debug!("module evaluated successfully");
+                Ok(())
+            }
+        }
+    }
+
+    #[allow(unsafe_code)]
+    pub fn report_error(&self, global: &GlobalScope) {
+        let module_error = self.error.borrow();
+
+        if let Some(exception) = &*module_error {
+            unsafe {
+                JS_SetPendingException(*global.get_cx(), exception.handle());
+                report_pending_exception(*global.get_cx(), true);
+            }
+        }
+    }
+
+    /// https://html.spec.whatwg.org/multipage/#fetch-the-descendants-of-a-module-script
+    /// Step 5.
+    pub fn resolve_requested_modules(
+        &self,
+        global: &GlobalScope,
+    ) -> Result<HashSet<ServoUrl>, ModuleError> {
+        let status = self.get_status();
+
+        assert_ne!(status, ModuleStatus::Initial);
+        assert_ne!(status, ModuleStatus::Fetching);
+
+        let record = self.record.borrow();
+
+        if let Some(raw_record) = &*record {
+            let valid_specifier_urls = self.resolve_requested_module_specifiers(
+                &global,
+                raw_record.handle(),
+                self.url.clone(),
+            );
+
+            return valid_specifier_urls.map(|parsed_urls| {
+                parsed_urls
+                    .iter()
+                    .filter_map(|parsed_url| {
+                        let mut visited = self.visited_urls.borrow_mut();
+
+                        if !visited.contains(&parsed_url) {
+                            visited.insert(parsed_url.clone());
+
+                            Some(parsed_url.clone())
+                        } else {
+                            None
+                        }
+                    })
+                    .collect::<HashSet<ServoUrl>>()
+            });
+        }
+
+        unreachable!("Didn't have record while resolving its requested module")
+    }
+
+    #[allow(unsafe_code)]
+    fn resolve_requested_module_specifiers(
+        &self,
+        global: &GlobalScope,
+        module_object: HandleObject,
+        base_url: ServoUrl,
+    ) -> Result<HashSet<ServoUrl>, ModuleError> {
+        let _ac = JSAutoRealm::new(*global.get_cx(), *global.reflector().get_jsobject());
+
+        let mut specifier_urls = HashSet::new();
+
+        unsafe {
+            rooted!(in(*global.get_cx()) let requested_modules = GetRequestedModules(*global.get_cx(), module_object));
+
+            let mut length = 0;
+
+            if !JS_GetArrayLength(*global.get_cx(), requested_modules.handle(), &mut length) {
+                let module_length_error =
+                    gen_type_error(&global, "Wrong length of requested modules".to_owned());
+
+                return Err(module_length_error);
+            }
+
+            for index in 0..length {
+                rooted!(in(*global.get_cx()) let mut element = UndefinedValue());
+
+                if !JS_GetElement(
+                    *global.get_cx(),
+                    requested_modules.handle(),
+                    index,
+                    &mut element.handle_mut(),
+                ) {
+                    let get_element_error =
+                        gen_type_error(&global, "Failed to get requested module".to_owned());
+
+                    return Err(get_element_error);
+                }
+
+                rooted!(in(*global.get_cx()) let specifier = GetRequestedModuleSpecifier(
+                    *global.get_cx(), element.handle()
+                ));
+
+                let url = ModuleTree::resolve_module_specifier(
+                    *global.get_cx(),
+                    &base_url,
+                    specifier.handle().into_handle(),
+                );
+
+                if url.is_err() {
+                    let specifier_error =
+                        gen_type_error(&global, "Wrong module specifier".to_owned());
+
+                    return Err(specifier_error);
+                }
+
+                specifier_urls.insert(url.unwrap());
+            }
+        }
+
+        Ok(specifier_urls)
+    }
+
+    /// The following module specifiers are allowed by the spec:
+    ///  - a valid absolute URL
+    ///  - a valid relative URL that starts with "/", "./" or "../"
+    ///
+    /// Bareword module specifiers are currently disallowed as these may be given
+    /// special meanings in the future.
+    /// https://html.spec.whatwg.org/multipage/#resolve-a-module-specifier
+    #[allow(unsafe_code)]
+    fn resolve_module_specifier(
+        cx: *mut JSContext,
+        url: &ServoUrl,
+        specifier: RawHandle<*mut JSString>,
+    ) -> Result<ServoUrl, UrlParseError> {
+        let specifier_str = unsafe { jsstring_to_str(cx, *specifier) };
+
+        // Step 1.
+        if let Ok(specifier_url) = ServoUrl::parse(&specifier_str) {
+            return Ok(specifier_url);
+        }
+
+        // Step 2.
+        if !specifier_str.starts_with("/") &&
+            !specifier_str.starts_with("./") &&
+            !specifier_str.starts_with("../")
+        {
+            return Err(UrlParseError::InvalidDomainCharacter);
+        }
+
+        // Step 3.
+        return ServoUrl::parse_with_base(Some(url), &specifier_str.clone());
+    }
+
+    /// https://html.spec.whatwg.org/multipage/#finding-the-first-parse-error
+    fn find_first_parse_error(
+        global: &GlobalScope,
+        module_tree: &ModuleTree,
+        discovered_urls: &mut HashSet<ServoUrl>,
+    ) -> Option<ModuleError> {
+        // 3.
+        discovered_urls.insert(module_tree.url.clone());
+
+        // 4.
+        let module_map = global.get_module_map().borrow();
+        let record = module_tree.get_record().borrow();
+        if record.is_none() {
+            let module_error = module_tree.get_error().borrow();
+
+            return module_error.clone();
+        }
+
+        // 5-6.
+        let descendant_urls = module_tree.get_descendant_urls().borrow();
+
+        for descendant_module in descendant_urls
+            .iter()
+            // 7.
+            .filter_map(|url| module_map.get(&url.clone()))
+        {
+            // 8-2.
+            if discovered_urls.contains(&descendant_module.url) {
+                continue;
+            }
+
+            // 8-3.
+            let child_parse_error =
+                ModuleTree::find_first_parse_error(&global, &descendant_module, discovered_urls);
+
+            // 8-4.
+            if child_parse_error.is_some() {
+                return child_parse_error;
+            }
+        }
+
+        // Step 9.
+        return None;
+    }
+}
+
+#[derive(JSTraceable, MallocSizeOf)]
+struct ModuleHandler {
+    #[ignore_malloc_size_of = "Measuring trait objects is hard"]
+    task: DomRefCell<Option<Box<dyn TaskBox>>>,
+}
+
+impl ModuleHandler {
+    pub fn new(task: Box<dyn TaskBox>) -> Box<dyn Callback> {
+        Box::new(Self {
+            task: DomRefCell::new(Some(task)),
+        })
+    }
+}
+
+impl Callback for ModuleHandler {
+    fn callback(&self, _cx: *mut JSContext, _v: HandleValue) {
+        let task = self.task.borrow_mut().take().unwrap();
+        task.run_box();
+    }
+}
+
+/// The owner of the module
+/// It can be `worker` or `script` element
+#[derive(Clone)]
+pub enum ModuleOwner {
+    #[allow(dead_code)]
+    Worker(TrustedWorkerAddress),
+    Window(Trusted<HTMLScriptElement>),
+}
+
+impl ModuleOwner {
+    pub fn global(&self) -> DomRoot<GlobalScope> {
+        match &self {
+            ModuleOwner::Worker(worker) => (*worker.root().clone()).global(),
+            ModuleOwner::Window(script) => (*script.root()).global(),
+        }
+    }
+
+    fn gen_promise_with_final_handler(
+        &self,
+        module_url: Option<ServoUrl>,
+        is_top_level: bool,
+    ) -> Rc<Promise> {
+        let resolve_this = self.clone();
+        let reject_this = self.clone();
+
+        let resolved_url = module_url.clone();
+        let rejected_url = module_url.clone();
+
+        let handler = PromiseNativeHandler::new(
+            &self.global(),
+            Some(ModuleHandler::new(Box::new(
+                task!(fetched_resolve: move || {
+                    resolve_this.finish_module_load(resolved_url, is_top_level);
+                }),
+            ))),
+            Some(ModuleHandler::new(Box::new(
+                task!(failure_reject: move || {
+                    reject_this.finish_module_load(rejected_url, is_top_level);
+                }),
+            ))),
+        );
+
+        let compartment = enter_realm(&*self.global());
+        let comp = InCompartment::Entered(&compartment);
+        let _ais = AutoIncumbentScript::new(&*self.global());
+
+        let promise = Promise::new_in_current_compartment(&self.global(), comp);
+
+        promise.append_native_handler(&handler);
+
+        promise
+    }
+
+    /// https://html.spec.whatwg.org/multipage/#fetch-the-descendants-of-and-link-a-module-script
+    /// step 4-7.
+    pub fn finish_module_load(&self, module_url: Option<ServoUrl>, is_top_level: bool) {
+        match &self {
+            ModuleOwner::Worker(_) => unimplemented!(),
+            ModuleOwner::Window(script) => {
+                let global = self.global();
+
+                let document = document_from_node(&*script.root());
+
+                let module_map = global.get_module_map().borrow();
+
+                let (module_tree, mut load) = if let Some(script_src) = module_url.clone() {
+                    let module_tree = module_map.get(&script_src.clone()).unwrap().clone();
+
+                    let load = Ok(ScriptOrigin::external(
+                        module_tree.get_text().borrow().clone(),
+                        script_src.clone(),
+                        ScriptType::Module,
+                    ));
+
+                    debug!(
+                        "Going to finish external script from {}",
+                        script_src.clone()
+                    );
+
+                    (module_tree, load)
+                } else {
+                    let module_tree = {
+                        let inline_module_map = global.get_inline_module_map().borrow();
+                        inline_module_map
+                            .get(&script.root().get_script_id())
+                            .unwrap()
+                            .clone()
+                    };
+
+                    let base_url = document.base_url();
+
+                    let load = Ok(ScriptOrigin::internal(
+                        module_tree.get_text().borrow().clone(),
+                        base_url.clone(),
+                        ScriptType::Module,
+                    ));
+
+                    debug!("Going to finish internal script from {}", base_url.clone());
+
+                    (module_tree, load)
+                };
+
+                module_tree.set_status(ModuleStatus::Finished);
+
+                if !module_tree.has_all_ready_descendants(&module_map) {
+                    return;
+                }
+
+                let parent_urls = module_tree.get_parent_urls().borrow();
+                let parent_all_ready = parent_urls
+                    .iter()
+                    .filter_map(|parent_url| module_map.get(&parent_url.clone()))
+                    .all(|parent_tree| parent_tree.has_all_ready_descendants(&module_map));
+
+                if !parent_all_ready {
+                    return;
+                }
+
+                parent_urls
+                    .iter()
+                    .filter_map(|parent_url| module_map.get(&parent_url.clone()))
+                    .for_each(|parent_tree| {
+                        let parent_promise = parent_tree.get_promise().borrow();
+                        if let Some(promise) = parent_promise.as_ref() {
+                            promise.resolve_native(&());
+                        }
+                    });
+
+                let mut discovered_urls: HashSet<ServoUrl> = HashSet::new();
+                let module_error =
+                    ModuleTree::find_first_parse_error(&global, &module_tree, &mut discovered_urls);
+
+                match module_error {
+                    None => {
+                        let module_record = module_tree.get_record().borrow();
+                        if let Some(record) = &*module_record {
+                            let instantiated =
+                                module_tree.instantiate_module_tree(&global, record.handle());
+
+                            if let Err(exception) = instantiated {
+                                module_tree.set_error(Some(exception.clone()));
+                            }
+                        }
+                    },
+                    Some(ModuleError::RawException(exception)) => {
+                        module_tree.set_error(Some(ModuleError::RawException(exception)));
+                    },
+                    Some(ModuleError::Network(network_error)) => {
+                        module_tree.set_error(Some(ModuleError::Network(network_error.clone())));
+
+                        // Change the `result` load of the script into `network` error
+                        load = Err(network_error);
+                    },
+                };
+
+                if is_top_level {
+                    let r#async = script
+                        .root()
+                        .upcast::<Element>()
+                        .has_attribute(&local_name!("async"));
+
+                    if !r#async && (&*script.root()).get_parser_inserted() {
+                        document.deferred_script_loaded(&*script.root(), load);
+                    } else if !r#async && !(&*script.root()).get_non_blocking() {
+                        document.asap_in_order_script_loaded(&*script.root(), load);
+                    } else {
+                        document.asap_script_loaded(&*script.root(), load);
+                    };
+                }
+            },
+        }
+    }
+}
+
+/// The context required for asynchronously loading an external module script source.
+struct ModuleContext {
+    /// The owner of the module that initiated the request.
+    owner: ModuleOwner,
+    /// The response body received to date.
+    data: Vec<u8>,
+    /// The response metadata received to date.
+    metadata: Option<Metadata>,
+    /// The initial URL requested.
+    url: ServoUrl,
+    /// Destination of current module context
+    destination: Destination,
+    /// Indicates whether the request failed, and why
+    status: Result<(), NetworkError>,
+    /// Timing object for this resource
+    resource_timing: ResourceFetchTiming,
+}
+
+impl FetchResponseListener for ModuleContext {
+    fn process_request_body(&mut self) {} // TODO(cybai): Perhaps add custom steps to perform fetch here?
+
+    fn process_request_eof(&mut self) {} // TODO(cybai): Perhaps add custom steps to perform fetch here?
+
+    fn process_response(&mut self, metadata: Result<FetchMetadata, NetworkError>) {
+        self.metadata = metadata.ok().map(|meta| match meta {
+            FetchMetadata::Unfiltered(m) => m,
+            FetchMetadata::Filtered { unsafe_, .. } => unsafe_,
+        });
+
+        let status_code = self
+            .metadata
+            .as_ref()
+            .and_then(|m| match m.status {
+                Some((c, _)) => Some(c),
+                _ => None,
+            })
+            .unwrap_or(0);
+
+        self.status = match status_code {
+            0 => Err(NetworkError::Internal(
+                "No http status code received".to_owned(),
+            )),
+            200..=299 => Ok(()), // HTTP ok status codes
+            _ => Err(NetworkError::Internal(format!(
+                "HTTP error code {}",
+                status_code
+            ))),
+        };
+    }
+
+    fn process_response_chunk(&mut self, mut chunk: Vec<u8>) {
+        if self.status.is_ok() {
+            self.data.append(&mut chunk);
+        }
+    }
+
+    /// <https://html.spec.whatwg.org/multipage/#fetch-a-single-module-script>
+    /// Step 9-12
+    #[allow(unsafe_code)]
+    fn process_response_eof(&mut self, response: Result<ResourceFetchTiming, NetworkError>) {
+        let global = self.owner.global();
+
+        if let Some(window) = global.downcast::<Window>() {
+            window
+                .Document()
+                .finish_load(LoadType::Script(self.url.clone()));
+        }
+
+        // Step 9-1 & 9-2.
+        let load = response.and(self.status.clone()).and_then(|_| {
+            // Step 9-3.
+            let meta = self.metadata.take().unwrap();
+
+            if let Some(content_type) = meta.content_type.map(Serde::into_inner) {
+                if !SCRIPT_JS_MIMES.contains(&content_type.to_string().as_str()) {
+                    return Err(NetworkError::Internal("Invalid MIME type".to_owned()));
+                }
+            }
+
+            // Step 10.
+            let (source_text, _, _) = UTF_8.decode(&self.data);
+            Ok(ScriptOrigin::external(
+                DOMString::from(source_text),
+                meta.final_url,
+                ScriptType::Module,
+            ))
+        });
+
+        if let Err(err) = load {
+            // Step 9.
+            warn!("Failed to fetch {}", self.url.clone());
+            let module_tree = {
+                let module_map = global.get_module_map().borrow();
+                module_map.get(&self.url.clone()).unwrap().clone()
+            };
+
+            module_tree.set_status(ModuleStatus::FetchFailed);
+
+            module_tree.set_error(Some(ModuleError::Network(err)));
+
+            let promise = module_tree.get_promise().borrow();
+            promise.as_ref().unwrap().resolve_native(&());
+
+            return;
+        }
+
+        // Step 12.
+        if let Ok(ref resp_mod_script) = load {
+            let module_tree = {
+                let module_map = global.get_module_map().borrow();
+                module_map.get(&self.url.clone()).unwrap().clone()
+            };
+
+            module_tree.set_text(resp_mod_script.text());
+
+            let compiled_module = module_tree.compile_module_script(
+                &global,
+                resp_mod_script.text(),
+                self.url.clone(),
+            );
+
+            match compiled_module {
+                Err(exception) => {
+                    module_tree.set_error(Some(exception));
+
+                    let promise = module_tree.get_promise().borrow();
+                    promise.as_ref().unwrap().resolve_native(&());
+
+                    return;
+                },
+                Ok(record) => {
+                    module_tree.set_record(record);
+
+                    {
+                        let mut visited = module_tree.get_visited_urls().borrow_mut();
+                        visited.insert(self.url.clone());
+                    }
+
+                    let descendant_results = fetch_module_descendants_and_link(
+                        &self.owner,
+                        &module_tree,
+                        self.destination.clone(),
+                    );
+
+                    // Resolve the request of this module tree promise directly
+                    // when there's no descendant
+                    if descendant_results.is_none() {
+                        module_tree.set_status(ModuleStatus::Ready);
+
+                        let promise = module_tree.get_promise().borrow();
+                        promise.as_ref().unwrap().resolve_native(&());
+                    }
+                },
+            }
+        }
+    }
+
+    fn resource_timing_mut(&mut self) -> &mut ResourceFetchTiming {
+        &mut self.resource_timing
+    }
+
+    fn resource_timing(&self) -> &ResourceFetchTiming {
+        &self.resource_timing
+    }
+
+    fn submit_resource_timing(&mut self) {
+        network_listener::submit_timing(self)
+    }
+}
+
+impl ResourceTimingListener for ModuleContext {
+    fn resource_timing_information(&self) -> (InitiatorType, ServoUrl) {
+        let initiator_type = InitiatorType::LocalName("module".to_string());
+        (initiator_type, self.url.clone())
+    }
+
+    fn resource_timing_global(&self) -> DomRoot<GlobalScope> {
+        self.owner.global()
+    }
+}
+
+impl PreInvoke for ModuleContext {}
+
+#[allow(unsafe_code)]
+/// A function to register module hooks (e.g. listening on resolving modules,
+/// getting module metadata, getting script private reference and resolving dynamic import)
+pub unsafe fn EnsureModuleHooksInitialized(rt: *mut JSRuntime) {
+    if GetModuleResolveHook(rt).is_some() {
+        return;
+    }
+
+    SetModuleResolveHook(rt, Some(HostResolveImportedModule));
+    SetModuleMetadataHook(rt, None);
+    SetScriptPrivateReferenceHooks(rt, None, None);
+
+    SetModuleDynamicImportHook(rt, None);
+}
+
+#[allow(unsafe_code)]
+/// https://tc39.github.io/ecma262/#sec-hostresolveimportedmodule
+/// https://html.spec.whatwg.org/multipage/#hostresolveimportedmodule(referencingscriptormodule%2C-specifier)
+unsafe extern "C" fn HostResolveImportedModule(
+    cx: *mut JSContext,
+    reference_private: RawHandleValue,
+    specifier: RawHandle<*mut JSString>,
+) -> *mut JSObject {
+    let global_scope = GlobalScope::from_context(cx);
+
+    // Step 2.
+    let mut base_url = global_scope.api_base_url();
+
+    // Step 3.
+    let module_data = (reference_private.to_private() as *const ModuleScript).as_ref();
+    if let Some(data) = module_data {
+        base_url = data.base_url.clone();
+    }
+
+    // Step 5.
+    let url = ModuleTree::resolve_module_specifier(*global_scope.get_cx(), &base_url, specifier);
+
+    // Step 6.
+    assert!(url.is_ok());
+
+    let parsed_url = url.unwrap();
+
+    // Step 4 & 7.
+    let module_map = global_scope.get_module_map().borrow();
+
+    let module_tree = module_map.get(&parsed_url);
+
+    // Step 9.
+    assert!(module_tree.is_some());
+
+    let fetched_module_object = module_tree.unwrap().get_record().borrow();
+
+    // Step 8.
+    assert!(fetched_module_object.is_some());
+
+    // Step 10.
+    if let Some(record) = &*fetched_module_object {
+        return record.handle().get();
+    }
+
+    unreachable!()
+}
+
+/// https://html.spec.whatwg.org/multipage/#fetch-a-module-script-tree
+pub fn fetch_external_module_script(
+    owner: ModuleOwner,
+    url: ServoUrl,
+    destination: Destination,
+) -> Rc<Promise> {
+    // Step 1.
+    fetch_single_module_script(
+        owner,
+        url,
+        destination,
+        Referrer::Client,
+        ParserMetadata::NotParserInserted,
+        None,
+        true,
+    )
+}
+
+/// https://html.spec.whatwg.org/multipage/#fetch-a-single-module-script
+pub fn fetch_single_module_script(
+    owner: ModuleOwner,
+    url: ServoUrl,
+    destination: Destination,
+    referrer: Referrer,
+    parser_metadata: ParserMetadata,
+    parent_url: Option<ServoUrl>,
+    top_level_module_fetch: bool,
+) -> Rc<Promise> {
+    {
+        // Step 1.
+        let global = owner.global();
+        let module_map = global.get_module_map().borrow();
+
+        debug!("Start to fetch {}", url.clone());
+
+        if let Some(module_tree) = module_map.get(&url.clone()) {
+            let status = module_tree.get_status();
+
+            let promise = module_tree.get_promise().borrow();
+
+            debug!(
+                "Meet a fetched url {} and its status is {:?}",
+                url.clone(),
+                status
+            );
+
+            assert!(promise.is_some());
+
+            module_tree.append_handler(owner.clone(), url.clone(), top_level_module_fetch);
+
+            let promise = promise.as_ref().unwrap();
+
+            match status {
+                ModuleStatus::Initial => unreachable!(
+                    "We have the module in module map so its status should not be `initial`"
+                ),
+                // Step 2.
+                ModuleStatus::Fetching => return promise.clone(),
+                ModuleStatus::FetchingDescendants => {
+                    if module_tree.has_all_ready_descendants(&module_map) {
+                        let module_error = module_tree.get_error().borrow();
+
+                        if module_error.is_some() {
+                            promise.resolve_native(&());
+                        } else {
+                            promise.resolve_native(&());
+                        }
+                    }
+                },
+                // Step 3.
+                ModuleStatus::FetchFailed | ModuleStatus::Ready | ModuleStatus::Finished => {
+                    let module_error = module_tree.get_error().borrow();
+
+                    if module_error.is_some() {
+                        promise.resolve_native(&());
+                    } else {
+                        promise.resolve_native(&());
+                    }
+                },
+            }
+
+            return promise.clone();
+        }
+    }
+
+    let global = owner.global();
+
+    let module_tree = ModuleTree::new(url.clone());
+    module_tree.set_status(ModuleStatus::Fetching);
+
+    let promise = owner.gen_promise_with_final_handler(Some(url.clone()), top_level_module_fetch);
+
+    module_tree.set_promise(promise.clone());
+    if let Some(parent_url) = parent_url {
+        module_tree.insert_parent_url(parent_url);
+    }
+
+    // Step 4.
+    global.set_module_map(url.clone(), module_tree);
+
+    // Step 5-6.
+    let mode = match destination.clone() {
+        Destination::Worker | Destination::SharedWorker if top_level_module_fetch => {
+            RequestMode::SameOrigin
+        },
+        _ => RequestMode::CorsMode,
+    };
+
+    let document: Option<DomRoot<Document>> = match &owner {
+        ModuleOwner::Worker(_) => None,
+        ModuleOwner::Window(script) => Some(document_from_node(&*script.root())),
+    };
+
+    // Step 7-8.
+    let request = RequestBuilder::new(url.clone())
+        .destination(destination.clone())
+        .origin(global.origin().immutable().clone())
+        .referrer(Some(referrer))
+        .parser_metadata(parser_metadata)
+        .mode(mode);
+
+    let context = Arc::new(Mutex::new(ModuleContext {
+        owner,
+        data: vec![],
+        metadata: None,
+        url: url.clone(),
+        destination: destination.clone(),
+        status: Ok(()),
+        resource_timing: ResourceFetchTiming::new(ResourceTimingType::Resource),
+    }));
+
+    let (action_sender, action_receiver) = ipc::channel().unwrap();
+
+    let listener = NetworkListener {
+        context,
+        task_source: global.networking_task_source(),
+        canceller: Some(global.task_canceller(TaskSourceName::Networking)),
+    };
+
+    ROUTER.add_route(
+        action_receiver.to_opaque(),
+        Box::new(move |message| {
+            listener.notify_fetch(message.to().unwrap());
+        }),
+    );
+
+    if let Some(doc) = document {
+        doc.fetch_async(LoadType::Script(url), request, action_sender);
+    }
+
+    promise
+}
+
+#[allow(unsafe_code)]
+/// https://html.spec.whatwg.org/multipage/#fetch-an-inline-module-script-graph
+pub fn fetch_inline_module_script(
+    owner: ModuleOwner,
+    module_script_text: DOMString,
+    url: ServoUrl,
+    script_id: ScriptId,
+) {
+    let global = owner.global();
+
+    let module_tree = ModuleTree::new(url.clone());
+
+    let promise = owner.gen_promise_with_final_handler(None, true);
+
+    module_tree.set_promise(promise.clone());
+
+    let compiled_module =
+        module_tree.compile_module_script(&global, module_script_text, url.clone());
+
+    match compiled_module {
+        Ok(record) => {
+            module_tree.set_record(record);
+
+            let descendant_results =
+                fetch_module_descendants_and_link(&owner, &module_tree, Destination::Script);
+
+            global.set_inline_module_map(script_id, module_tree);
+
+            if descendant_results.is_none() {
+                promise.resolve_native(&());
+            }
+        },
+        Err(exception) => {
+            module_tree.set_status(ModuleStatus::Ready);
+            module_tree.set_error(Some(exception));
+            global.set_inline_module_map(script_id, module_tree);
+            promise.resolve_native(&());
+        },
+    }
+}
+
+/// https://html.spec.whatwg.org/multipage/#fetch-the-descendants-of-and-link-a-module-script
+/// Step 1-3.
+#[allow(unsafe_code)]
+fn fetch_module_descendants_and_link(
+    owner: &ModuleOwner,
+    module_tree: &ModuleTree,
+    destination: Destination,
+) -> Option<Rc<Promise>> {
+    let descendant_results = fetch_module_descendants(owner, module_tree, destination);
+
+    match descendant_results {
+        Ok(descendants) => {
+            if descendants.len() > 0 {
+                unsafe {
+                    let global = owner.global();
+
+                    let _compartment = enter_realm(&*global);
+                    AlreadyInCompartment::assert(&*global);
+                    let _ais = AutoIncumbentScript::new(&*global);
+
+                    let abv = CreateAutoObjectVector(*global.get_cx());
+
+                    for descendant in descendants {
+                        assert!(AppendToAutoObjectVector(
+                            abv as *mut AutoObjectVector,
+                            descendant.promise_obj().get()
+                        ));
+                    }
+
+                    rooted!(in(*global.get_cx()) let raw_promise_all = GetWaitForAllPromise(*global.get_cx(), abv));
+
+                    let promise_all =
+                        Promise::new_with_js_promise(raw_promise_all.handle(), global.get_cx());
+
+                    let promise = module_tree.get_promise().borrow();
+                    let promise = promise.as_ref().unwrap().clone();
+
+                    let resolve_promise = TrustedPromise::new(promise.clone());
+                    let reject_promise = TrustedPromise::new(promise.clone());
+
+                    let handler = PromiseNativeHandler::new(
+                        &global,
+                        Some(ModuleHandler::new(Box::new(
+                            task!(all_fetched_resolve: move || {
+                                let promise = resolve_promise.root();
+                                promise.resolve_native(&());
+                            }),
+                        ))),
+                        Some(ModuleHandler::new(Box::new(
+                            task!(all_failure_reject: move || {
+                                let promise = reject_promise.root();
+                                promise.reject_native(&());
+                            }),
+                        ))),
+                    );
+
+                    promise_all.append_native_handler(&handler);
+
+                    return Some(promise_all);
+                }
+            }
+        },
+        Err(err) => {
+            module_tree.set_error(Some(err));
+        },
+    }
+
+    None
+}
+
+#[allow(unsafe_code)]
+/// https://html.spec.whatwg.org/multipage/#fetch-the-descendants-of-a-module-script
+fn fetch_module_descendants(
+    owner: &ModuleOwner,
+    module_tree: &ModuleTree,
+    destination: Destination,
+) -> Result<Vec<Rc<Promise>>, ModuleError> {
+    debug!("Start to load dependencies of {}", module_tree.url.clone());
+
+    let global = owner.global();
+
+    module_tree.set_status(ModuleStatus::FetchingDescendants);
+
+    module_tree
+        .resolve_requested_modules(&global)
+        .map(|requested_urls| {
+            module_tree.append_descendant_urls(requested_urls.clone());
+
+            let parent_urls = module_tree.get_parent_urls().borrow();
+
+            if parent_urls.intersection(&requested_urls).count() > 0 {
+                return Vec::new();
+            }
+
+            requested_urls
+                .iter()
+                .map(|requested_url| {
+                    // https://html.spec.whatwg.org/multipage/#internal-module-script-graph-fetching-procedure
+                    // Step 1.
+                    {
+                        let visited = module_tree.get_visited_urls().borrow();
+                        assert!(visited.get(&requested_url).is_some());
+                    }
+
+                    // Step 2.
+                    fetch_single_module_script(
+                        owner.clone(),
+                        requested_url.clone(),
+                        destination.clone(),
+                        Referrer::Client,
+                        ParserMetadata::NotParserInserted,
+                        Some(module_tree.url.clone()),
+                        false,
+                    )
+                })
+                .collect()
+        })
+}
diff --git a/components/script/script_runtime.rs b/components/script/script_runtime.rs
index 3f82e3496e6..284c49312c6 100644
--- a/components/script/script_runtime.rs
+++ b/components/script/script_runtime.rs
@@ -30,6 +30,7 @@ use crate::dom::promise::Promise;
 use crate::dom::promiserejectionevent::PromiseRejectionEvent;
 use crate::dom::response::Response;
 use crate::microtask::{EnqueuedPromiseCallback, Microtask, MicrotaskQueue};
+use crate::script_module::EnsureModuleHooksInitialized;
 use crate::script_thread::trace_thread;
 use crate::task::TaskBox;
 use crate::task_source::networking::NetworkingTaskSource;
@@ -498,6 +499,8 @@ unsafe fn new_rt_and_cx_with_parent(
     SetJobQueue(cx, job_queue);
     SetPromiseRejectionTrackerCallback(cx, Some(promise_rejection_tracker), ptr::null_mut());
 
+    EnsureModuleHooksInitialized(runtime.rt());
+
     set_gc_zeal_options(cx);
 
     // Enable or disable the JITs.