291310 2025-04-08 21:10:18 -0700 ResizeObserver listener on canvas element sends 0 on resize instead of its new size 2025-04-26 02:06:26 -0700 1 1 1 Unclassified WebKit Layout and Rendering WebKit Nightly Build Unspecified Unspecified NEW https://bugs.webkit.org/show_bug.cgi?id=269911 https://bugs.webkit.org/show_bug.cgi?id=254078 https://bugs.webkit.org/show_bug.cgi?id=219005 InRadar P2 Normal --- 1 471421641 webkit-unassigned bfulgham karlcow simon.fraser webkit-bug-importer zalan oldest_to_newest 2109892 0 471421641 2025-04-08 21:10:18 -0700 My project use angular as the basic framework, using angular resizeObserver to get get the canvas's width, the code as follows: ``` ngAfterViewInit() { const canvas = this.canvasRef.nativeElement; this.resizeObserver = new ResizeObserver(entries => { const entry = entries[0] if (this.images.length > 0 && this.images[this.currentPage -1]) { // console.log('resize current page:' + this.currentPage); // console.log('resize image width:' + this.images[this.currentPage - 1].naturalWidth) this.scale = entry.contentRect.width / this.images[this.currentPage - 1].naturalWidth; } }); this.resizeObserver.observe(canvas); } ``` The canvas is used to load image the loading method is as follows: ``` onFileSelected(event: Event) { if (this.islocked) return; const input = event.target as HTMLInputElement; if (!input.files) { return; } const file = input.files[0]; const reader = new FileReader(); reader.onload = (e: ProgressEvent<FileReader>) => { const imageUrl = e.target?.result as string; const image = new Image() as HTMLImageElement; image.src = imageUrl; image.onload = () => { this.images.push(image); this.currentPage = this.images.length; this.totalPages = this.currentPage; console.log('current page:' + this.currentPage) console.log('load image width:' + this.images[this.currentPage - 1].naturalWidth) this.initMarkersPosition(); this.drawImageToCanvas(true); } }; reader.readAsDataURL(file); // 以 Data URL 的形式读取文件 } ``` in safari browser after load can get the image correct naturalWidth also width, but in the resize listener the naturalWidth and width is zero in chrome browser do not have the problem. 2109894 1 471421641 2025-04-08 21:12:15 -0700 if I resize the browser's view port width, the width in resize listener is correct 2111247 2 webkit-bug-importer 2025-04-15 21:11:48 -0700 <rdar://problem/149358951> 2113046 3 karlcow 2025-04-25 00:38:55 -0700 471421641@qq.com, Thanks for the report, do you think it would be possible to provide a reduced test case which is not dependent on Angular and reproduces the issue you met. That would be helpful. 2113263 4 471421641 2025-04-26 02:06:26 -0700 I have no idea about your suggestions, if you use a reduced test that the problem do not appear, that will demonstrate the problem is from angular