Replaced window resize event handler with resizeObserver

[currents-jantu]

This is a known bug so, not creating an issue.
This changes makes this component to work with collapsible sidebar, basically it will takes care of RGL width change even if window is not resized

[STRML]

I'm not married to IE11 compatibility, but this will break it. What's the issue corresponding to this?

[currents-jantu]

Thank you for your response. I apologize for not creating an issue earlier. I will ensure to create one promptly to keep track of this.

Regarding Pull Request #984, I believe your suggestion to use ResizeSensor makes more sense in this context.

[STRML]

Please rebase this @currents-jantu and I will merge.

[STRML]

Ok. This breaks tests due to the missing ResizeObserver global. I would prefer we use the ResizeSensor instead or something that will not break tests.

[currents-jantu]

Ok. This breaks tests due to the missing ResizeObserver global. I would prefer we use the ResizeSensor instead or something that will not break tests.

Sure, it make sense

[STRML]

@currents-jantu I am now realizing this broke the resize tests. Could you please fix it?

 FAIL  test/spec/lifecycle-test.js
  ● Lifecycle tests › <ReactGridLayout> › WidthProvider › Renders with WidthProvider measureBeforeMount

    expect(received).toEqual(expected) // deep equality

    Expected: "ReactGridLayout"
    Received: "div"

      318 |
      319 |         // Should have removed the div, now has the RGL
    > 320 |         expect(wrapper.childAt(0).childAt(0).name()).toEqual("ReactGridLayout");
          |                                                      ^
      321 |         expect(wrapper.childAt(0).state().width).toEqual(500);
      322 |       });
      323 |

      at Object.toEqual (test/spec/lifecycle-test.js:320:54)

  ● Lifecycle tests › <ReactGridLayout> › WidthProvider › WidthProvider responds to window resize events

    expect(received).toEqual(expected) // deep equality

    Expected: 500
    Received: 1280

      339 |
      340 |         // State should now be 500
    > 341 |         expect(widthProviderWrapper.state().width).toEqual(500);
          |                                                    ^
      342 |       });
      343 |     });
      344 |

      at Object.toEqual (test/spec/lifecycle-test.js:341:52)
      ```

[currents-jantu]

@currents-jantu I am now realizing this broke the resize tests. Could you please fix it?

 FAIL  test/spec/lifecycle-test.js
  ● Lifecycle tests › <ReactGridLayout> › WidthProvider › Renders with WidthProvider measureBeforeMount

    expect(received).toEqual(expected) // deep equality

    Expected: "ReactGridLayout"
    Received: "div"

      318 |
      319 |         // Should have removed the div, now has the RGL
    > 320 |         expect(wrapper.childAt(0).childAt(0).name()).toEqual("ReactGridLayout");
          |                                                      ^
      321 |         expect(wrapper.childAt(0).state().width).toEqual(500);
      322 |       });
      323 |

      at Object.toEqual (test/spec/lifecycle-test.js:320:54)

  ● Lifecycle tests › <ReactGridLayout> › WidthProvider › WidthProvider responds to window resize events

    expect(received).toEqual(expected) // deep equality

    Expected: 500
    Received: 1280

      339 |
      340 |         // State should now be 500
    > 341 |         expect(widthProviderWrapper.state().width).toEqual(500);
          |                                                    ^
      342 |       });
      343 |     });
      344 |

      at Object.toEqual (test/spec/lifecycle-test.js:341:52)
      ```

Sure, I will work on the test.

[currents-jantu]

@STRML current test cases won't work with ResizeObserver. I guess resizeObserver needs to be mocked here, I can try to rewrite these tests though. What you are suggesting ?

[STRML]

I don't know how to fix it - really a question for you. For now I will remove the test on master as not to break other builds.