Grid: Equally resize merged columns

With HeaderRow.join(...) it is possible to merge multiple columns.

However, if I resize those columns by grabbing the edge of the merged header cell and dragging it right, only the leftmost header cell gets resized. All other columns do not grow.

Suggestion: All columns grow proportionally to their respective expand ratio.

You can reproduce the issue with the MWE below:

// imports

@Theme("mytheme")
public class MyUI extends UI {
  @Override
  protected void init(VaadinRequest vaadinRequest) {
    Grid<Row> grid = new Grid<>(Row.class);
    grid.setColumnOrder("col1", "col2", "col3");
    grid.getDefaultHeaderRow().join("col1", "col2").setText("resize me");
    // grid.getColumn("col1").setExpandRatio(1);
    // grid.getColumn("col2").setExpandRatio(3);
    grid.setDataProvider(new ListDataProvider<>(Arrays.asList(
      new Row("a", "b", "c"),
      new Row("d", "e", "f")
    )));
    setContent(grid);
  }

  @WebServlet(urlPatterns = "/*", name = "MyUIServlet", asyncSupported = true)
  @VaadinServletConfiguration(ui = MyUI.class, productionMode = false)
  public static class MyUIServlet extends VaadinServlet {
  }

  public static final class Row {
    private String col1, col2, col3;
    // constructor, getters, setters
  }
}

Built and tested with Vaadin 8.3.0

Start with the Grid column-resizing and merged HeaderRow behavior demonstrated by the minimal working example. Reproduce the case with col1 and col2 joined, including the optional expand ratios, then trace the resize handling. Done means dragging the merged header grows all joined columns proportionally rather than resizing only the leftmost column.