Does it work within default_popup in a chrome extension?
See my post on Stackoverflow:
I saved jQuery, Bootstrap & Boostrap Multiselect into the chrome extension and loaded them within popup.js as per guide on the plugins page.
Popup.html
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css"/>
<!--<script type="text/javascript" src="js/jquery.min.js"></script>-->
<script type="text/javascript" src="js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
<link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css"/>
<select id="example-getting-started" multiple="multiple">
<option value="cheese">Cheese</option>
<option value="tomatoes">Tomatoes</option>
<option value="mozarella">Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>
<script src="popup.js"></script>
since I can't initialise the plugin within popup.html
<script type="text/javascript">
$(document).ready(function() {
$('#example-getting-started').multiselect();
});
</script>
as I get the error:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-4lndvGzcMkUnvdfuDCzL0sOEfIW9cdivCN8IPHGBevM='), or a nonce ('nonce-...') is required to enable inline execution.
popup.html:121 Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'". Either the 'unsafe-inline' keyword, a hash ('sha256-4lndvGzcMkUnvdfuDCzL0sOEfIW9cdivCN8IPHGBevM='), or a nonce ('nonce-...') is required to enable inline execution.
thus I placed it into popup.js
$(document).ready(function() {
$('#example-getting-started').multiselect({
});
console.log("multiselect");
});
I'm not getting any error message in the console within extension popup (only the log message) but bootstrap multiselect is not showing, only a button "None selected".
Note: As far I understand manifest version 3 doesn't support 'unsafe-inline' directive.
Turns out I'm using Bootstrap v5 which isn't supported https://github.com/davidstutz/bootstrap-multiselect/issues/1226
Surprised the guide doesn't mention this, would be great to have a note just like max jQuery v 2.x is pointed out, Ideally a check that throws an error in the console.
Also then popper.js was missing for the dropdown, neither found any reference within the guide on this one.