sampotts/plyr

iOS - controls dont work if uses svgxuse

Open

#1132 opened on Jul 28, 2018

View on GitHub
 (1 comment) (0 reactions) (0 assignees)JavaScript (25,318 stars) (2,856 forks)batch import
Browser IssueHelp Wanted

Description

My project uses the svgxuse of Keyamoon: https://github.com/Keyamoon/svgxuse

but when put the plyrjs on my project the bottoms controls like pause video stop to work.

Steps to reproduce

use the svgxuse: https://github.com/Keyamoon/svgxuse

Environment

iOS - Chrome/Safari

Link to where the bug is happening

https://codepen.io/anon/pen/ejGXGw

Contributor guide

Tech stack
javascripthtmlcss
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
HTMLCSSJavaScriptSVG
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
45
Research direction
First, reproduce the bug on iOS using the provided CodePen (https://codepen.io/anon/pen/ejGXGw) to confirm that controls fail when svgxuse is used. Investigate how plyr loads its SVG sprite icons and how svgxuse interferes with the 'use' element in iOS browsers. Focus on plyr's control rendering code, likely in the JavaScript source, to understand the dependency on SVG references. Check existing comments or related issues for any hints, and consider testing with svgxuse disabled to isolate the conflict.