Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-22 17:55:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1157293 - Part 3: Use filter-open and user-open attributes instead of classes. r=bgrins

Browse Source
This commit is contained in:
Gabriel Luong 2015-05-02 23:40:00 +02:00
parent 17a2bb8701
commit 1b3da2781e
10 changed files with 31 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
browser/devtools/styleinspector/rule-view.js
View File

@ -2136,7 +2136,7 @@ CssRuleView.prototype = {
// Expand the computed list if a computed rule is highlighted and the
// property rule is not highlighted
if (!isPropertyHighlighted && isComputedHighlighted &&
!editor.computed.classList.contains("user-open")) {
!editor.computed.hasAttribute("user-open")) {
editor.expandForFilter();
this._editorsExpandedForFilter.push(editor);
}
@ -3048,19 +3048,19 @@ TextPropertyEditor.prototype = {
/**
* Handles clicks on the computed property expander. If the computed list is
* open due to user expanding or style filtering, collapse the computed list
* and close the expander. Otherwise, add .user-open class which is used to
* and close the expander. Otherwise, add user-open attribute which is used to
* expand the computed list and tracks whether or not the computed list is
* expanded by manually by the user.
*/
_onExpandClicked: function(aEvent) {
if (this.computed.classList.contains("filter-open") ||
this.computed.classList.contains("user-open")) {
if (this.computed.hasAttribute("filter-open") ||
this.computed.hasAttribute("user-open")) {
this.expander.removeAttribute("open");
this.computed.classList.remove("filter-open");
this.computed.classList.remove("user-open");
this.computed.removeAttribute("filter-open");
this.computed.removeAttribute("user-open");
} else {
this.expander.setAttribute("open", "true");
this.computed.classList.add("user-open");
this.computed.setAttribute("user-open", "");
}
aEvent.stopPropagation();
@ -3068,13 +3068,13 @@ TextPropertyEditor.prototype = {
/**
* Expands the computed list when a computed property is matched by the style
* filtering. The .filter-open class is used to track whether or not the
* filtering. The filter-open attribute is used to track whether or not the
* computed list was toggled opened by the filter.
*/
expandForFilter: function() {
if (!this.computed.classList.contains("user-open")) {
this.computed.classList.add("filter-open");
if (!this.computed.hasAttribute("user-open")) {
this.expander.setAttribute("open", "true");
this.computed.setAttribute("filter-open", "");
}
},
@ -3082,8 +3082,9 @@ TextPropertyEditor.prototype = {
* Collapses the computed list that was expanded by style filtering.
*/
collapseForFilter: function() {
this.computed.classList.remove("filter-open");
if (!this.computed.classList.contains("user-open")) {
this.computed.removeAttribute("filter-open");
if (!this.computed.hasAttribute("user-open")) {
this.expander.removeAttribute("open");
}
},

5
browser/devtools/styleinspector/ruleview.css
View File

@ -56,12 +56,13 @@ body {
cursor: pointer;
}
.ruleview-computedlist:not(.user-open),
.ruleview-computedlist,
.ruleview-warning[hidden] {
display: none;
}
.ruleview-computedlist.filter-open {
.ruleview-computedlist[user-open],
.ruleview-computedlist[filter-open] {
display: block;
}

3
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_01.js
View File

@ -52,8 +52,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(!ruleEditor.expander.getAttribute("open"), "Expander is closed.");
ok(ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is correctly highlighted.");
ok(!computed.classList.contains("filter-open"),
"margin computed list is closed.");
ok(!computed.hasAttribute("filter-open"), "margin computed list is closed.");
ok(!computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is not highlighted.");

3
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_02.js
View File

@ -52,8 +52,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(!ruleEditor.expander.getAttribute("open"), "Expander is closed.");
ok(ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is correctly highlighted.");
ok(!computed.classList.contains("filter-open"),
"margin computed list is closed.");
ok(!computed.hasAttribute("filter-open"), "margin computed list is closed.");
ok(computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is correctly highlighted.");

3
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_03.js
View File

@ -52,8 +52,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(ruleEditor.expander.getAttribute("open"), "Expander is open.");
ok(!ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is not highlighted.");
ok(computed.classList.contains("filter-open"),
"margin computed list is open.");
ok(computed.hasAttribute("filter-open"), "margin computed list is open.");
ok(computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is not highlighted.");

3
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_04.js
View File

@ -52,8 +52,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(!ruleEditor.expander.getAttribute("open"), "Expander is closed.");
ok(ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is correctly highlighted.");
ok(!computed.classList.contains("filter-open"),
"margin computed list is closed.");
ok(!computed.hasAttribute("filter-open"), "margin computed list is closed.");
ok(computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is correctly highlighted.");

3
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_05.js
View File

@ -52,8 +52,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(ruleEditor.expander.getAttribute("open"), "Expander is open.");
ok(!ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is not highlighted.");
ok(computed.classList.contains("filter-open"),
"margin computed list is open.");
ok(computed.hasAttribute("filter-open"), "margin computed list is open.");
ok(computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is correctly highlighted.");

6
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_06.js
View File

@ -53,8 +53,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(ruleEditor.expander.getAttribute("open"), "Expander is open.");
ok(!ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is not highlighted.");
ok(computed.classList.contains("filter-open"),
"margin computed list is open.");
ok(computed.hasAttribute("filter-open"), "margin computed list is open.");
ok(computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is correctly highlighted.");
@ -90,8 +89,7 @@ function* testRemoveTextInFilter(inspector, ruleView) {
ok(!ruleEditor.expander.getAttribute("open"), "Expander is closed.");
ok(ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is correctly highlighted.");
ok(!computed.classList.contains("filter-open"),
"margin computed list is closed.");
ok(!computed.hasAttribute("filter-open"), "margin computed list is closed.");
ok(computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is correctly highlighted.");

6
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_clear.js
View File

@ -53,8 +53,7 @@ function* testAddTextInFilter(inspector, ruleView) {
ok(!ruleEditor.expander.getAttribute("open"), "Expander is closed.");
ok(ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is correctly highlighted.");
ok(!computed.classList.contains("filter-open"),
"margin computed list is closed.");
ok(!computed.hasAttribute("filter-open"), "margin computed list is closed.");
ok(!computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is not highlighted.");
@ -89,6 +88,5 @@ function* testClearSearchFilter(inspector, ruleView) {
let computed = ruleEditor.computed;
ok(!ruleEditor.expander.getAttribute("open"), "Expander is closed.");
ok(!computed.classList.contains("filter-open"),
"margin computed list is closed.");
ok(!computed.hasAttribute("filter-open"), "margin computed list is closed.");
}

12
browser/devtools/styleinspector/test/browser_ruleview_search-filter-computed-list_expander.js
View File

@ -54,10 +54,10 @@ function* testOpenExpanderAndAddTextInFilter(inspector, ruleView) {
ok(ruleEditor.expander.getAttribute("open"), "Expander is open.");
ok(ruleEditor.container.classList.contains("ruleview-highlight"),
"margin text property is correctly highlighted.");
ok(!computed.classList.contains("filter-open"),
ok(!computed.hasAttribute("filter-open"),
"margin computed list does not contain filter-open class.");
ok(computed.classList.contains("user-open"),
"margin computed list contains user-open class.");
ok(computed.hasAttribute("user-open"),
"margin computed list contains user-open attribute.");
ok(!computed.children[0].classList.contains("ruleview-highlight"),
"margin-top computed property is not highlighted.");
@ -92,8 +92,8 @@ function* testClearSearchFilter(inspector, ruleView) {
let computed = ruleEditor.computed;
ok(ruleEditor.expander.getAttribute("open"), "Expander is open.");
ok(!computed.classList.contains("filter-open"),
ok(!computed.hasAttribute("filter-open"),
"margin computed list does not contain filter-open class.");
ok(computed.classList.contains("user-open"),
"margin computed list contains user-open class.");
ok(computed.hasAttribute("user-open"),
"margin computed list contains user-open attribute.");
}