Bug 255705 – [iOS] Weird border shows after backgrounding Safari

• Status: NEW
• Component: Layout and Rendering

[VaJoy]

Created attachment 465998 [details]
weird borders

I've got a weird rendering issue only in iOS.

My HTML5 page shows alright in the beginning, but let it sit for a while (likely 3 minutes, doing nothing during this period), some elements will generate unexpected grey right-border:

https://i.stack.imgur.com/LQYVq.jpg

Btw, using "outline: 0" or "border: 0" can not solve this problem.

I think it's a bug of webkit, please check it out.

[alan]

Could you attach a test case, or point to a publicly available page where the bug shows, please?

[VaJoy]

(In reply to zalan from comment #1)
> Could you attach a test case, or point to a publicly available page where
> the bug shows, please?

Sure, please try https://test-k8s.taqu.cn/plus/v3/src/normal/business/mall-center/pre/index.html

[Simon Fraser (smfr)]

What iOS version and hardware are you seeing this on?

[VaJoy]

(In reply to Simon Fraser (smfr) from comment #3)
> What iOS version and hardware are you seeing this on?

iOS 16.4.1, iPhone 13 Pro.

As far as I know it happens on almost all the devices with iOS 15+.

[VaJoy]

Hi here's more details about how to show the issue:


Step 1: Visit page https://test-k8s.taqu.cn/plus/v3/src/normal/business/mall-center/pre/index.html in Safari.

Step 2: Doing some interactions with the page (such as doing some scroll or click  operations).

Step 3: Suspend Safari to the background, wait for 5 minutes (You can using other apps during this period).

Step 4: Activate Safari from the background, and the weird borders may show on the page.

[Radar WebKit Bug Importer]

<rdar://problem/108591768>