diff --git a/application/Filters/DebugToolbar.php b/application/Filters/DebugToolbar.php index 878a52387923..d28b45554a19 100644 --- a/application/Filters/DebugToolbar.php +++ b/application/Filters/DebugToolbar.php @@ -71,9 +71,11 @@ public function after(RequestInterface $request, ResponseInterface $response) } $script = PHP_EOL - . '' + . '' + . '' . PHP_EOL; if (strpos($response->getBody(), '') !== false) diff --git a/system/Debug/Toolbar.php b/system/Debug/Toolbar.php index ce96b098277d..7f46f354ae24 100644 --- a/system/Debug/Toolbar.php +++ b/system/Debug/Toolbar.php @@ -196,6 +196,11 @@ public function run($startTime, $totalTime, $request, $response): string $data['config'] = \CodeIgniter\Debug\Toolbar\Collectors\Config::display(); + if( $response->CSP !== null ) + { + $response->CSP->addImageSrc( 'data:' ); + } + return json_encode($data); } @@ -273,6 +278,7 @@ protected static function format(string $data, string $format = 'html') switch ($format) { case 'html': + $data['styles'] = []; extract($data); $parser = Services::parser(BASEPATH . 'Debug/Toolbar/Views/', null,false); ob_start(); @@ -283,8 +289,6 @@ protected static function format(string $data, string $format = 'html') case 'json': $output = json_encode($data); break; - case 'json': - $output = json_encode($data); case 'xml': $formatter = new XMLFormatter; $output = $formatter->format($data); @@ -306,27 +310,31 @@ protected static function format(string $data, string $format = 'html') * * @return string */ - protected static function renderTimeline(array $collectors, $startTime, int $segmentCount, int $segmentDuration): string + protected static function renderTimeline(array $collectors, $startTime, int $segmentCount, int $segmentDuration, array& $styles ): string { $displayTime = $segmentCount*$segmentDuration; $rows = self::collectTimelineData($collectors); $output = ''; + $styleCount = 0; foreach ($rows as $row) { $output .= ""; $output .= "{$row['name']}"; $output .= "{$row['component']}"; - $output .= "".number_format($row['duration']*1000, 2)." ms"; - $output .= ""; + $output .= "".number_format($row['duration']*1000, 2)." ms"; + $output .= ""; $offset = ((($row['start']-$startTime)*1000)/$displayTime)*100; $length = (($row['duration']*1000)/$displayTime)*100; - $output .= ""; $output .= ""; $output .= ""; + + $styleCount++; } return $output; diff --git a/system/Debug/Toolbar/Views/_config.tpl.php b/system/Debug/Toolbar/Views/_config.tpl.php index 7e3f2bcc4700..b05ce5f7775f 100644 --- a/system/Debug/Toolbar/Views/_config.tpl.php +++ b/system/Debug/Toolbar/Views/_config.tpl.php @@ -1,4 +1,4 @@ -

+

Read the CodeIgniter docs...

diff --git a/system/Debug/Toolbar/Views/_database.tpl.php b/system/Debug/Toolbar/Views/_database.tpl.php index ace8da2c95eb..b5cf1a43a7d7 100644 --- a/system/Debug/Toolbar/Views/_database.tpl.php +++ b/system/Debug/Toolbar/Views/_database.tpl.php @@ -1,7 +1,7 @@ - + diff --git a/system/Debug/Toolbar/Views/_events.tpl.php b/system/Debug/Toolbar/Views/_events.tpl.php index 72be9b97c696..88d732f41d5d 100644 --- a/system/Debug/Toolbar/Views/_events.tpl.php +++ b/system/Debug/Toolbar/Views/_events.tpl.php @@ -1,7 +1,7 @@
TimeTime Query String
- + diff --git a/system/Debug/Toolbar/Views/_files.tpl.php b/system/Debug/Toolbar/Views/_files.tpl.php index 7328e39bc4b3..9c992ab715c3 100644 --- a/system/Debug/Toolbar/Views/_files.tpl.php +++ b/system/Debug/Toolbar/Views/_files.tpl.php @@ -8,7 +8,7 @@ {/userFiles} {coreFiles} - + {/coreFiles} diff --git a/system/Debug/Toolbar/Views/_history.tpl.php b/system/Debug/Toolbar/Views/_history.tpl.php index e777b89d2abf..9db00ecc4679 100644 --- a/system/Debug/Toolbar/Views/_history.tpl.php +++ b/system/Debug/Toolbar/Views/_history.tpl.php @@ -13,10 +13,10 @@ {files} - - + diff --git a/system/Debug/Toolbar/Views/toolbar.css b/system/Debug/Toolbar/Views/toolbar.css index 079157021d92..64caffaaeb8d 100644 --- a/system/Debug/Toolbar/Views/toolbar.css +++ b/system/Debug/Toolbar/Views/toolbar.css @@ -356,3 +356,46 @@ display: none !important; } } + +/** +simple styles to replace inline styles + */ +.debug-bar-width30 { + width: 30%; +} + +.debug-bar-width10 { + width: 10%; +} + +.debug-bar-width70p { + width: 70px; +} + +.debug-bar-width140p { + width: 140px; +} + +.debug-bar-width20e { + width: 20em; +} + +.debug-bar-width6r { + width: 6rem; +} + +.debug-bar-ndisplay { + display: none; +} + +.debug-bar-alignRight { + text-align: right; +} + +.debug-bar-alignLeft { + text-align: left; +} + +.debug-bar-noverflow { + overflow: hidden; +} diff --git a/system/Debug/Toolbar/Views/toolbar.tpl.php b/system/Debug/Toolbar/Views/toolbar.tpl.php index 44baeab7619a..9ec05e4ee5b6 100644 --- a/system/Debug/Toolbar/Views/toolbar.tpl.php +++ b/system/Debug/Toolbar/Views/toolbar.tpl.php @@ -5,7 +5,7 @@ -
TimeTime Event Name Times Called
{name}{name} {path}
+ {datetime}{datetime} {status} {method} {url}
@@ -270,5 +270,11 @@ setData($config)->render('_config.tpl') ?> - + diff --git a/system/Debug/Toolbar/toolbarloader.js.php b/system/Debug/Toolbar/toolbarloader.js.php index 7aafb90ad652..d1e09df0eb11 100644 --- a/system/Debug/Toolbar/toolbarloader.js.php +++ b/system/Debug/Toolbar/toolbarloader.js.php @@ -18,12 +18,36 @@ function loadDoc(time) { if (!toolbar) { toolbar = document.createElement('div'); toolbar.setAttribute('id', 'toolbarContainer'); - toolbar.innerHTML = this.responseText; document.body.appendChild(toolbar); - } else { - toolbar.innerHTML = this.responseText; } - eval(document.getElementById("toolbar_js").innerHTML); + + // copy for easier manipulation + let responseText = this.responseText; + + // get csp blocked parts + // the style block is the first and starts at 0 + { + let PosBeg = responseText.indexOf( '>', responseText.indexOf( '', PosBeg ); + document.getElementById( 'debugbar_dynamic_style' ).innerHTML = responseText.substr( PosBeg, PosEnd ) + responseText = responseText.substr( PosEnd + 8 ); + } + // the script block starts right after style blocks ended + { + let PosBeg = responseText.indexOf( '>', responseText.indexOf( '' ); + document.getElementById( 'debugbar_dynamic_script' ).innerHTML = responseText.substr( PosBeg, PosEnd - PosBeg ); + responseText = responseText.substr( PosEnd + 9 ); + } + // check for last style block + { + let PosBeg = responseText.indexOf( '>', responseText.lastIndexOf( '', PosBeg ); + document.getElementById( 'debugbar_dynamic_style' ).innerHTML += responseText.substr( PosBeg, PosEnd - PosBeg ); + responseText = responseText.substr( 0, PosBeg ); + } + + toolbar.innerHTML = responseText; if (typeof ciDebugBar === 'object') { ciDebugBar.init(); }