I'm building a chrome extension and it uses an HTML <form> element. On submit it opens to a new page which would process the input and send a notification using it.
When I use the  element so that the script is in the HTML file, it gives an error saying it violates the content security policy (and yes I have added the 'unsafe-inline' with the 'content-security-policy' line to the manifest for the extension- it still gives the same error).
When I try using var test = "<?php echo $TEST; ?> it does not work. Instead, the variable gets directly set to <?php echo $TEST; ?>.
This is the HTML with the PHP:
<!DOCTYPE html>
<html>
    <head>
        <?php
            $title = $_GET["title"];
            $iconURL = $_GET["iconURL"];
            $type = $_GET["type"];
            $msg = $_GET["msg"];
            $TEST = "test"
        ?>
        <title>Notification Tester</title>
        <script src="submitted.js" type="text/javascript"></script>
        <style>
            code {
                color: rgb(0, 0, 0);
                font-family: consolas;
                size: 20;
                background-color: #ebebeb;
                border: 5px, solid, #ebebeb;
                border-radius: 5px;
                padding: 2.5px;
            }
        </style>
    </head>
    <body>
        <p>Code used: </p> <br>
        <code>
              chrome.notifications.create('NOTIFICATION_ID', {<br>
                  type: <?php echo $_GET["type"]?><br>
                  iconUrl: <?php echo $_GET["iconURL"]?><br>
                  title: <?php echo $_GET["title"]?><br>
                  message: <?php echo $_GET["msg"]?><br>
                  priority: 2<br>
              }
        </code><br>
        <button function="back()">Back</button>
    </body>
</html>
This is the JavaScript file:
var Title = "<?php echo $Title; ?>"
var iconURL = "<?php echo $iconURL; ?>"
var type = "<?php echo $type; ?>"
var msg = "<?php echo $msg; ?>"
alert(Title)
alert(iconURL)
alert(type)
alert(msg)
/*var elements = document.getElementById("form").elements;*/
if (iconURL == "") {
    iconURL = "icon128.png";
}
if (Title == "") {console.warn("Title not supplied!");}
if (msg == "") {console.warn("Message not supplied!");}
/*console.warn("Type = " + selected + "; iconURL = " + iconURL + "; title = " + Title + "; message = " + msg);*/
chrome.notifications.create('NOTIFICATION_ID', {
    type: type.toString(),              
    iconUrl: iconURL.toString(),
    title: Title.toString(),
    message: msg.toString(),
    priority: 2
});
function back() {
    window.replace(main.html)
}
The URL when the HTML with PHP is opened is chrome-extension://gaknckdfbdfkicppeomjebaamoopolel/submit.html?type=Basic&title=test&iconURL=&msg=test (obviously, the value of variables could change).
