1618409 - Allow resizing on network table border

Status: RESOLVED FIXED

(DevTools :: Netmonitor, enhancement, P4)

Description

[:Harald Kirschner :digitarald]

Chrome allows dragging and resizing on table borders not just in the table header but in the body too.

Benefits here are that it's more discoverable and is right next to the content that users want to expand/shrink.

Also makes future features like bug 1615102 more approachable, with more areas to double-click.

Comment 1

[Farooq AR]

Can I take this issue? We just need to set the height of .column-resizer to the height of .requests-list-scroll

Comment 2

[:Harald Kirschner :digitarald]

(This also reminded me to land bug 1615102) Thank you for your help!

Comment 3

[Farooq AR]

We will need to resize the column draggables on window resize.

resizeDraggables() {
    if (this.requestListScroll == null && this.requestListHeader.closest) {
      this.requestListScroll = this.requestListHeader.closest(
        ".requests-list-scroll"
      );
    }
    if (this.requestListScroll) {
      this.draggableHeight = this.requestListScroll.parentNode.offsetHeight;
      const visibleColumns = this.getVisibleColumns();
      visibleColumns.forEach(col => {
        const name = col.name;
        if (name !== "waterfall") {
          const draggableEl = this.refs[`${name}Header`].querySelector(
            ".column-resizer"
          );
          draggableEl.style.height = this.draggableHeight + "px";
        }
      });
    }
  }

There is already a window resize listener in RequestListHeader.js. We can call above function on window resize. I am wondering if there is a better way we could do this.

Comment 4

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Hi Farooq,
you are assigned to this bug, but there is no activity for a long time. Are you still planning to work on this?
Honza

Comment 5

[Farooq AR]

Hi, I apologize for the long delay. I had been caught up in academics. I will resume working on it in a day or two.

Comment 6

[Farooq AR]

Attachment: Bug 1618409 - Allow resizing on network table border.

Comment 7

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/d2bb25cf6ed5
Allow resizing on network table border. r=fvsch,Honza

Comment 8

[Alexandru Michis [:malexandru]]

https://hg.mozilla.org/mozilla-central/rev/d2bb25cf6ed5

Comment 9

[Janet Swisher]

Deleted "in the table header" from the second paragraph of the Network request columns section.