<apex:page controller="XSS_Visualforce_Mitigations_Demo" sidebar="false" tabStyle="XSS_Visualforce_Mitigations_Demo__tab" action="{!seedURL}">
<apex:sectionHeader title="XSS Visualforce Mitigations Demo" />
<apex:form >
    <apex:pageBlock >
        <c:Classic_Error />
        <apex:pageMessages />      
        <apex:pageBlockSection title="Demo" columns="1" id="tableBlock">

            <apex:outputPanel >
              <apex:outputText value="Welcome, <b>{!HTMLENCODE($CurrentPage.Parameters.user)}</b>!" escape="false"/><br/>
                
                <apex:outputText value="You are viewing the castle friend finder! We have randomly selected a friend for you." escape="false"/><br/>
                <apex:outputText id="output1" value=""/>
                <apex:outputText id="output2" value=""/>
                <script>
                    var vip = '{!JSENCODE(title)}';

                    if(vip!=''){
                        document.getElementById('{!$Component.output1}').innerHTML = '<br/>This person is a: <br/>&nbsp;-----<br/>| VIP |<br/>&nbsp;-----<br/>LUCKY YOU!';
                    } else {
                        document.getElementById('{!$Component.output1}').innerHTML = '<br/>This person is a peasant';
                    }  

                    var html = '<br/><br/><b>---------------------</b>';
                    html += '<br/>Personnel Name: {!JSINHTMLENCODE(name)}';
                    html += '<br/>Favorite color: {!JSINHTMLENCODE(color)}';
                    html += '<br/>Favorite animal: {!JSINHTMLENCODE(animal)}';
                    html += '<br/><b>---------------------</b>';
                    document.getElementById('{!$Component.output2}').innerHTML = html;
                    
                </script>
                
            </apex:outputPanel>
            
            <apex:outputPanel >
                <br/><br/>
                <apex:commandButton value="Click here to view the JavaScript based XSS!" action="{!JSXSS}"/>
                <apex:commandButton value="Click here to view the HTML based XSS!" action="{!HTMLXSS}"/>
                <apex:commandButton value="Click here to view the Javascript + HTML based XSS!" action="{!JSINHTMLXSS}"/>
                <apex:commandButton value="Remove All XSS" action="{!REMOVEXSS}"/>
            </apex:outputPanel>

        </apex:pageBlockSection>
        <apex:pageBlockSection title="Code links" columns="1">
            <apex:outputPanel >
                <ul>
                    <li><c:codeLink type="Visualforce" namespace="security_thail" name="XSS_Visualforce_Mitigations_Demo" description="Visualforce Page"/></li>            
                    <li><c:codeLink type="Apex" namespace="security_thail" name="XSS_Visualforce_Mitigations_Demo" description="Apex Controller"/></li>
                </ul>
            </apex:outputPanel>        
        </apex:pageBlockSection>        
    </apex:pageBlock>          
</apex:form>              
</apex:page>

public class XSS_Visualforce_Mitigations_Demo {

    public string hello {get; set;}
    public string title {get;set;}
    public string name {get;set;}
    public string color {get;set;}
    public string animal {get;set;}
    public Personnel__c person;

    public pageReference seedURL(){
        pageReference p = page.XSS_Visualforce_Mitigations_Demo;
        String user = ApexPages.currentPage().getParameters().get('user');
        if(string.isBlank(user)){      
            p.getParameters().put('user',userinfo.getName());
            p.setRedirect(true);
        } else {
            p.getParameters().put('user',user);
        }

        if(p.getRedirect()==true){
            return p;
        } else {
            return null; 
        }
        
    }   

    public XSS_Visualforce_Mitigations_Demo(){
        person = [SELECT Favorite_Animal__c,Favorite_Color__c,Id,Name,Title__c FROM Personnel__c where Favorite_Animal__c!=null and Favorite_Color__c!=null limit 1];
        title = person.title__c;
        // adding to fix demo steps...          
        title = 'THEME VIOLATION!!!!\';var newHTML = document.createElement(\'div\');newHTML.innerHTML = \'<img src="https://developer.salesforce.com/resource/images/astro.png" />\';document.body.appendChild (newHTML);var x =\'x';
        name = person.name;
        color = person.favorite_color__c;
        animal = person.favorite_animal__c;
        hello = ApexPages.currentPage().getParameters().get('user');
    }

    public pageReference HTMLXSS(){
        pageReference p = page.XSS_Visualforce_Mitigations_Demo;
        p.getParameters().put('user','THEME VIOLATION!!!! <img src="https://developer.salesforce.com/resource/images/astro.png"/>');
        p.setRedirect(true);
        return p;
    }

    public pageReference JSXSS(){
        title = 'THEME VIOLATION!!!!\';var newHTML = document.createElement(\'div\');newHTML.innerHTML = \'<img src="https://developer.salesforce.com/resource/images/astro.png" />\';document.body.appendChild (newHTML);var x =\'x';
        return null;
    }

    public pageReference JSINHTMLXSS(){
        color = 'THEME VIOLATION!!!! <img src="https://developer.salesforce.com/resource/images/astro.png"/>';
        return null;
    }
    
    public pageReference REMOVEXSS(){
        pageReference p = page.XSS_Visualforce_Mitigations_Demo;
        p.getParameters().put('user',userinfo.getName());              
        title = person.title__c;
        color = person.Favorite_Color__c;
        p.setRedirect(true);
        return p;
    }    

}