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

chore: cherry-pick - fix: Use custom controls for iOS video (#7729) (#7737) #7785

Merged
merged 3 commits into from
Nov 15, 2023

Conversation

chrisleewilcox
Copy link
Contributor

Description

It was discovered that the video begins crashing the app for iOS 17.2+ physical devices. While there is no solution in the latest react-native-video package at the moment
(TheWidlarzGroup/react-native-video#3329), we can patch it by removing the controls prop and temporarily use custom controls (a play/pause + mute controls). The tradeoff is that other features such as full screen and seeking will not be available on iOS.

Related issues

Fixes: #7729

Manual testing steps

  1. Go to this page... 2.

Screenshots/Recordings

Before

After

Screenshot 2023-11-09 at 9 19 57 AM

iOS 17.2 Interaction

17.2.mp4

Video with play/pause + mute controls on settings

settings-volumne.mov

Video with play/pause + mute controls on onboarding

onboarding-volume.mov

Android remains the same
https://recordit.co/pTuloJmuIn

Pre-merge author checklist

  • I’ve followed MetaMask Coding Standards.
  • I've clearly explained what problem this PR is solving and how it is solved.
  • I've linked related issues
  • I've included manual testing steps
  • I've included screenshots/recordings if applicable
  • I’ve included tests if applicable
  • I’ve documented my code using JSDoc format if applicable
  • I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.
  • I’ve properly set the pull request status:
    • In case it's not yet "ready for review", I've set it to "draft".
  • In case it's "ready for review", I've changed it from "draft" to "non-draft".

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

Description

Related issues

Fixes: #

Manual testing steps

  1. Go to this page...

Screenshots/Recordings

Before

After

Pre-merge author checklist

  • I’ve followed MetaMask Coding Standards.
  • I've clearly explained what problem this PR is solving and how it is solved.
  • I've linked related issues
  • I've included manual testing steps
  • I've included screenshots/recordings if applicable
  • I’ve included tests if applicable
  • I’ve documented my code using JSDoc format if applicable
  • I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.
  • I’ve properly set the pull request status:
    • In case it's not yet "ready for review", I've set it to "draft".
    • In case it's "ready for review", I've changed it from "draft" to "non-draft".

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

## **Description**

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

It was discovered that the video begins crashing the app for iOS 17.2+
physical devices. While there is no solution in the latest
react-native-video package at the moment
(TheWidlarzGroup/react-native-video#3329),
we can patch it by removing the `controls` prop and temporarily use
custom controls (a play/pause + mute controls). The tradeoff is that
other features such as full screen and seeking will not be available on
iOS.

## **Related issues**

Fixes: #7729

## **Manual testing steps**

1. Go to this page...
2.
3.

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**
<img width="537" alt="Screenshot 2023-11-09 at 9 19 57 AM"
src="https://github.com/MetaMask/metamask-mobile/assets/10508597/134b6eb2-8017-4b2c-ae7d-12a28a47d10a">


<!-- [screenshots/recordings] -->

iOS 17.2 Interaction

https://github.com/MetaMask/metamask-mobile/assets/10508597/8976d5b7-d276-4834-9496-0ba8608e25e3

Video with play/pause + mute controls on settings

https://github.com/MetaMask/metamask-mobile/assets/10508597/492fb78d-3703-4714-bed1-8ddd7b631efa

Video with play/pause + mute controls on onboarding

https://github.com/MetaMask/metamask-mobile/assets/10508597/14780058-c595-4fb9-8aab-9987120c8126

Android remains the same
https://recordit.co/pTuloJmuIn

## **Pre-merge author checklist**

- [ ] I’ve followed [MetaMask Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've clearly explained what problem this PR is solving and how it
is solved.
- [ ] I've linked related issues
- [ ] I've included manual testing steps
- [ ] I've included screenshots/recordings if applicable
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.
- [ ] I’ve properly set the pull request status:
  - [ ] In case it's not yet "ready for review", I've set it to "draft".
- [ ] In case it's "ready for review", I've changed it from "draft" to
"non-draft".

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.
@chrisleewilcox chrisleewilcox changed the title chore: cherry-fix - fix: Use custom controls for iOS video (#7729) (#7737) chore: cherry-pick - fix: Use custom controls for iOS video (#7729) (#7737) Nov 13, 2023
Copy link
Contributor

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@chrisleewilcox chrisleewilcox self-assigned this Nov 13, 2023
Copy link
Contributor

@Cal-L Cal-L left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@chrisleewilcox chrisleewilcox added release-7.11.0 Issue or pull request that will be included in release 7.11.0 Spot Check on the Release Build If a ticket doesn't require feature QA, but does require some form of manual spot checking team-mobile-client labels Nov 14, 2023
@codecov-commenter
Copy link

codecov-commenter commented Nov 14, 2023

Codecov Report

All modified and coverable lines are covered by tests ✅

❗ No coverage uploaded for pull request base (release/7.11.0@353390c). Click here to learn what that means.

Additional details and impacted files
@@                Coverage Diff                @@
##             release/7.11.0    #7785   +/-   ##
=================================================
  Coverage                  ?   34.97%           
=================================================
  Files                     ?     1034           
  Lines                     ?    27563           
  Branches                  ?     2284           
=================================================
  Hits                      ?     9641           
  Misses                    ?    17411           
  Partials                  ?      511           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@chrisleewilcox chrisleewilcox marked this pull request as ready for review November 14, 2023 22:08
@chrisleewilcox chrisleewilcox requested a review from a team as a code owner November 14, 2023 22:08
Copy link
Contributor

E2E test started on Bitrise: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/318378c2-c876-4c08-8a4b-e0658b9f340c
You can also kick off another Bitrise E2E smoke test by removing and re-applying the (Run Smoke E2E) label

Copy link
Contributor

E2E test started on Bitrise: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/6e0505a1-4e74-45a5-88f7-c942f1b08831
You can also kick off another Bitrise E2E smoke test by removing and re-applying the (Run Smoke E2E) label

Copy link

sonarcloud bot commented Nov 15, 2023

Kudos, SonarCloud Quality Gate passed!    Quality Gate passed

Bug A 0 Bugs
Vulnerability A 0 Vulnerabilities
Security Hotspot A 0 Security Hotspots
Code Smell A 0 Code Smells

3.0% 3.0% Coverage
0.0% 0.0% Duplication

@chrisleewilcox chrisleewilcox merged commit c14a180 into release/7.11.0 Nov 15, 2023
25 checks passed
@chrisleewilcox chrisleewilcox deleted the chore/cherry-pick-7737 branch November 15, 2023 05:01
@github-actions github-actions bot locked and limited conversation to collaborators Nov 15, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
release-7.11.0 Issue or pull request that will be included in release 7.11.0 Spot Check on the Release Build If a ticket doesn't require feature QA, but does require some form of manual spot checking team-mobile-platform
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants