Simone Arpeandbridiver
dba6298f0d
Implements a strategy to bring back picture in picture support for YouTube videos. Picture in picture implementation is behind feature flag `kBravePictureInPictureForYouTubeVideos` enabled by default. Test coverage has been extensively discussed and introduced to make sure: - We don't have race conditions when injecting the JS script - We don't inject the script multiple times on same page navigation - We don't create side effects in case of unexpected changes, and/or serialzed flags don't match - We inject/modify the serialized flags in case of partial match --------- Co-authored-by: bridiver <34129+bridiver@users.noreply.github.com>
53 lines
1.5 KiB
HTML
53 lines
1.5 KiB
HTML
<html>
|
|
<head>
|
|
<title>OK</title>
|
|
<script>
|
|
// Backup the original `replace` method.
|
|
const originalReplace = String.prototype.replace;
|
|
|
|
// Add a counter to track the number of times `replace` is called.
|
|
let replaceCallCount = 0;
|
|
|
|
// Override `String.prototype.replace`.
|
|
String.prototype.replace = function (...args) {
|
|
// Increment the counter.
|
|
replaceCallCount++;
|
|
|
|
// Call the original `replace` method and return the result.
|
|
return originalReplace.apply(this, args);
|
|
};
|
|
|
|
// Function to get the current replace call count.
|
|
window.getReplaceCallCount = function () {
|
|
return replaceCallCount;
|
|
};
|
|
|
|
// Mock `window.ytcfg` object.
|
|
window.ytcfg = {
|
|
data_: {
|
|
WEB_PLAYER_CONTEXT_CONFIGS: {
|
|
WEB_PLAYER_CONTEXT_CONFIG_ID_MWEB_WATCH: {
|
|
serializedExperimentFlags: `
|
|
html5_picture_in_picture_blocking_ontimeupdate=true&
|
|
html5_picture_in_picture_blocking_onresize=true&
|
|
html5_picture_in_picture_blocking_document_fullscreen=true&
|
|
html5_picture_in_picture_blocking_standard_api=true&
|
|
html5_picture_in_picture_logging_onresize=true&
|
|
another_flag_for_testing=true
|
|
`
|
|
}
|
|
}
|
|
},
|
|
get(key) {
|
|
// Allow access to keys via a simple getter.
|
|
return this.data_[key];
|
|
}
|
|
};
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<a href="#section1" id="link1">Go to Section 1</a>
|
|
<a href="#section2" id="link2">Go to Section 2</a>
|
|
</body>
|
|
</html>
|