Javascript in bbcode

[Tom Waw]

Hi guys.
I'm trying to add new bbcode for spoiler. According to this page I modified bb-config.xml adding this:
<match name="spoiler">        <regex>(?s)\[spoiler\](.*?)\[/spoiler\]</regex>        <replace>        <![CDATA[        <span onclick="var elemento = this.nextSibling.nextSibling.nextSibling.nextSibling.children[0];elemento.style.display=='none'?elemento.style.display='block':elemento.style.display='none';">[]</span>        <span class="genmed" ><b>Spoiler:</b></span>        <div>        <pre bbCodeId="pre-code" style="display:none;overflow: auto; width: 95%; max-height: 350px; height:expression(this.scrollHeight > 350 ? '350px' : 'auto');">$1</pre>        </div>        ]]>        </replace>    </match>

[Tom Waw]

Unfortunetly pressed submit before finishing my post Sorry.
I also tried this one:

<match name="spoiler">
       <regex>(?s)\[spoiler\](.*?)\[/spoiler\]</regex>
       <replace>
       <![CDATA[
<div style="margin-bottom: 2px;">
   <b>Hidden text. </b>

   <input value="Show" type="button" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;"
          onclick="
                  if (this.parentNode.getElementsByTagName('div')[1].style.display != 'inline') {
                      this.parentNode.getElementsByTagName('div')[1].style.display = 'inline';
                      this.value = 'Hide';
                  } else {
                      this.parentNode.getElementsByTagName('div')[1].style.display = 'none';
                      this.value = 'Show';
                  }">

   <div style="border: 1px inset; padding: 6px; margin-top: 3px;">
       <div style="display: none;">{TEXT}</div>
   </div>
</div>

Everything shows correctly except onclick param.  Input doesn't have it. Should I add something somewhere else?

[Tim Moores]

That's tricky. JForum disallows the injection on JavaScript handlers on a code level (in the SafeHtml class, in case you're curious.) How about something like this:
<replace>        <![CDATA[Select text in box below to reveal:<br/> <div style="color: white; background-color: white;">$1</div>]]> </replace>

On an unrelated subject: you are using the latest JForum version from SourceForge, yes? The original version from jforum.net has multiple security holes (and other bugs) that will never be fixed.

[Tom Waw]

I'm using JForum ver. 2.4.1.

Thanks for reply but this isn't what I need. I wanted hide large amount of text in this tag e.g. change notes. So yeah it will be hide but still takes a lot of space :P

In one topic I found something like "attributes.welcome" (not really remember exaclty name ) for html. How about adding there "onclick" value?

[Tim Moores]

That would work for other attributes, but the code that removes Javascript handlers takes precedence over that setting.

[Tom Waw]

Thanks Tim for advice. I did some customisation and posted changes if someone needs this too.

To bb_config.xml add following lines:
<!-- SPOILER --> <match name="spoiler"> <regex>(?s)\[spoiler\](.*?)\[/spoiler\]</regex> <replace> <![CDATA[ <div style="margin-bottom: 2px;"> <b>Hidden text. </b> <input value="Show" type="button" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if(this.parentNode.getElementsByTagName('div')[1].className == 'spoilertext'){if(this.parentNode. getElementsByTagName('div')[1].style.display != 'inline') {this.parentNode.getElementsByTagName('div')[1].style.display = 'inline';this.value = 'Hide';} else {this.parentNode. getElementsByTagName('div')[1].style.display = 'none';this.value = 'Show';}}">        <div style="border: 1px inset; padding: 6px; margin-top: 3px;">        <div class="spoilertext" style="display: none;">$1</div>        </div>        </div>        ]]> </replace> </match>
Note: in my code input is as one line. Here I broke line few times.

In SafeHtml added:

//field
private static Map<String, Set<String>> allowedScripts;
//static
static {
// old code
allowedScripts = new HashMap<String, Set<String>>();
prepareAllowedScript();
}
private static void prepareAllowedScript() {
        String spoilerScript =  "if(this.parentNode.getElementsByTagName('div')[1].className"
                + " == 'spoilertext'){if(this.parentNode.getElementsByTagName('div')[1]"
                + ".style.display != 'inline') {this.parentNode.getElementsByTagName('div')"
                + "[1].style.display = 'inline';this.value = 'Hide';} else "
                + "{this.parentNode.getElementsByTagName('div')[1].style.display"
                + " = 'none';this.value = 'Show';}}";
        spoilerScript = spoilerScript.toLowerCase();
        allowedScripts.put("ONCLICK", Sets.newHashSet(spoilerScript));

      }
//in method private boolean isAttributeSafe(String name, String value) changed first if
	private boolean isAttributeSafe(String name, String value)
	{
        if (name.length() >= 2 && name.charAt(0) == 'O' && name.charAt(1) == 'N') {
            Set<String> scripts = allowedScripts.get(name);
            if (scripts != null) {
                for (String script : scripts) {
                    if (script.equals(value)) {
                        return true;
                    }
                }
            }
            return false;

        }
//old code
}

and added some unit test to cover changes (SafeHtmlTest)

    @Test
    public void testSpoilerScriptShouldStay() throws Exception {
        String input = "<input value=\"Show\" type=\"button\" style=\"margin: 0px; padding: 0px;"
                + " width: 60px; font-size: 10px;\" onclick=\""
                + "if(this.parentNode.getElementsByTagName('div')[1].className"
                + " == 'spoilertext'){if(this.parentNode.getElementsByTagName('div')[1]"
                + ".style.display != 'inline') {this.parentNode.getElementsByTagName('div')"
                + "[1].style.display = 'inline';this.value = 'Hide';} else {this.parentNode."
                + "getElementsByTagName('div')[1].style.display = 'none';this.value = 'Show';}}\">";
        String output = "<input value=\"Show\" type=\"button\" style=\"margin: 0px; padding: 0px;"
                + " width: 60px; font-size: 10px;\" onclick=\""
                + "if(this.parentNode.getElementsByTagName('div')[1].className "
                + "== 'spoilertext'){if(this.parentNode.getElementsByTagName('div')[1]"
                + ".style.display != 'inline') {this.parentNode.getElementsByTagName('div')"
                + "[1].style.display = 'inline';this.value = 'Hide';} else {this.parentNode."
                + "getElementsByTagName('div')[1].style.display = 'none';this.value = 'Show';}}\">";

        String result = new SafeHtml().ensureAllAttributesAreSafe(input);
        assertEquals(output, result);
    }

    @Test
    public void testNotSpoilerScriptShallBeRemove() throws Exception {
        String input = "<input value=\"Show\" type=\"button\" style=\"margin: 0px; padding: 0px;"
                + " width: 60px; font-size: 10px;\" onclick=\"alert(0)\">";
        String output = "<input value=\"Show\" type=\"button\" style=\"margin: 0px; padding: 0px;"
                + " width: 60px; font-size: 10px;\" >";

        String result = new SafeHtml().ensureAllAttributesAreSafe(input);
        assertEquals(output, result);
    }

    @Test
    public void testNotSpoilerScriptShallBeRemove2() throws Exception {
        String input = "<input value=\"Show\" type=\"button\" style=\"margin: 0px; padding: 0px;"
                + " width: 60px; font-size: 10px;\" onclick=\"javascript:alert('buuuh!!!');\"\"\""
                + " src=\"javascript:alert('hi from an alert!');\"onmouseover=\"javascript:"
                + "alert('buuuh!!!');\"\"\" src=\"javascript:alert('hi from an alert!');\">";
        String output = "<input value=\"Show\" type=\"button\" style=\"margin: 0px; padding: 0px;"
                + " width: 60px; font-size: 10px;\" \"\" \"\" >";

        String result = new SafeHtml().ensureAllAttributesAreSafe(input);
        assertEquals(output, result);
    }

I know that the js section is very ugly xD
hf

[Jeanne Boyarsky]

Thanks for sharing your code!