@hotwired/turbo 7.0.0-rc.2 → 7.0.0

package/dist/turbo.es2017-esm.js

@@ -1,5 +1,5 @@
 /*
-Turbo 7.0.0-rc.2
+Turbo 7.0.0
 Copyright © 2021 Basecamp, LLC
  */
 (function () {
@@ -35,6 +35,8 @@ function clickCaptured(event) {
 (function () {
     if ("SubmitEvent" in window)
         return;
+    if ("submitter" in Event.prototype)
+        return;
     addEventListener("click", clickCaptured, true);
     Object.defineProperty(Event.prototype, "submitter", {
         get() {
@@ -222,11 +224,11 @@ class FetchResponse {
         return this.header("Content-Type");
     }
     get responseText() {
-        return this.response.text();
+        return this.response.clone().text();
     }
     get responseHTML() {
         if (this.isHTML) {
-            return this.response.text();
+            return this.response.clone().text();
         }
         else {
             return Promise.resolve(undefined);
@@ -239,7 +241,12 @@ class FetchResponse {
 
 function dispatch(eventName, { target, cancelable, detail } = {}) {
     const event = new CustomEvent(eventName, { cancelable, bubbles: true, detail });
-    void (target || document.documentElement).dispatchEvent(event);
+    if (target && target.isConnected) {
+        target.dispatchEvent(event);
+    }
+    else {
+        document.documentElement.dispatchEvent(event);
+    }
     return event;
 }
 function nextAnimationFrame() {
@@ -301,7 +308,7 @@ function fetchMethodFromString(method) {
     }
 }
 class FetchRequest {
-    constructor(delegate, method, location, body = new URLSearchParams) {
+    constructor(delegate, method, location, body = new URLSearchParams, target = null) {
         this.abortController = new AbortController;
         this.resolveRequestPromise = (value) => { };
         this.delegate = delegate;
@@ -314,6 +321,7 @@ class FetchRequest {
             this.body = body;
             this.url = location;
         }
+        this.target = target;
     }
     get location() {
         return this.url;
@@ -349,7 +357,7 @@ class FetchRequest {
     }
     async receive(response) {
         const fetchResponse = new FetchResponse(response);
-        const event = dispatch("turbo:before-fetch-response", { cancelable: true, detail: { fetchResponse } });
+        const event = dispatch("turbo:before-fetch-response", { cancelable: true, detail: { fetchResponse }, target: this.target });
         if (event.defaultPrevented) {
             this.delegate.requestPreventedHandlingResponse(this, fetchResponse);
         }
@@ -386,7 +394,15 @@ class FetchRequest {
     }
     async allowRequestToBeIntercepted(fetchOptions) {
         const requestInterception = new Promise(resolve => this.resolveRequestPromise = resolve);
-        const event = dispatch("turbo:before-fetch-request", { cancelable: true, detail: { fetchOptions, url: this.url.href, resume: this.resolveRequestPromise } });
+        const event = dispatch("turbo:before-fetch-request", {
+            cancelable: true,
+            detail: {
+                fetchOptions,
+                url: this.url.href,
+                resume: this.resolveRequestPromise
+            },
+            target: this.target
+        });
         if (event.defaultPrevented)
             await requestInterception;
     }
@@ -499,7 +515,7 @@ class FormSubmission {
         this.formElement = formElement;
         this.submitter = submitter;
         this.formData = buildFormData(formElement, submitter);
-        this.fetchRequest = new FetchRequest(this, this.method, this.location, this.body);
+        this.fetchRequest = new FetchRequest(this, this.method, this.location, this.body, this.formElement);
         this.mustRedirect = mustRedirect;
     }
     get method() {
@@ -1112,6 +1128,7 @@ class HeadSnapshot extends Snapshot {
         super(...arguments);
         this.detailsByOuterHTML = this.children
             .filter((element) => !elementIsNoscript(element))
+            .map((element) => elementWithoutNonce(element))
             .reduce((result, element) => {
             const { outerHTML } = element;
             const details = outerHTML in result
@@ -1196,6 +1213,12 @@ function elementIsMetaElementWithName(element, name) {
     const tagName = element.tagName.toLowerCase();
     return tagName == "meta" && element.getAttribute("name") == name;
 }
+function elementWithoutNonce(element) {
+    if (element.hasAttribute("nonce")) {
+        element.setAttribute("nonce", "");
+    }
+    return element;
+}
 
 class PageSnapshot extends Snapshot {
     constructor(element, headSnapshot) {
@@ -1581,7 +1604,7 @@ class BrowserAdapter {
     visitRequestStarted(visit) {
         this.progressBar.setValue(0);
         if (visit.hasCachedSnapshot() || visit.action != "restore") {
-            this.showProgressBarAfterDelay();
+            this.showVisitProgressBarAfterDelay();
         }
         else {
             this.showProgressBar();
@@ -1602,7 +1625,7 @@ class BrowserAdapter {
     }
     visitRequestFinished(visit) {
         this.progressBar.setValue(1);
-        this.hideProgressBar();
+        this.hideVisitProgressBar();
     }
     visitCompleted(visit) {
     }
@@ -1615,20 +1638,32 @@ class BrowserAdapter {
     }
     formSubmissionStarted(formSubmission) {
         this.progressBar.setValue(0);
-        this.showProgressBarAfterDelay();
+        this.showFormProgressBarAfterDelay();
     }
     formSubmissionFinished(formSubmission) {
         this.progressBar.setValue(1);
-        this.hideProgressBar();
+        this.hideFormProgressBar();
+    }
+    showVisitProgressBarAfterDelay() {
+        this.visitProgressBarTimeout = window.setTimeout(this.showProgressBar, this.session.progressBarDelay);
+    }
+    hideVisitProgressBar() {
+        this.progressBar.hide();
+        if (this.visitProgressBarTimeout != null) {
+            window.clearTimeout(this.visitProgressBarTimeout);
+            delete this.visitProgressBarTimeout;
+        }
     }
-    showProgressBarAfterDelay() {
-        this.progressBarTimeout = window.setTimeout(this.showProgressBar, this.session.progressBarDelay);
+    showFormProgressBarAfterDelay() {
+        if (this.formProgressBarTimeout == null) {
+            this.formProgressBarTimeout = window.setTimeout(this.showProgressBar, this.session.progressBarDelay);
+        }
     }
-    hideProgressBar() {
+    hideFormProgressBar() {
         this.progressBar.hide();
-        if (this.progressBarTimeout != null) {
-            window.clearTimeout(this.progressBarTimeout);
-            delete this.progressBarTimeout;
+        if (this.formProgressBarTimeout != null) {
+            window.clearTimeout(this.formProgressBarTimeout);
+            delete this.formProgressBarTimeout;
         }
     }
     reload() {
@@ -1719,6 +1754,7 @@ class FrameRedirector {
     linkClickIntercepted(element, url) {
         const frame = this.findFrameElement(element);
         if (frame) {
+            frame.setAttribute("reloadable", "");
             frame.src = url;
         }
     }
@@ -1726,17 +1762,18 @@ class FrameRedirector {
         return this.shouldRedirect(element, submitter);
     }
     formSubmissionIntercepted(element, submitter) {
-        const frame = this.findFrameElement(element);
+        const frame = this.findFrameElement(element, submitter);
         if (frame) {
+            frame.removeAttribute("reloadable");
             frame.delegate.formSubmissionIntercepted(element, submitter);
         }
     }
     shouldRedirect(element, submitter) {
-        const frame = this.findFrameElement(element);
+        const frame = this.findFrameElement(element, submitter);
         return frame ? frame != element.closest("turbo-frame") : false;
     }
-    findFrameElement(element) {
-        const id = element.getAttribute("data-turbo-frame");
+    findFrameElement(element, submitter) {
+        const id = (submitter === null || submitter === void 0 ? void 0 : submitter.getAttribute("data-turbo-frame")) || element.getAttribute("data-turbo-frame");
         if (id && id != "_top") {
             const frame = this.element.querySelector(`#${id}:not([disabled])`);
             if (frame instanceof FrameElement) {
@@ -2448,12 +2485,14 @@ class Session {
         this.convertLinkWithMethodClickToFormSubmission(link) || this.visit(location.href, { action });
     }
     convertLinkWithMethodClickToFormSubmission(link) {
+        var _a;
         const linkMethod = link.getAttribute("data-turbo-method");
         if (linkMethod) {
             const form = document.createElement("form");
             form.method = linkMethod;
             form.action = link.getAttribute("href") || "undefined";
-            document.body.appendChild(form);
+            form.hidden = true;
+            (_a = link.parentNode) === null || _a === void 0 ? void 0 : _a.insertBefore(form, link);
             return dispatch("submit", { cancelable: true, target: form });
         }
         else {
@@ -2762,7 +2801,7 @@ class FrameController {
         this.reloadable = false;
         this.formSubmission = new FormSubmission(this, element, submitter);
         if (this.formSubmission.fetchRequest.isIdempotent) {
-            this.navigateFrame(element, this.formSubmission.fetchRequest.url.href);
+            this.navigateFrame(element, this.formSubmission.fetchRequest.url.href, submitter);
         }
         else {
             const { fetchRequest } = this.formSubmission;
@@ -2799,7 +2838,7 @@ class FrameController {
         frame.setAttribute("busy", "");
     }
     formSubmissionSucceededWithResponse(formSubmission, response) {
-        const frame = this.findFrameElement(formSubmission.formElement);
+        const frame = this.findFrameElement(formSubmission.formElement, formSubmission.submitter);
         frame.delegate.loadResponse(response);
     }
     formSubmissionFailedWithResponse(formSubmission, fetchResponse) {
@@ -2820,7 +2859,7 @@ class FrameController {
     viewInvalidated() {
     }
     async visit(url) {
-        const request = new FetchRequest(this, FetchMethod.get, expandURL(url));
+        const request = new FetchRequest(this, FetchMethod.get, expandURL(url), undefined, this.element);
         return new Promise(resolve => {
             this.resolveVisitPromise = () => {
                 this.resolveVisitPromise = () => { };
@@ -2829,13 +2868,14 @@ class FrameController {
             request.perform();
         });
     }
-    navigateFrame(element, url) {
-        const frame = this.findFrameElement(element);
+    navigateFrame(element, url, submitter) {
+        const frame = this.findFrameElement(element, submitter);
+        frame.setAttribute("reloadable", "");
         frame.src = url;
     }
-    findFrameElement(element) {
+    findFrameElement(element, submitter) {
         var _a;
-        const id = element.getAttribute("data-turbo-frame") || this.element.getAttribute("target");
+        const id = (submitter === null || submitter === void 0 ? void 0 : submitter.getAttribute("data-turbo-frame")) || element.getAttribute("data-turbo-frame") || this.element.getAttribute("target");
         return (_a = getFrameElementById(id)) !== null && _a !== void 0 ? _a : this.element;
     }
     async extractForeignFrameElement(container) {
@@ -2857,7 +2897,7 @@ class FrameController {
         return new FrameElement();
     }
     shouldInterceptNavigation(element, submitter) {
-        const id = element.getAttribute("data-turbo-frame") || this.element.getAttribute("target");
+        const id = (submitter === null || submitter === void 0 ? void 0 : submitter.getAttribute("data-turbo-frame")) || element.getAttribute("data-turbo-frame") || this.element.getAttribute("target");
         if (!this.enabled || id == "_top") {
             return false;
         }
@@ -3105,4 +3145,3 @@ window.Turbo = Turbo;
 start();
 
 export { PageRenderer, PageSnapshot, clearCache, connectStreamSource, disconnectStreamSource, navigator, registerAdapter, renderStreamMessage, session, setProgressBarDelay, start, visit };
-//# sourceMappingURL=turbo.es2017-esm.js.map