Bug 245264 - REGRESSION (iOS 16): Flickering horizontal lines on the animation made with canvas
Summary: REGRESSION (iOS 16): Flickering horizontal lines on the animation made with c...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Canvas (show other bugs)
Version: Other
Hardware: iPhone / iPad iOS 16
: P2 Major
Assignee: Nobody
URL:
Keywords: CanvaBug, InRadar
Depends on:
Blocks:
 
Reported: 2022-09-16 00:07 PDT by Pawel
Modified: 2023-10-19 21:37 PDT (History)
7 users (show)

See Also:


Attachments
Animation with flickering lines (1.28 MB, image/gif)
2022-09-16 00:07 PDT, Pawel
no flags Details
test case (5.20 KB, text/html)
2022-09-30 12:13 PDT, Alexey Proskuryakov
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Pawel 2022-09-16 00:07:44 PDT
Created attachment 462383 [details]
Animation with flickering lines

In the device with iOS 16 there are some strange horizontal lines flickering during the animation.
Comment 1 Pawel 2022-09-16 00:12:57 PDT
It happens only when the app is opened on the device with iOS 16. 

When I was testing it, I noticed that when I remove the gradient from the animation waves these flickering lines disappear.

I posted question also on stackoverflow where you can see the code: https://stackoverflow.com/questions/73733470/flickering-horizontal-lines-on-the-animation-made-with-canvas-only-on-ios-16
Comment 2 Alexey Proskuryakov 2022-09-16 19:13:56 PDT
Could you please attach a full self-contained reproducible case here? Not sure if it's practical for us to reassemble from the stackoverflow discussion.
Comment 3 Pawel 2022-09-21 01:53:07 PDT
I created a blank ionic tab app and added the animation there

Here you can open the app with the animation on the browser: https://3qohtbmn4j.appflowapp.com/tabs/tab1

I already did that and on my iPhone 13 pro(iOS 16) these flickering horizontal lines appear.

Here is the GitHub repo: https://github.com/kendyl93/bugzilla-245264/tree/master/src/app/explore-container
Comment 4 Radar WebKit Bug Importer 2022-09-23 00:08:18 PDT
<rdar://problem/100312374>
Comment 5 Alexey Proskuryakov 2022-09-29 18:06:26 PDT
I'm getting "An error occurred (AccessDenied) when calling the GetObject operation: Access Denied" from the live URL. And a 404 error from GitHub (it would almost certainly be impractical for us to build from a repo though).

Would it be possible for you to attach an .html test case here? Something like JSFiddle would be OK too.
Comment 6 Pawel 2022-09-30 01:38:03 PDT
(In reply to Alexey Proskuryakov from comment #5)
> I'm getting "An error occurred (AccessDenied) when calling the GetObject
> operation: Access Denied" from the live URL. And a 404 error from GitHub (it
> would almost certainly be impractical for us to build from a repo though).
> 
> Would it be possible for you to attach an .html test case here? Something
> like JSFiddle would be OK too.

Here is the JSFiddle with clean animation.
https://jsfiddle.net/kendyl93/fr671hux/257/
Comment 7 Alexey Proskuryakov 2022-09-30 12:13:46 PDT
Created attachment 462734 [details]
test case

Same test as attachment
Comment 8 Alexey Proskuryakov 2022-09-30 12:17:31 PDT
Thank you! 

I cannot reproduce with this test case on iPhone 14 Pro, iOS 16.1 beta, portrait or landscape.

We'll need someone with an iPhone 13 mini to take a look. But please feel encouraged to share your results (does this reproduce with the attached test for you? Does this still reproduce with iOS 16.1 beta?)
Comment 9 Said Abou-Hallawa 2022-09-30 12:22:57 PDT
I can't repro it either. 

Also the attached test case renders different from the attached animated image. Can you please attach the page which you used to generate the animated image?
Comment 10 Pawel 2022-10-01 01:56:04 PDT
Thanks for a quick answer. 

Seems that in this test case I am also not able to reproduce that. However, on the ionic build, it is happening. 

Check the preview here(it is only available for 7 days because if the free plan limitation) https://dashboard.ionicframework.com/preview/464a51ac/0qtqtrjf3a

Maybe it's an ionic issue with iOS 16 so I need to report it on their repo.
Comment 11 Alexey Proskuryakov 2022-10-01 09:38:01 PDT
I can reproduce on iPhone 14 Pro, iOS 16.1 beta.
Comment 12 Cameron McCormack (:heycam) 2023-10-19 21:37:31 PDT
Hi Pawel, sorry about the delay getting back to this. I cannot reproduce with the attachment here, and obviously the Ionic link has expired since you posted it. Is this still something you can reproduce?