author | Margareta Eliza Balazs <ebalazs@mozilla.com> |
Thu, 15 Feb 2018 22:05:10 +0200 | |
changeset 404038 | 994a8d6eccbcdc6106794705bd77e3ac5f031be2 |
parent 404037 | 3200dd2ad6b0dffccdc9274b02d8632920edc9ef |
child 404039 | a7d2a49f46fbbe9e39650ea1e9acd457b01f8337 |
child 404092 | da3f01a609c06d5d8cf0c4f9d3e852b7f5952055 |
push id | 99924 |
push user | ebalazs@mozilla.com |
push date | Thu, 15 Feb 2018 20:43:51 +0000 |
treeherder | mozilla-inbound@a7d2a49f46fb [default view] [failures only] |
perfherder | [talos] [build metrics] [platform microbench] (compared to previous push) |
reviewers | backout |
bugs | 1429824, 1438412 |
milestone | 60.0a1 |
backs out | 500836846f62a16ad39523efe44c48c7f8356070 e3d4ec2c18b5e758be98ddef04362acae8ca75be cf796a41ff7d836e75b21d19c5be25c9dad4ee04 |
first release with | nightly linux32
994a8d6eccbc
/
60.0a1
/
20180215220507
/
files
nightly linux64
994a8d6eccbc
/
60.0a1
/
20180215220507
/
files
nightly mac
994a8d6eccbc
/
60.0a1
/
20180215220507
/
files
nightly win32
994a8d6eccbc
/
60.0a1
/
20180215220507
/
files
nightly win64
994a8d6eccbc
/
60.0a1
/
20180215220507
/
files
|
last release without | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
releases | nightly linux32
60.0a1
/
20180215220507
/
pushlog to previous
nightly linux64
60.0a1
/
20180215220507
/
pushlog to previous
nightly mac
60.0a1
/
20180215220507
/
pushlog to previous
nightly win32
60.0a1
/
20180215220507
/
pushlog to previous
nightly win64
60.0a1
/
20180215220507
/
pushlog to previous
|
--- a/devtools/client/netmonitor/src/components/RequestListContent.js +++ b/devtools/client/netmonitor/src/components/RequestListContent.js @@ -90,40 +90,33 @@ class RequestListContent extends Compone } componentDidMount() { // Install event handler for displaying a tooltip this.tooltip.startTogglingOnHover(this.refs.contentEl, this.onHover, { toggleDelay: REQUESTS_TOOLTIP_TOGGLE_DELAY, interactive: true }); - // Everytime the list is created or pruned, re-enable scroll to bottom feature. - this.shouldScrollToBottom = true; - // Install event handler to hide the tooltip on scroll this.refs.contentEl.addEventListener("scroll", this.onScroll, true); this.onResize(); } - componentDidUpdate(prevProps) { - if (!this.shouldScrollToBottom) { - return; - } + componentWillUpdate(nextProps) { // Check if the list is scrolled to bottom before the UI update. // The scroll is ever needed only if new rows are added to the list. - const hasNewRequests = this.props.displayedRequests.size - - prevProps.displayedRequests.size > 0; + const delta = nextProps.displayedRequests.size - this.props.displayedRequests.size; + this.shouldScrollBottom = delta > 0 && this.isScrolledToBottom(); + } + + componentDidUpdate(prevProps) { + let node = this.refs.contentEl; // Keep the list scrolled to bottom if a new row was added - if (hasNewRequests) { - // Set a boolean flag to help `scroll` listener to know that the next event - // is related to the scroll to bottom and can be ignored. - this.ignoreNextScroll = true; - + if (this.shouldScrollBottom && node.scrollTop !== MAX_SCROLL_HEIGHT) { // Using maximum scroll height rather than node.scrollHeight to avoid sync reflow. - let node = this.refs.contentEl; node.scrollTop = MAX_SCROLL_HEIGHT; } } componentWillUnmount() { this.refs.contentEl.removeEventListener("scroll", this.onScroll, true); // Uninstall the tooltip event handler @@ -195,24 +188,16 @@ class RequestListContent extends Compone return itemEl.querySelector(".requests-list-file"); } /** * Scroll listener for the requests menu view. */ onScroll() { this.tooltip.hide(); - - // Ignore scroll related to new requests being displayed - // To prevent slow reflows done in isScrolledToBottom. - if (this.ignoreNextScroll) { - this.ignoreNextScroll = false; - return; - } - this.shouldScrollToBottom = this.isScrolledToBottom(); } /** * Handler for keyboard events. For arrow up/down, page up/down, home/end, * move the selection up or down. */ onKeyDown(evt) { let delta; @@ -254,17 +239,17 @@ class RequestListContent extends Compone this.contextMenu.open(evt, selectedRequest, sortedRequests); } /** * If selection has just changed (by keyboard navigation), don't keep the list * scrolled to bottom, but allow scrolling up with the selection. */ onFocusedNodeChange() { - this.shouldScrollToBottom = false; + this.shouldScrollBottom = false; } render() { const { connector, columns, displayedRequests, firstRequestStartedMillis, @@ -280,19 +265,17 @@ class RequestListContent extends Compone return ( div({ className: "requests-list-wrapper" }, div({ className: "requests-list-table" }, div({ ref: "contentEl", className: "requests-list-contents", tabIndex: 0, onKeyDown: this.onKeyDown, - // scale is null until the waterfall is initialized - style: { "--timings-scale": scale ? scale : 0, - "--timings-rev-scale": (scale ? 1 / scale : 1) } + style: { "--timings-scale": scale, "--timings-rev-scale": 1 / scale } }, RequestListHeader(), displayedRequests.map((item, index) => RequestListItem({ firstRequestStartedMillis, fromCache: item.status === "304" || item.fromCache, connector, columns, item,
--- a/devtools/client/netmonitor/test/browser_net_autoscroll.js +++ b/devtools/client/netmonitor/test/browser_net_autoscroll.js @@ -36,21 +36,16 @@ add_task(function* () { // save for comparison later let scrollTop = requestsContainer.scrollTop; yield waitForNetworkEvents(monitor, 8); yield waitSomeTime(); is(requestsContainer.scrollTop, scrollTop, "Did not scroll."); // (3) Now set the scroll position back at the bottom and check that // additional requests *do* cause the container to scroll down. - // Wait for another request to be displayed in order to ensure that - // scrollTop is set just before next RequestListContent.componentWillUpdate fires. - // If scrollTop is set between componentWillUpdate and componentDidUpdate, - // the view won't be scrolled. - yield waitForNetworkEvents(monitor, 8); requestsContainer.scrollTop = requestsContainer.scrollHeight; ok(scrolledToBottom(requestsContainer), "Set scroll position to bottom."); yield waitForNetworkEvents(monitor, 8); yield waitForScroll(); ok(true, "Still scrolled to bottom."); // (4) Now select the first item in the list // and check that additional requests do not change the scroll position