Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Detect and tracking don't work anymore if choose a camera with constraints #416

Closed
viac92 opened this issue Feb 5, 2024 · 9 comments
Closed

Comments

@viac92
Copy link

viac92 commented Feb 5, 2024

Hi everyone,

When I use the qrcodestream component like this everything works well.

<qrcode-stream
      :formats="selectedBarcodeTypes"
      :track="selected.value"
      @detect="onDetect"
      @error="logErrors"
/>

but when I select a specific camera with the constraints I can switch camera but all the logic doesn't work anymore

 <p>
  <select v-model="selectedDevice">
    <option
      v-for="device in devices"
      :key="device.label"
      :value="device"
    >
      {{ device.label }}
    </option>
  </select>
</p>

<qrcode-stream
      :constraints="{ deviceId: selectedDevice.deviceId }"
      :formats="selectedBarcodeTypes"
      :track="selected.value"
      @detect="onDetect"
      @error="logErrors"
      v-if="selectedDevice !== null"
  />
<p v-else>
    No camera available
</p>

in script setup I get the devices like this:

const selectedDevice = ref(null)
const devices = ref([])

onMounted(async () => {
  await navigator.mediaDevices.getUserMedia({video: true});
  devices.value = (await navigator.mediaDevices.enumerateDevices()).filter(
    ({ kind }) => kind === 'videoinput'
  )

  if (devices.value.length > 0) {
    selectedDevice.value = devices.value[0]
  }
})

I add await navigator.mediaDevices.getUserMedia({video: true}); bc without it I don't get the devices on safari.

@viac92 viac92 changed the title Don' Detect and tracking don't work anymore if choose a camera with constraints Feb 5, 2024
gruhn added a commit that referenced this issue Feb 7, 2024
Scanner does not work anymore after when `deviceId` via `constraints` is updated
and no other props are changed. This is because:

  ==> both `cameraActive.value` and `cameraSettings.shouldStream` stay `true`
  ==> then `shouldScan` also does not change
  ==> therefore the watcher on `shouldScan` is not triggered
  ==> and finally we don't start a new scanning process

To prevent that, we now explicitly set `cameraActive` to `false` right before
requesting a new camera. That is not just a hack but also makes semantically sense,
because the camera is briefly inactive right before requesting a new camera.

See: #416
gruhn added a commit that referenced this issue Feb 7, 2024
Scanner does not work anymore after when `deviceId` via `constraints` is updated
and no other props are changed. This is because:

  ==> both `cameraActive.value` and `cameraSettings.shouldStream` stay `true`
  ==> then `shouldScan` also does not change
  ==> therefore the watcher on `shouldScan` is not triggered
  ==> and finally we don't start a new scanning process

To prevent that, we now explicitly set `cameraActive` to `false` right before
requesting a new camera. That is not just a hack but also makes semantically sense,
because the camera is briefly inactive right before requesting a new camera.

See: #416
@gruhn
Copy link
Owner

gruhn commented Feb 7, 2024

Thanks, I'm not sure if I reproduced your problem exactly but I found a bug and merged a fix. Please install v5.5.2 and check if you can still reproduce your problem.

As for the Safari issue you mention:

I add await navigator.mediaDevices.getUserMedia({video: true}); bc without it I don't get the devices on safari.

I'm not sure what's going on there.

@marcelloromanelli
Copy link

@viac92 I have the same issue. I've downgraded to 5.3.0 and it seems to be working ok there.
In my case if I specify the constraints onDetect is not being called

gruhn added a commit that referenced this issue Feb 14, 2024
Unify demos:

 * Handle Errors
 * Visual Tracking
 * Visual Tracking with Formats
 * Enumerate Devices

into a single demo. That makes the demo more complicated but allows
easier testing of the combination of features.

See: #416
gruhn added a commit that referenced this issue Feb 14, 2024
Unify demos:

 * Handle Errors
 * Visual Tracking
 * Visual Tracking with Formats
 * Enumerate Devices

into a single demo. That makes the demo more complicated but allows
easier testing of the combination of features.

See: #416
gruhn added a commit that referenced this issue Feb 15, 2024
Unify demos:

 * Handle Errors
 * Visual Tracking
 * Visual Tracking with Formats
 * Enumerate Devices

into a single demo. That makes the demo more complicated but allows
easier testing of the combination of features.

See: #416
@gruhn
Copy link
Owner

gruhn commented Feb 15, 2024

@marcelloromanelli I can't reproduce this issue. Can you provide a minimal reproduction? Ideally somewhere online.

gruhn added a commit that referenced this issue Feb 15, 2024
Unify demos:

 * Handle Errors
 * Visual Tracking
 * Visual Tracking with Formats
 * Enumerate Devices

into a single demo. That makes the demo more complicated but allows
easier testing of the combination of features.

See: #416
@azerioxal
Copy link

I'm having a similar issue. Only shows up when using contraints and paused. I'll setup a reproduction when I get a moment.

@azerioxal
Copy link

Well, I was trying to reproduce this in a sandbox and couldn't. For whatever reason it suddenly started working in the project I was having issues with too....

@gruhn
Copy link
Owner

gruhn commented Feb 26, 2024

Yeah, there is a lot of async stuff going. I suspect there are some race conditions.

@ninjabyron
Copy link

Yeah, there is a lot of async stuff going. I suspect there are some race conditions.

please fix it

@gruhn
Copy link
Owner

gruhn commented Mar 7, 2024

please fix it

Please provide a way for me to reproduce it

Copy link

github-actions bot commented May 7, 2024

This issue has been marked as stale. If there is no further activity it will be closed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants