feat: Calculate width/height of canvas based on container dimensions (".excalidraw" selector) & remove props width & height (#3379)

* Remove width/height from the ".excalidraw" container so it will sized automatically.
* updated all ref calculation to ".excalidraw" instead of parent since now ".excalidraw" will get resized
* Remove props width/height as its not needed anymore.
* Resize handler is also not needed anymore.
* Position absolute canvas due to #3379 (comment)

* move css to style and remove one extra rerendering

* factor out mock logic for test

* set height, width so as to avoid unnecessary updates of regression snap

* better mock

* better type checking and omit width,height from getDefaultAppState and also restore

* revert

* default to window dimensions in constructor

* update docs

* update

* update

* tweaks

src/tests/test-utils.ts

@@ -102,3 +102,25 @@ const initLocalStorage = (data: ImportedDataState) => {
 export const updateSceneData = (data: SceneData) => {
   (window.collab as any).excalidrawAPI.updateScene(data);
 };
+
+const originalGetBoundingClientRect =
+  global.window.HTMLDivElement.prototype.getBoundingClientRect;
+
+export const mockBoundingClientRect = () => {
+  // override getBoundingClientRect as by default it will always return all values as 0 even if customized in html
+  global.window.HTMLDivElement.prototype.getBoundingClientRect = () => ({
+    top: 10,
+    left: 20,
+    bottom: 10,
+    right: 10,
+    width: 200,
+    x: 10,
+    y: 20,
+    height: 100,
+    toJSON: () => {},
+  });
+};
+
+export const restoreOriginalGetBoundingClientRect = () => {
+  global.window.HTMLDivElement.prototype.getBoundingClientRect = originalGetBoundingClientRect;
+};