Bug 1431132 - Netmonitor list of requests height set to 100% to prevent overflows draft
authorglowka <glowka.tom@gmail.com>
Thu, 22 Feb 2018 22:06:36 +0100
changeset 758632 c1743ef1d6803f0afcb40f52ecea8b89a0d11705
parent 758629 3f474e48db7f7b0f1c2c090f812290a8d9a21650
push id100142
push userbmo:glowka.tom@gmail.com
push dateThu, 22 Feb 2018 21:07:42 +0000
bugs1431132
milestone60.0a1
Bug 1431132 - Netmonitor list of requests height set to 100% to prevent overflows MozReview-Commit-ID: JgirW6RWBSa
devtools/client/netmonitor/src/assets/styles/RequestList.css
devtools/client/netmonitor/src/components/RequestListContent.js
--- a/devtools/client/netmonitor/src/assets/styles/RequestList.css
+++ b/devtools/client/netmonitor/src/assets/styles/RequestList.css
@@ -61,16 +61,17 @@
   width: 100%;
   height: 100%;
 }
 
 .requests-list-contents {
   display: table-row-group;
   position: absolute;
   width: 100%;
+  height: 100%;
   overflow-x: hidden;
   overflow-y: auto;
   --timings-scale: 1;
   --timings-rev-scale: 1;
 }
 
 .requests-list-column {
   display: table-cell;
--- a/devtools/client/netmonitor/src/components/RequestListContent.js
+++ b/devtools/client/netmonitor/src/components/RequestListContent.js
@@ -67,42 +67,39 @@ class RequestListContent extends Compone
     };
   }
 
   constructor(props) {
     super(props);
     this.isScrolledToBottom = this.isScrolledToBottom.bind(this);
     this.onHover = this.onHover.bind(this);
     this.onScroll = this.onScroll.bind(this);
-    this.onResize = this.onResize.bind(this);
     this.onKeyDown = this.onKeyDown.bind(this);
     this.onContextMenu = this.onContextMenu.bind(this);
     this.onFocusedNodeChange = this.onFocusedNodeChange.bind(this);
   }
 
   componentWillMount() {
     const { connector, cloneSelectedRequest, openStatistics } = this.props;
     this.contextMenu = new RequestListContextMenu({
       connector,
       cloneSelectedRequest,
       openStatistics,
     });
     this.tooltip = new HTMLTooltip(window.parent.document, { type: "arrow" });
-    window.addEventListener("resize", this.onResize);
   }
 
   componentDidMount() {
     // Install event handler for displaying a tooltip
     this.tooltip.startTogglingOnHover(this.refs.contentEl, this.onHover, {
       toggleDelay: REQUESTS_TOOLTIP_TOGGLE_DELAY,
       interactive: true
     });
     // Install event handler to hide the tooltip on scroll
     this.refs.contentEl.addEventListener("scroll", this.onScroll, true);
-    this.onResize();
   }
 
   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 delta = nextProps.displayedRequests.size - this.props.displayedRequests.size;
     this.shouldScrollBottom = delta > 0 && this.isScrolledToBottom();
   }
@@ -116,22 +113,16 @@ class RequestListContent extends Compone
     }
   }
 
   componentWillUnmount() {
     this.refs.contentEl.removeEventListener("scroll", this.onScroll, true);
 
     // Uninstall the tooltip event handler
     this.tooltip.stopTogglingOnHover();
-    window.removeEventListener("resize", this.onResize);
-  }
-
-  onResize() {
-    let parent = this.refs.contentEl.parentNode;
-    this.refs.contentEl.style.height = parent.offsetHeight + "px";
   }
 
   isScrolledToBottom() {
     const { contentEl } = this.refs;
     const lastChildEl = contentEl.lastElementChild;
 
     if (!lastChildEl) {
       return false;