diff --git a/CHANGELOG.md b/CHANGELOG.md index 8b7a7423..f5715000 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,8 @@ - [FIX] Truncate long profiler name in profiler popup. [#634](https://github.com/MiniProfiler/rack-mini-profiler/pull/634) - [FIX] `flamegraph_mode` query param having no effect. [#635](https://github.com/MiniProfiler/rack-mini-profiler/pull/635) - [FIX] max_traces_to_show had chance to break the profiler frontend [#297](https://github.com/MiniProfiler/rack-mini-profiler/issues/297) +- [FIX] missing badge for Turbo Drive page loads. [#631](https://github.com/MiniProfiler/rack-mini-profiler/pull/631) + ## 3.3.1 - 2024-02-15 - [FEATURE] Support dynamic `config.content_security_policy_nonce` [#609](https://github.com/MiniProfiler/rack-mini-profiler/pull/609) diff --git a/lib/html/includes.js b/lib/html/includes.js index daf252e4..2fa5ca42 100644 --- a/lib/html/includes.js +++ b/lib/html/includes.js @@ -11,6 +11,8 @@ var _MiniProfiler = (function() { // so we never pull down a profiler twice ajaxStartTime, totalsControl, + lastTurboRequestUrl, + lastTurboProfilingResult, reqs = 0, expandedResults = false, totalTime = 0, @@ -153,6 +155,8 @@ var _MiniProfiler = (function() { fetchedIds.push(id); if (json != "hidden" && MiniProfiler.templates) { + if (options.hotwireTurboDriveSupport) lastTurboProfilingResult = json; + buttonShow(json); } } @@ -172,6 +176,50 @@ var _MiniProfiler = (function() { } }; + var fetchResultsFromAsyncResponse = function fetchResultsFromAsyncResponse(response) { + try { + // look for x-mini-profile-ids + var entries = response.headers.entries(); + var _iteratorNormalCompletion = true; + var _didIteratorError = false; + var _iteratorError = undefined; + + try { + for ( + var _iterator = entries[Symbol.iterator](), _step; + !(_iteratorNormalCompletion = (_step = _iterator.next()) + .done); + _iteratorNormalCompletion = true + ) { + var pair = _step.value; + + if ( + pair[0] && + pair[0].toLowerCase() == "x-miniprofiler-ids" + ) { + var ids = pair[1].split(","); + fetchResults(ids); + } + } + } catch (err) { + _didIteratorError = true; + _iteratorError = err; + } finally { + try { + if (!_iteratorNormalCompletion && _iterator.return != null) { + _iterator.return(); + } + } finally { + if (_didIteratorError) { + throw _iteratorError; + } + } + } + } catch (e) { + console.error(e); + } + } + var toQueryString = function toQueryString(data, parentKey) { var result = []; for (var key in data) { @@ -496,10 +544,30 @@ var _MiniProfiler = (function() { }, 3000); }; + var onTurboBeforeFetchResponse = function onTurboBeforeFetchResponse(e) { + lastTurboRequestUrl = e.detail.fetchResponse.response.url; + + var response = e.detail.fetchResponse.response; + fetchResultsFromAsyncResponse(response); + } + var onTurboBeforeVisit = function onTurboBeforeVisit(e) { if(!e.defaultPrevented) { window.MiniProfilerContainer = document.querySelector('body > .profiler-results') window.MiniProfiler.pageTransition() + + var visitingUrl = e.detail.url + + // To preserve the last prefetched profiling result so badge doesn't disappear when Turbo replaces page HTML + if ( + visitingUrl === lastTurboRequestUrl && + visitingUrl !== Turbo.session.view.lastRenderedLocation.href && + lastTurboProfilingResult + ) { + buttonShow(lastTurboProfilingResult); + lastTurboProfilingResult = null; + lastTurboRequestUrl = null; + } } } @@ -670,6 +738,7 @@ var _MiniProfiler = (function() { if (options.hotwireTurboDriveSupport) { document.addEventListener("turbo:before-visit", onTurboBeforeVisit) document.addEventListener("turbo:load", onTurboLoad) + document.addEventListener("turbo:before-fetch-response", onTurboBeforeFetchResponse); } }; @@ -685,6 +754,7 @@ var _MiniProfiler = (function() { ); document.removeEventListener("turbo:before-visit", onTurboBeforeVisit); document.removeEventListener("turbo:load", onTurboLoad); + document.removeEventListener("turbo:before-fetch-response", onTurboBeforeFetchResponse); }; var initFullView = function initFullView() { @@ -963,48 +1033,9 @@ var _MiniProfiler = (function() { var originalFetchRun = __originalFetch(input, init); originalFetchRun.then(function(response) { - try { - // look for x-mini-profile-ids - var entries = response.headers.entries(); - var _iteratorNormalCompletion = true; - var _didIteratorError = false; - var _iteratorError = undefined; - - try { - for ( - var _iterator = entries[Symbol.iterator](), _step; - !(_iteratorNormalCompletion = (_step = _iterator.next()) - .done); - _iteratorNormalCompletion = true - ) { - var pair = _step.value; - - if ( - pair[0] && - pair[0].toLowerCase() == "x-miniprofiler-ids" - ) { - var ids = pair[1].split(","); - fetchResults(ids); - } - } - } catch (err) { - _didIteratorError = true; - _iteratorError = err; - } finally { - try { - if (!_iteratorNormalCompletion && _iterator.return != null) { - _iterator.return(); - } - } finally { - if (_didIteratorError) { - throw _iteratorError; - } - } - } - } catch (e) { - console.error(e); - } + fetchResultsFromAsyncResponse(response) }); + return originalFetchRun; }; }