Bug 245962

Summary:	REGRESSION (iOS 16): When getUserMedia is called again, the existing stream is killed
Product:	WebKit	Reporter:	rbernalber <rbernalber>
Component:	WebRTC	Assignee:	Nobody <webkit-unassigned>
Status:	NEW ---
Severity:	Normal	CC:	daginge, webkit-bug-importer, youennf
Priority:	P2	Keywords:	InRadar
Version:	Safari 16
Hardware:	iPhone / iPad
OS:	iOS 16

Description rbernalber 2022-10-03 06:14:34 PDT

After the ios 16 update, when getUserMedia is called again, it kills itself and the camera does not work.

I'm testing on an iPhone mini mainly. The application is a PWA.

Accessed from the browser, not from the desktop icon, everything is fine.

On a regular iPhone 13 it doesn't happen, neither on iPad. Both with IOS 15

This problem is very random.
When open app from browser and then return PWA, its work again!

Comment 1 rbernalber 2022-10-03 15:16:42 PDT

I have tested with an iPhone 11 upgraded to iOS 16 and the same error occurs. 
It's hopeless, it makes the PWA app unusable.

Comment 2 Radar WebKit Bug Importer 2022-10-04 18:27:45 PDT

<rdar://problem/100790113>

Comment 3 daginge 2022-10-05 03:42:11 PDT

Could this be a dupe of https://bugs.webkit.org/show_bug.cgi?id=179363 ?

Comment 4 rbernalber 2022-10-05 03:57:34 PDT

is similar but not. I cloned getUserMedia with "clone()". On the device with ios16 it is easy to reproduce the bug.

When the permission request message appears, very quickly it is accepted and the bug appears.

on devices with version 15 I can't reproduce this error.

  const normalStream = await this.window.navigator.mediaDevices.getUserMedia({
        audio: false,
        video: {
          facingMode: 'environment',
          width: { exact: 150 },
          height: { ideal: 720, max: 960, min: 480 },
          // aspectRatio: { ideal: 1 },
          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
          // @ts-ignore
          ...(this.window.navigator.mediaDevices.getSupportedConstraints().resizeMode && {
            // resizeMode: 'none'
            resizeMode: 'crop-and-scale"'
          }),
          frameRate: { ideal: 60 },
        }
      })

      const fakeStream = normalStream.clone()
      const mediumStream = normalStream.clone()

      await Promise.all([
        ...mediumStream.getTracks().map((x) =>
          x.applyConstraints(
            this.getVideoConstraints({
              aspectRatio: 1.333,
              width: { min: 960, ideal: 1280, max: 1440 }
            })
          )
        ),
        ...fakeStream
          .getTracks()
          .map((x) =>
            x.applyConstraints(
              this.getVideoConstraints({ width: { min: 960, ideal: 1280, max: 1440 }, frameRate: { ideal: 25 } })
            )
          )
      ])

      this.cameraNormalAperture.nativeElement.srcObject = normalStream
      this.cameraMediumAperture.nativeElement.srcObject = mediumStream
      this.fakeCamera.nativeElement.srcObject = fakeStream