aws-samples / aws-samples/amazon-ivs-player-web-sample

How to delete ivs-player correctly when using vue for single page application?

Open
#30 11 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
90
Forks
38
PR merge metrics
No merged PRs in 30d

Description

**Describe the bug**
When using player for SPA(single page application) in vue, leaving and entering the route using player may cause player malfunction.

**To Reproduce**
1. clone code
```console
git clone https://github.com/coooo77/ivs-player.git
cd ivs-player
```

2. Install dependencies and run app
```console
npm install
npm run serve
```

3. open app in local environment [http://localhost:8080/](http://localhost:8080/)

4. enter back and forth between Home and About page

**Expected behavior**
ivs player can be delete correctly and works correctly when creating player.

**Screenshots**

https://user-images.githubusercontent.com/8820762/122716503-e98d1300-d29c-11eb-946f-8e9f6f3d17fd.mp4

**Desktop (please complete the following information):**
- OS: win10
- Browser Chrome
- Version v89

**Additional context**
1. Using delete method from ivs-player causes player malfunction, while using dispose method from videojs, it works but accumulating amazon-ivs-wasmworker.min.js and leading to memory leak (as shown above in Screenshots).
2. if we dont delete player, get waring from videojs and player fails to work:
```console
VIDEOJS: WARN: Player "videojs-player" is already initialised. Options will not be applied.
Player is ready to use
```

Contributor guide

Open the contributing guide

Research direction

Clone the linked ivs-player sample, run npm install and npm run serve, then reproduce the problem by navigating between Home and About. Compare the IVS Player delete behavior with videojs dispose and verify that route changes avoid player malfunction, initialization warnings, and accumulation of amazon-ivs-wasmworker.min.js.

Written by the indexing model from the issue text.

Assessment

Tech stack
aws, javascript
Domain
audio-video-rtc, frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.