Skip to content

Commit

Permalink
Combine dropdown with dataset handler (#642)
Browse files Browse the repository at this point in the history 
* Combine dropdown with dataset handler

* Add test for tab
  • Loading branch information
@barryvdh
barryvdh committed Apr 1, 2024
1 parent 5a9481d commit 2a722cc
Show file tree
Hide file tree
Showing 6 changed files with 53 additions and 30 deletions.
4 changes: 2 additions & 2 deletions demo/bootstrap.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
$debugbar = new StandardDebugBar();
$debugbarRenderer = $debugbar->getJavascriptRenderer()
->setBaseUrl('../src/DebugBar/Resources')
->setAjaxHandlerEnableTab(true)
->setEnableJqueryNoConflict(false);

//
Expand All @@ -29,9 +30,8 @@ function render_demo_page(Closure $callback = null)
<script type="text/javascript">
$(function() {
$('.ajax').click(function() {
var container = $(this).parent().html('...');
$.get(this.href, function(data) {
container.html(data);
$('#ajax-result').html(data);
});
return false;
});
Expand Down
1 change: 1 addition & 0 deletions demo/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@
<li><a href="ajax.php" class="ajax">load ajax content</a></li>
<li><a href="ajax_exception.php" class="ajax">load ajax content with exception</a></li>
</ul>
<div id="ajax-result"></div>
<h2>IFRAMES</h2>
<ul>
<li><a href="iframes/index.php">load through iframes</a></li>
Expand Down
11 changes: 5 additions & 6 deletions src/DebugBar/Resources/debugbar.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -318,12 +318,11 @@ div.phpdebugbar-mini-design a.phpdebugbar-tab {

/* -------------------------------------- */

.phpdebugbar-tab-history .phpdebugbar-text {
display: inline-flex;
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
a.phpdebugbar-tab.phpdebugbar-tab-history .phpdebugbar-text {
display: none;
}
a.phpdebugbar-tab.phpdebugbar-tab-history i {
display:inline-block;
}
.phpdebugbar-widgets-dataset-history table {
width: 100%;
Expand Down
35 changes: 21 additions & 14 deletions src/DebugBar/Resources/debugbar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -548,8 +548,7 @@ if (typeof(PhpDebugBar) == 'undefined') {
this.$datasets = $('<select />').addClass(csscls('datasets-switcher')).attr('name', 'datasets-switcher')
.appendTo(this.$headerRight);
this.$datasets.change(function() {
self.dataChangeHandler(self.datasets[this.value]);
self.showTab();
self.showDataSet(this.value);
});
},

Expand Down Expand Up @@ -948,21 +947,23 @@ if (typeof(PhpDebugBar) == 'undefined') {

var label = this.datesetTitleFormater.format(id, this.datasets[id], suffix, nb);

if (typeof(show) == 'undefined' || show) {
this.showDataSet(id, label);
}

if (this.datasetTab) {
this.datasetTab.set('data', this.datasets);
this.datasetTab.set('badge', getObjectSize(this.datasets));
this.datasetTab.$tab.show();
} else {
this.$datasets.append($('<option value="' + id + '">' + label + '</option>'));
if (this.$datasets.children().length > 1) {
this.$datasets.show();
}
}

this.$datasets.append($('<option value="' + id + '">' + label + '</option>'));
if (this.$datasets.children().length > 1) {
this.$datasets.show();
}

if (typeof(show) == 'undefined' || show) {
this.showDataSet(id);
}

this.resize();

return id;
},

Expand Down Expand Up @@ -1001,12 +1002,16 @@ if (typeof(PhpDebugBar) == 'undefined') {
* @this {DebugBar}
* @param {String} id
*/
showDataSet: function(id, label) {
this.dataChangeHandler(this.datasets[id]);
showDataSet: function(id) {
this.activeDatasetId = id;
this.dataChangeHandler(this.datasets[id]);

if (this.$datasets.val() !== id) {
this.$datasets.val(id);
}

if (this.datasetTab) {
this.datasetTab.set('title', label);
this.datasetTab.get('widget').set('id', id);
}
},

Expand Down Expand Up @@ -1060,6 +1065,8 @@ if (typeof(PhpDebugBar) == 'undefined') {
'debugbar': this
})});
this.datasetTab.$tab.addClass(csscls('tab-history'));
this.datasetTab.$tab.attr('data-collector', '__datasets');
this.datasetTab.$el.attr('data-collector', '__datasets');
this.datasetTab.$tab.insertAfter(this.$openbtn).hide();
this.datasetTab.$tab.click(() => {
if (!this.isMinimized() && self.activePanelName == '__datasets') {
Expand Down
17 changes: 9 additions & 8 deletions src/DebugBar/Resources/widgets.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -667,6 +667,7 @@ if (typeof(PhpDebugBar) == 'undefined') {
}
this.set(options);
this.set('autoshow', null);
this.set('id', null);
this.set('sort', localStorage.getItem('debugbar-history-sort') || 'asc');
this.$el.addClass(csscls('dataset-history'))

Expand Down Expand Up @@ -724,7 +725,6 @@ if (typeof(PhpDebugBar) == 'undefined') {
.append($('<th>Date ↕</th>').css('width', '175px').click(function() {
self.set('sort', self.get('sort') === 'asc' ? 'desc' : 'asc')
localStorage.setItem('debugbar-history-sort', self.get('sort'))
console.log('set sort', self.get('sort'))
}))
.append($('<th>Method</th>').css('width', '80px'))
.append($('<th>URL</th>'))
Expand All @@ -749,7 +749,7 @@ if (typeof(PhpDebugBar) == 'undefined') {
},

render: function() {
this.bindAttr(['data'], function() {
this.bindAttr('data', function() {
if (this.get('autoshow') === null && this.get('debugbar').ajaxHandler) {
this.set('autoshow', this.get('debugbar').ajaxHandler.autoShow);
}
Expand All @@ -766,18 +766,19 @@ if (typeof(PhpDebugBar) == 'undefined') {
}

this.get('itemRenderer')(this, data);

// Switch active tab
this.$table.find('.' + csscls('active')).removeClass(csscls('active'));
this.$table.find('tr[data-id=' + this.get('debugbar').activeDatasetId+']').addClass(csscls('active'));
});
});
this.bindAttr(['itemRenderer', 'search', 'method', 'sort'], function() {
this.renderDatasets();
})
this.bindAttr(['autoshow'], function() {
this.bindAttr('autoshow', function() {
var autoshow = this.get('autoshow');
this.$autoshow.prop('checked', autoshow);
})
this.bindAttr('id', function() {
var id = this.get('id');
this.$table.find('.' + csscls('active')).removeClass(csscls('active'));
this.$table.find('tr[data-id=' + id+']').addClass(csscls('active'));
})
},

/**
Expand Down
15 changes: 15 additions & 0 deletions tests/DebugBar/Tests/Browser/DebugbarTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,21 @@ public function testDebugbarAjax(): void

$client->waitForElementToContain('.phpdebugbar-datasets-switcher', 'ajax_exception.php');
$client->waitForElementToContain('.phpdebugbar-panel[data-collector=exceptions] .phpdebugbar-widgets-message', 'Something failed!');

// Open network tab
$client->click($this->getTabLink($crawler, '__datasets'));
$client->waitForVisibility('.phpdebugbar-panel[data-collector=__datasets] .phpdebugbar-widgets-table-row');

$requests = $crawler->filter('.phpdebugbar-panel[data-collector=__datasets] .phpdebugbar-widgets-table-row')
->each(function(WebDriverElement $node){
return $node->getText();
});
$this->assertStringContainsString('GET /demo/', $requests[0]);
$this->assertStringContainsString('GET /demo/ajax.php (ajax)', $requests[1]);
$this->assertStringContainsString('GET /demo/ajax_exception.php (ajax)', $requests[2]);



}

}

0 comments on commit 2a722cc

Please sign in to comment.