Fix video not working in tab (#3891)

* fix

* fixes

* change

* Update CHANGELOG.md

* format

CHANGELOG.md

@@ -6,7 +6,7 @@
 No changes to highlight.
 
 ## Bug Fixes:
-
+- Fix issue where `gr.Video()` would not work inside a `gr.Tab()` by [@dawoodkhan82](https://github.com/dawoodkhan82) in [PR 3891](https://github.com/gradio-app/gradio/pull/3891)
 - Fixed issue with old_value check in File. by [@tomchang25](https://github.com/tomchang25) in [PR 3859](https://github.com/gradio-app/gradio/pull/3859).
 - Fixed bug where all bokeh plots appeared in the same div by [@freddyaboulton](https://github.com/freddyaboulton) in [PR 3896](https://github.com/gradio-app/gradio/pull/3896)
 - Fix issue in `gr.Gallery()` where setting height causes aspect ratio of images to collapse by [@dawoodkhan82](https://github.com/dawoodkhan82) in [PR 3830](https://github.com/gradio-app/gradio/pull/3830)

js/video/src/Player.svelte

@@ -77,9 +77,6 @@
 		await tick();
 
 		var b = setInterval(async () => {
-			if (video.readyState >= 1) {
-				height = (video.videoHeight / video.videoWidth) * width;
-			}
 			if (video.readyState >= 3) {
 				video.currentTime = 9999;
 				paused = true;
@@ -99,23 +96,15 @@
 		checkforVideo();
 	}
 
-	$: src && _load();
-
-	let height: number;
-	let width: number;
 	let opacity: number = 0;
 	let wrap_opacity: number = 0;
 	let transition: string = "0.5s";
+
+	$: src && _load();
 </script>
 
-<div
-	style:opacity={wrap_opacity}
-	class="wrap"
-	style:height={`${src && height}px` || `auto`}
->
+<div style:opacity={wrap_opacity} class="wrap">
 	<video
-		bind:clientHeight={height}
-		bind:clientWidth={width}
 		{src}
 		preload="auto"
 		on:mousemove={video_move}