Toolbar table sort script interfering with project tables in development environment

[mmlTools]

PHP Version

7.4

CodeIgniter4 Version

4.2.8

CodeIgniter4 Installation Method

Manual (zip or tar.gz)

Which operating systems have you tested for this bug?

Windows, Linux

Which server did you use?

apache

Database

MySQL 5.6

What happened?

Toolbar table sort script interfering with project tables in development environment.

Steps to Reproduce

1.Set environment to development
2.Create a table with headers as for example

<table>
<thead>
<tr><th>Col1</th><th>Col2</th></tr>
<thead>
<tbody>
<tr><td>1</td><td>a</td></tr>
<tr><td>2</td><td>b</td></tr>
<tr><td>3</td><td>d</td></tr>
</tbody>
<table>

3.Click on any of the table headers and the table will be sorted

Expected Output

This shouldn't happen because is interfering with custom table sort scripts.

Anything else?

No response

[kenjis]

I confirmed the bug.

<?php

namespace App\Controllers;

class Home extends BaseController
{
    public function index()
    {
        return '<table>
<thead>
<tr><th>Col1</th><th>Col2</th></tr>
<thead>
<tbody>
<tr><td>100</td><td>a</td></tr>
<tr><td>2</td><td>b</td></tr>
<tr><td>3</td><td>d</td></tr>
</tbody>
<table>';
    }
}

[kenjis]

This feature is provided by Kint.
You can disable Kint, but a bug that outputs "0" when you disable Kint.
See #6809

[mmlTools]

This feature is provided by Kint. You can disable Kint, but a bug that outputs "0" when you disable Kint. See #6809

Created a hackfix that is not causing any errors.

1. Go to system\ThirdParty\Kint\resources\compiled\rich.js and beautify this js file
2. In line 183 comment the following

else
     e.ctrlKey || l.sortTable(t.parentNode.parentNode.parentNode, t.cellIndex)

3. Use this instead

else if($(t.closest('#debug-bar')).length)
                l.sortTable(t.parentNode.parentNode.parentNode, t.cellIndex)
            else
                e.ctrlKey

This will check if parent element is our debug bar.

[erikkraijenoord]

Exactly the same happend to me, thank you for the provided information!

[kenjis]

I don't know the details.
Why does toolbar outputs Kint's js?
Does toolbar use it?

And we cannot patch Kint. If Kint's js breaks our apps, it seems to be a bug in Kint.

[paulbalandan]

Closing as this is not a bug of the framework.

[kenjis]

@paulbalandan Do you know why toolbar outputs Kint's js?

[paulbalandan]

This is because of this line:

CodeIgniter4/system/Debug/Toolbar.php

Line 116 in ad783a8

$varData[esc($key)] = $kint;

If we passed data to view(), those will be shown in the toolbar. If the passed data is an object, for example, the line above will create a Kint representation of the object similar to d()'s output, so it needs rendering.

[paulbalandan]

<?php

namespace App\Controllers;

class Home extends BaseController
{
    public function index()
    {
        return view('welcome_message', ['home' => new self]);
    }
}