Grid not resizing with re sizable div

I’m submitting a bug report

• Angular Version: 7.2.14

• Library Version: 2.5.3

• Browser: Chrome 73.0.3683.103

• Language: TypeScript 3.1.1

Current behavior: I have a re-sizable div that can be changed to nearly and height or width on the fly. When the div is adjusted, The grid does not stay inside the dimensions of the div. In fact, it doesn’t do anything at all. These are my grid options

<angular-slickgrid gridId="grid1"
      style="width:100%;height:100%"
            [columnDefinitions]="columnDefinitions"
            [gridOptions]="gridOptions"
            [dataset]="dataset"
            (onAngularGridCreated)="angularGridReady($event)">
            >

 this.gridOptions = {
      enableAutoResize: true,       // true by default
      enableCellNavigation: true,
      autoEdit: true, /* when enabled will automatically open the inlined editor as soon as there is a focus on the cell (can be combined with "enableCellNavigation: true"). */
      autoHeight: false,
      autoResize: {
        containerId:`${this.selector}div`,
        delay: 0,
        sidePadding: 4,
        bottomPadding: 4
      }
    };

Setting autoHeight to True doesn’t appear to change much

Expected/desired behavior: Setting the autoResize grid option with the correct container would correctly set the dimensions of the grid. I have searched the documentation on this and am unable to find anything that has been of use. I have attached an image, if you are able to open those 😃

[ghiscoding]

First the autoHeight is probably not what you think it is, it’s an option available in the SlickGrid core lib and it basically draw the entire grid height without any scrolling, for example if the grid has 100 items, all 100 items will be shown in the grid and the only scrolling you’ll have is the browser scrolling. This option is really badly name, perhaps fullHeight might have been better, but again that comes from the core lib, not mine.

As for the autoResize, which is implemented within my lib, it needs a Div container for it to work properly. Also it uses the window.resize and when you change the grid size dynamically you will find out that it might not always call a resize (probably your problem). For example in our project, we have a sidebar that can be opened and we do this programmatically (by changing Bootstrap col-md-x size) and that doesn’t trigger a window.event, so to circumvent this issue, you can call the resize manually like so

  angularGridReady(angularGrid: AngularGridInstance) {
    this.angularGrid = angularGrid;
  }

  closeSidebar() {
    this.isSidebarOpen = false;
    this.angularGrid.resizerService.resizeGrid();
  }

  openSidebar() {
    this.isSidebarOpen = true;
    this.angularGrid.resizerService.resizeGrid();
  }

[ghiscoding]

Sometime this week