191782 2018-11-16 15:22:43 -0800 CSP can block Safari’s default media player UI icons 2022-02-14 19:06:11 -0800 1 1 1 Unclassified WebKit New Bugs Safari Technology Preview Unspecified macOS 10.14 RESOLVED DUPLICATE 223422 https://bugs.webkit.org/show_bug.cgi?id=225865 InRadar P2 Normal --- 1 code webkit-unassigned bfulgham chall0 dante3333 dbates dino d_vine_me graouts lode moirelein sierkb sprbeheer webkit-bug-importer webkit oldest_to_newest 1479677 0 355140 code 2018-11-16 15:22:43 -0800 Created attachment 355140 Screenshot Set the following Content-Security-Policy (CSP) header: default-src 'none'; img-src 'self'; media-src 'self'; report-uri http://localhost/csp-reports And a sample document: <video autoplay controls> <source src="./video.mp4" type="video/mp4"> </video> Expected results: The video should load and start auto playing. When hovering the video, you should see standard controls and be able to interact with them. This is browser UI and should just work. Works fine in Chromium and Firefox. Actual results: The video will autoplay and the default UI toolbars will display. However, the button icons are invisible and the user can’t interact with them. Safari also reports a CSP violation about having blocked data:image/svg files to http://localhost/csp-reports 1479936 1 webkit-bug-importer 2018-11-17 12:16:14 -0800 <rdar://problem/46151484> 1553149 2 moirelein 2019-07-16 01:19:22 -0700 As a workaround I use the CSP policy `img-src 'self' data:` 1694534 3 d_vine_me 2020-10-04 06:49:52 -0700 The same happens in Chrome on iOS, so it's not a Safari bug, but most likely, as usual, one of Apple's weird policies. 1841527 4 gsnedders 2022-02-14 19:06:11 -0800 Sorry for the forward dupe, this got resolved in a different issue. *** This bug has been marked as a duplicate of bug 223422 *** 355140 2018-11-16 15:22:43 -0800 2018-11-16 15:22:43 -0800 Screenshot safari-video-ui-csp-blocked.png image/png 4271 code iVBORw0KGgoAAAANSUhEUgAABR4AAALqCAMAAABkJbj0AAABklBMVEUQEBD//v/////4+PjPz8+x sbGbm5uNjY2Hh4eGhobn5+e4uLjf39+FhYWEhISDg4OCgoKCgYKBgYGBgIGAgICAf4B/f4CDgoOE g4SFhIWAgIGVlZXFxcXl5eX29vbX19e0tLTV1dX19fXHx8eXl5ednZ3Z2dnw8PD+/v7o6OjGxsaK ioqmpqbs7Oz5+fmJiYm8vLzc3Nz6+vrx8fGhoaHd3d2IiIilpaXKysqYmJjh4eGOjo7t7e27u7ui oqLu7u78/Pzq6uqjo6P39/fy8vLp6en09PSysrKpqam1tbXBwcGMjIzv7+/CwsKfn5+goKDj4+OP j4/AwMCkpKSSkpLU1NS5ubmurq739vf19PX9/f2zs7OoqKiWlpb7+/uamprMzMyUlJTk5OTa2trI yMjNzc329fbW1tanp6eQkJCRkZG3t7ewsLDT09Pm5ua/v7/ExMSTk5PY2Njz8/PDw8OsrKzOzs7i 4uKvr6++vr7e3t66urqtra2enp6Li4urq6vR0dHLy8u9vb3g4OCqqqqZmZn/B4PMAAAO2ElEQVR4 Aezbx5UbQQxAQQmcNuhh/unKXnlb4q2wqgrit8U33gUAAAAAAAAAAAAAAAAAAAAAAAD4/lcA/G/k EUAeAeQRQB4B5BFAHoF/mjwGwOeSRwB5BJBHAHkEkMfHNeba+UF7zXE9AuCr5PGMnW+zxwmAL5HH O9/sDoD+eTwz326eAGiex+fKAusZAK3zeFaWWCcAOudxZpEZAI3zeGeZOwDa5vFkoRMAXfM4stAI gKZ5fOwstB8B0DOPV5a6AqBnHke+4HQNyOPMUjMAeuZxZakVAD3zuLPUDoCeecxiUQ9AHgHkEUAe 6wHII4A8AsgjgDwCyGM9AHkEkEcAeQSQRwB5rAcgjwDyCCCPAPJYD0AeAeQRQB4B5BFAHgHkEeDz ySOAPALII4A8AsgjgDwCNMrjzlI7AHrmcWWpFQA98ziz1IyeAHkcWWpET4A8Xlnqip4AeXzsLLQf 0RMgjzGcrYFX5PFkoRNdAfIYd5a5oy9AHmP61QO8Io9nZYl1ojNAHuO5ssB6Rm+APMaZ+XbzRHeA PEbcXmWAV+Qxztj5Nnuc6A+Qx78e15hr5wftNcdlVoaf7NSBDAAAAMAgf+t7fAXRCXoE0COAHvUI oEcAPQLoEUCPAHoE0COAHgH0CKBHAD0C6BFAj3oE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4fAPQI oEcAPQLoEUCPAHoE0COAHgH0CKBHAD0C6FGPAHoE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9KhH AD0C6BFAjwB6BNAjgB4B9AigRwA9AujxAUCPAHoE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB71CKBH AD0C6BFAjwB6BNAjgB4B9AigRwA9AugRQI96BNAjgB4B9AigRwA9AugRQI8AegTQI4AeHwD0CKBH AD0C6BFAjwB6BNAjgB4B9AigRwA9AuhRjwB6BNAjgB4B9AigRwA9AugRQI8AegTQI4AeAfSoRwA9 AugRQI8AegTQI4AeAfQIoEcAPQLo8QFAjwB6BNAjgB4B9AigRwA9AugRQI8AegTQI4Ae9QigRwA9 AugRQI8AegTQI4AeAfQIoEcAPQLoEUCPegTQI4AeAfQIoEcAPQLoEUCPAHoE0COAHh8A9AigRwA9 AugRQI8AegTQI4AeAfQIoEcAPQLoUY8AegTQI4AeAfQIoEcAPQLoEUCPAHoE0COAHgH0qEcAPQLo EUCPAHoE0COAHgH0CKBHAD0C6PEBQI8AegTQI4AeAfQIoEcAPQLoEUCPAHoE0COAHvUIoEcAPQLo EUCPAHoE0COAHgH0CKBHAD0C6BFAj3oE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4fAPQIoEcAPQLo EUCPAHoE0COAHgH0CKBHAD0C6FGPAHoE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9KhHAD0C6BFA jwB6BNAjgB4B9AigRwA9AugRQI9jAHoE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9KhHAD0C6BFA jwB6BNAjgB4B9AigRwA9AugRQI97AHoE0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9KhHAD0C6BFA jwB6BNAjgB4B9AigRwA9AugRQI8AetQjgB4B9AigRwA9AugRQI8AegTQI4AeAfQIoMcxAD0C6BFA jwB6BNAjgB4B9AigRwA9AugRQI8AetQjgB4B9AigRwA9AugRQI8AegTQI4AeAfQIoEcAPeoRQI8A egTQI4AeAfQIoEcAPQLoEUCPAHoE0OMYgB4B9AigRwA9AugRQI8AegTQI4AeAfQIoEcAPeoRQI8A egTQI4AeAfQIoEcAPQLoEUCPAHoE0COAHvUIoEcAPQLoEUCPAHoE0COAHgH0CKBHAD0C6HEMQI8A egTQI4AeAfQIoEcAPQLoEUCPAHoE0COAHvUIoEcAPQLoEUCPAHoE0COAHgH0CKBHAD0C6BFAj3oE 0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9DgGoEcAPQLoEUCPAHoE0COAHgH0CKBHAD0C6BFAj3oE 0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9AigRz0C6BFAjwB6BNAjgB4B9AigRwA9AugRQI8AehwD 0COAHgH0CKBHAD0C6BFAjwB6BNAjgB4B9AigRz0C6BFAjwB6BNAjgB4B9AigRwA9AugRQI8AegTQ ox4B9AigRwA9AugRQI8AegTQI4AeAfQIoEcAPY4B6BFAjwB6BNAjgB4B9AigRwA9AugRQI8AegTQ ox4B9AigRwA9AugRQI8AegTQI4AeAfQIoEcAPQLoUY8AegTQI4AeAfQIoEcAPQLoEUCPAHoE0COA HscA9AigRwA9AugRQI8AegTQI4AeAfQIoEcAPQLoUY8AegTQI4AeAfQIoEcAPQLoEUCPAHoE0COA HvcA9AigRwA9AugRQI8AegTQI4AeAfQIoMfYuasEaWEgAMIPaDPWSdbvf89fszbYpgmj9SFHKCRS lFXdtHL7dkf2Aw6RfnL+nxDCw4fH6Onp7/3hUwjB/+Wc03fPh//2Pbs+AWDWNnVVFtny2FWtzCOP sY/HgfyIYxTr6J1TSx4FwFJt1eXJ40Yi8pjQxyjG0VDHaJU6AthkyGNXyyzyqD4Kx4E8Fnzk9NPh x3mUPADU3dI8bhshj6l9nAikT6zjfqU6Ami2y/LYWepIHsf6GPwHJY/AmTXdojzW0kcfXwx9NNRx 3TwCqJfkcSNy5318Tc5jDOR0HR15BC7Axp7HTu7QUR7T+xgDmbuO+fMIoDPnsZJ7dJTH1/Q8xkC+ feM/OfIIXIbKmseilUH08WW+jz7885FGQx3XziOAtjDmsZQ7Zcyj+p9w7mLyCKA05rESoY+vxj7m r2P+PAKojHms5W4Z86iOPAJXpTbmsSGP8es6oY8uax3XzSOAxpjHVo6Rxw8jeVQ3GcgYxwvJI4DW mEchj7Y+uvE6akId188jgKx5JI/RSB7VjQbSqZJHgDxet+OVM2l9HAmkGup4kXkEyCN5jGby+KxH 3BBV8giQx+u3y91HNdSRPALk8dr3fXx+1mPHccycRwC/2bsL3jayOIri0gn5FoVlDDM162w4sVNm bpjLzMz93muPnyzH2tdJ64wD+v9EbRKx7pGGLY/7Dxzk0OEjylN2tJItVdVyamrrqG9obIosj3vD +5jPE8eNV8fm0pbW1pbSZhlTrEW3tXd0cuxwteXxd7rI+CeuHPHDZHQr8C8Z9T2R5dF/8drbxxC7 d/9xHrUGenpxentkTFEW3ddPxoDl0W8QYKgTaFBaRZ/SeoHhIYBmpRwBGBkBjsUiy2N4HzdlHRNJ spIJGVOERbe1AslR93/Lo8dxONEnnQROSToNZyQlgK3S2To4p5ROON8kdQMXospjiiePf9fH3X+c R62FniQ5kj0yJvpFtwMXpb4huGR59LkAXFbKFRiRNATDkg5Co3tYkqvSNWhR2nW4oWVudlSW/JVk nltph/5HZdbY2ImVGxsbq3QOeSSXK1kT4yzTMmFMiLLJqQIXHZuGC0qZASyPPkdhVmlNwFzw/3np MlChtEZYkOKNi6eUtgSnletAiRNxHp2xv6nj7fVcx07yVE0YE+pCYYvuhhYF4vGY5dGnAfYrcAfu ShUDA/ekLuhQ4D70K+syMKMcN0tWL48hfXQ2TR2dYfL0ThgTbqqgRd+AB30PHz1+dKNJXpbHVlDG E3gg5yQ8VQbUK/Cs6+4V4LlydRQxj84K81iZraMnj8n1kcd68ryYMCbcZEGLXoR2AsMJy6MXTCvj ISzKeQmnlXEIYkp7TFq7lqksPI/+o+sC+ljpqeP6yyP5pieMCVemHDinVrro55A1Jy/LY4kyXsFr OYtQpoxRiCvtDYEnEeTRCc2jE3pcXempo+Vxc7M8vl3poi8BnV1SYhzm5WV5RBlbc9J3A94pox4U uJ9ofvAYOBLRwfWq9HEspdJTRzu43qzs4LpqKaNvpYuuBaqVUgPELI8e56BNgUW4KSme/u8pWFIg BiekrKdwKIpLM054Hp3wOPrr6CQ38KUZY6YKWvQibMveJjljefR4DycVeAE10lv4IPVAqwIf8+4a BWJR3NjjuDz6++hN5Fig0l/HyPJY/Bt7jLlQ2KIfwJ3s3ycsjx4DMKK0T0Cb1AKdUgy4qrR5OCNt hbcKAPFIbgt3XB5D++iMLVO5nItj1Hks/m3hxm4LL3DRXTCa/UR/n+XRo81dje6rhEZJtdAg6QqU XJb0APgsfYFzbVLQycqIHir0vbjH2emxO2tnnh1ZRf2Aqz1UaNb/onUOPijzc2R59DkAfC3begLo k3TvwIH9kj4DyRsPXwPf3H9bZ7u7HgGNUeXR2eGx0yc/js6O4ufRXklhNsiiNQk8ujt5GPhuefSK L+DcVY4Ezo82pZwCZ0tM0fZxh89OLxfHgupYvDzaC83M2i9apThbJMuj3yJpleV5mx0lbcnV8OoQ gfNtWjXheVxpHwuqo6M1Y6/DNcVftCbcomOWx9+bOfWlQsp39uep8piyqr+0n77QpNXkyaNXNHV0 VHzGrOGi9evmwwttkuVxvfLk0WdPBHX8rz07MG0YBsIwCrIly0oG8P6TNtAC0FgUzqRI5r0hPu74 5RHkcUidPPYcL5+pozyCPA6ml8eO49u1OsojyOMMennsOH5cr6M8zgt5lMfAAXkE6yiPg0Ee697n u+7p9/FQRxhNDeZx2/9gnOl47+Pxoo4wnC2Yx7LLY7CPL7/SqI4wohLMY97lMdDHKHH8f5CDeVx3 eTyjjrcBazCPS5XHU+oIN1GXYB5Tlsdz6gj3kFM0j00eP9BHq8wwoIXzmB762CGPcAOPFM9jKvrY IY/Tg5Ku5LFt+tghj5ODrV3KY3rqYy+Q8jg12J7pWh5TK3uHPsrjvKC0FMljYJ/RR3mcFVaZeB5T y1UfT8njlKDmlkJ5PLGsuWxVHt/I42SgbiWvS0rxPALcnjwCyCOAPALII4A8AsgjgDwCyCOAPALI I4A8AsjjcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL4AhzZ8SRReZ0gAAAAASUVORK5CYII=