Bug 1316291 - PART 2:remove request-list elements with fixed ID;r=Honza
MozReview-Commit-ID: 2myRfMX3XQB
--- a/devtools/client/netmonitor/components/request-list-empty.js
+++ b/devtools/client/netmonitor/components/request-list-empty.js
@@ -26,38 +26,35 @@ const RequestListEmptyNotice = createCla
propTypes: {
onReloadClick: PropTypes.func.isRequired,
onPerfClick: PropTypes.func.isRequired,
},
render() {
return div(
{
- id: "requests-list-empty-notice",
- className: "request-list-empty-notice",
+ className: "requests-list-empty-notice",
},
- div({ id: "notice-reload-message" },
+ div({ className: "notice-reload-message" },
span(null, L10N.getStr("netmonitor.reloadNotice1")),
button(
{
- id: "requests-list-reload-notice-button",
- className: "devtools-button",
+ className: "devtools-toolbarbutton requests-list-reload-notice-button",
"data-standalone": true,
onClick: this.props.onReloadClick,
},
L10N.getStr("netmonitor.reloadNotice2")
),
span(null, L10N.getStr("netmonitor.reloadNotice3"))
),
- div({ id: "notice-perf-message" },
+ div({ className: "notice-perf-message" },
span(null, L10N.getStr("netmonitor.perfNotice1")),
button({
- id: "requests-list-perf-notice-button",
title: L10N.getStr("netmonitor.perfNotice3"),
- className: "devtools-button",
+ className: "devtools-button requests-list-perf-notice-button",
"data-standalone": true,
onClick: this.props.onPerfClick,
}),
span(null, L10N.getStr("netmonitor.perfNotice2"))
)
);
}
});
--- a/devtools/client/netmonitor/components/request-list-header.js
+++ b/devtools/client/netmonitor/components/request-list-header.js
@@ -73,18 +73,18 @@ const RequestListHeader = createClass({
this.props.resizeWaterfall(width);
});
},
render() {
const { sort, scale, waterfallWidth, onHeaderClick } = this.props;
return div(
- { id: "requests-list-toolbar", className: "devtools-toolbar" },
- div({ id: "toolbar-labels" },
+ { className: "devtools-toolbar requests-list-toolbar" },
+ div({ className: "toolbar-labels" },
HEADERS.map(header => {
const name = header.name;
const boxName = header.boxName || name;
const label = L10N.getStr(`netmonitor.toolbar.${header.label || name}`);
let sorted, sortedTitle;
const active = sort.type == name ? true : undefined;
if (active) {
--- a/devtools/client/netmonitor/test/browser_net_reload-button.js
+++ b/devtools/client/netmonitor/test/browser_net_reload-button.js
@@ -10,16 +10,16 @@
add_task(function* () {
let { monitor } = yield initNetMonitor(SIMPLE_URL);
info("Starting test... ");
let { document } = monitor.panelWin;
let wait = waitForNetworkEvents(monitor, 1);
EventUtils.sendMouseEvent({ type: "click" },
- document.querySelector("#requests-list-reload-notice-button"));
+ document.querySelector(".requests-list-reload-notice-button"));
yield wait;
is(document.querySelectorAll(".request-list-item").length, 1,
"The request list should have one item after reloading");
return teardown(monitor);
});
--- a/devtools/client/netmonitor/test/browser_net_reload-markers.js
+++ b/devtools/client/netmonitor/test/browser_net_reload-markers.js
@@ -7,18 +7,17 @@
* Tests if the empty-requests reload button works.
*/
add_task(function* () {
let { monitor } = yield initNetMonitor(SIMPLE_URL);
info("Starting test... ");
let { document, windowRequire } = monitor.panelWin;
- let { EVENTS } = windowRequire("devtools/client/netmonitor/constants");
- let button = document.querySelector("#requests-list-reload-notice-button");
+ let button = document.querySelector(".requests-list-reload-notice-button");
button.click();
let markers = [];
monitor.panelWin.on(EVENTS.TIMELINE_EVENT, (_, marker) => {
markers.push(marker);
});
--- a/devtools/client/netmonitor/test/browser_net_simple-request.js
+++ b/devtools/client/netmonitor/test/browser_net_simple-request.js
@@ -24,53 +24,53 @@ add_task(function* () {
getSortedRequests,
} = windowRequire("devtools/client/netmonitor/selectors/index");
gStore.dispatch(Actions.batchEnable(false));
is(document.querySelector(".network-details-panel-toggle").hasAttribute("disabled"),
true,
"The pane toggle button should be disabled when the frontend is opened.");
- ok(document.querySelector("#requests-list-empty-notice"),
+ ok(document.querySelector(".requests-list-empty-notice"),
"An empty notice should be displayed when the frontend is opened.");
is(gStore.getState().requests.requests.size, 0,
"The requests menu should be empty when the frontend is opened.");
is(!!document.querySelector(".network-details-panel"), false,
"The network details panel should be hidden when the frontend is opened.");
yield reloadAndWait();
is(document.querySelector(".network-details-panel-toggle").hasAttribute("disabled"),
false,
"The pane toggle button should be enabled after the first request.");
- ok(!document.querySelector("#requests-list-empty-notice"),
+ ok(!document.querySelector(".requests-list-empty-notice"),
"The empty notice should be hidden after the first request.");
is(gStore.getState().requests.requests.size, 1,
"The requests menu should not be empty after the first request.");
is(!!document.querySelector(".network-details-panel"), false,
"The network details panel should still be hidden after the first request.");
yield reloadAndWait();
is(document.querySelector(".network-details-panel-toggle").hasAttribute("disabled"),
false,
"The pane toggle button should be still be enabled after a reload.");
- ok(!document.querySelector("#requests-list-empty-notice"),
+ ok(!document.querySelector(".requests-list-empty-notice"),
"The empty notice should be still hidden after a reload.");
is(gStore.getState().requests.requests.size, 1,
"The requests menu should not be empty after a reload.");
is(!!document.querySelector(".network-details-panel"), false,
"The network details panel should still be hidden after a reload.");
gStore.dispatch(Actions.clearRequests());
is(document.querySelector(".network-details-panel-toggle").hasAttribute("disabled"),
true,
"The pane toggle button should be disabled when after clear.");
- ok(document.querySelector("#requests-list-empty-notice"),
+ ok(document.querySelector(".requests-list-empty-notice"),
"An empty notice should be displayed again after clear.");
is(gStore.getState().requests.requests.size, 0,
"The requests menu should be empty after clear.");
is(!!document.querySelector(".network-details-panel"), false,
"The network details panel should still be hidden after clear.");
return teardown(monitor);
--- a/devtools/client/themes/netmonitor.css
+++ b/devtools/client/themes/netmonitor.css
@@ -6,17 +6,17 @@
@import "resource://devtools/client/shared/components/tree/tree-view.css";
@import "resource://devtools/client/shared/components/tabs/tabs.css";
@import "resource://devtools/client/shared/components/tabs/tabbar.css";
* {
box-sizing: border-box;
}
-#toolbar-labels {
+.toolbar-labels {
overflow: hidden;
display: flex;
flex: auto;
}
.devtools-toolbar-container {
display: flex;
justify-content: space-between;
@@ -91,32 +91,32 @@
}
.request-list-empty-notice {
margin: 0;
padding: 12px;
font-size: 120%;
}
-#notice-perf-message {
+.notice-perf-message {
margin-top: 2px;
}
-#requests-list-perf-notice-button {
+.requests-list-perf-notice-button {
min-width: 30px;
min-height: 26px;
margin: 0 5px;
vertical-align: middle;
}
-#requests-list-perf-notice-button::before {
+.requests-list-perf-notice-button::before {
background-image: url(images/profiler-stopwatch.svg);
}
-#requests-list-reload-notice-button {
+.requests-list-reload-notice-button {
font-size: inherit;
min-height: 26px;
margin: 0 5px;
}
/* Network requests table */
#requests-list-toolbar {