Multiple captcha elements on page fails

[thinkerytim]

If you create multiple forms on a page (eg. tabbed forms that submit separately) and use the Joomla captcha form element, the first captcha is simply duplicated which makes the second instance of the captcha fail to work.

example:

<fieldset name="captcha">
    <field
        name="captcha1"
        type="captcha"
        label="CAPTCHA1_LABEL"
        description="CAPTCHA1_DESC"
        validate="captcha"
        namespace="form1"
    />
</fieldset>
** and in another form on the same page **
<fieldset name="captcha">
    <field
        name="captcha2"
        type="captcha"
        label="CAPTCHA2_LABEL"
        description="CAPTCHA2_DESC"
        validate="captcha"
        namespace="form2"
    />
</fieldset>

I believe JCaptcha::getInstance() should be using the namespace of the field to generate unique signatures for the different captcha instances since the namespace is passed in the $options array:

$signature = md5(serialize(array($captcha, $options)));

However, if you dump the signature in both forms, you'll see they are identical, and the Google token is identical for both captcha instances as well, meaning the second instance can never work.

[Fedik]

... the Google token is identical for both captcha instances as well, meaning the second instance can never work

It is your assumption or you can prove it? 😃

On real it works fine, as there can be submitted only the one form with captcha.

[thinkerytim]

@Fedik -- how can I prove it? I posted the steps to duplicate the issue-- I could post a screenshot of the source of the page with the form showing the duplicate tokens and captcha elements, or a video showing how the second captcha fails, but this wouldn't prove anything more than me saying it.

Thanks

[brianteeman]

A change( #9111) has just been committed to the current staging and will be in 3.5beta3 hopefully released today that I hope resolves this. Please test and confirm and then this can be closed

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/9138.}

[thinkerytim]

@brianteeman -- thanks. To be clear, does this PR require the use of a hardcoded div with the g-recaptcha class? It doesn't appear to work using the normal captcha field element as shown in my example.

[Fedik]

does this PR require the use of a hardcoded div with the g-recaptcha class?

please see https://developers.google.com/recaptcha/docs/display

[thinkerytim]

@Fedik -- thanks, but isn't the point of standardized Joomla fields that as a component developer we can just use the generic captcha field type and expect that it will work regardless of which captcha plugin a user has enabled?

I know how to implement a recaptcha element in plain HTML-- I'm interested in using the Joomla captcha element in an XML form definition.

Can you provide an example of using multiple captcha form fields in the XML form?

[andrepereiradasilva]

To be clear, does this PR require the use of a hardcoded div with the g-recaptcha class? It doesn't appear to work using the normal captcha field element as shown in my example.

No.

Just as a test if you use the latest staging and add:

        <field
            name="captcha2"
            type="captcha"
            label="COM_USERS_CAPTCHA_LABEL"
            description="COM_USERS_CAPTCHA_DESC"
            validate="captcha"
        />

after https://github.com/joomla/joomla-cms/blob/staging/components/com_users/models/forms/remind.xml#L21 line.

Them go to /component/users?view=remind. Two captchas will appear.

[thinkerytim]

I've tested this on the Joomla 3.5-rc branch, and the ID of the div is identical for both captcha elements:

<div id="jform_1_captcha" class="g-recaptcha required" data-sitekey="6LeFONwSAAAAAMrDrdZR9iXh2kBcl4YTdxf_TZAQ" data-theme="light" data-size="normal" data-hl="en-GB"><div><div style="width: 304px; height: 78px;"><iframe src="https://www.google.com/recaptcha/api2/anchor?k=6LeFONwSAAAAAMrDrdZR9iXh2kBcl4YTdxf_TZAQ&amp;co=aHR0cDovL2xvY2FsaG9zdDo4MA..&amp;hl=en-GB&amp;v=r20160307141848&amp;theme=light&amp;size=normal&amp;cb=qorl6rqy0xyx" title="recaptcha widget" width="304" height="78" role="presentation" frameborder="0" scrolling="no"></iframe></div><textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px; height: 40px; border: 1px solid #c1c1c1; margin: 10px 25px; padding: 0px; resize: none; display: none; "></textarea></div></div>

So the first captcha validates correctly, the second one does not-- it throws an error saying it's unable to contact Google.

I suspect that if you inspect the source on your dual captcha test, you'll see that both captchas are identical, rather than having one element with the div ID of jform_catcha1_captcha and the second with a div ID of jform_catcha2_captcha, you'll instead see that they are both called jform_catcha1_captcha.

[Fedik]

I still cannot recreate your issue.

You got duplicated ID because you have 2 form where the same name of the capcha field, it also true for any other field with the same name. You can try to correct the form control in your code, to avoid such duplication (unique control to each form instance).

[thinkerytim]

@Fedik -- thanks, I have verified that your fix works when the two captchas are in the same form.xml-- however, in a similar use case, where two separate forms are loaded on the same page, the problem as I've identified it still happens. In my case, we have two forms that load in separate areas of the page, and are controlled from two separate xml files.

When the page loads, apparently when the second captcha is rendered, it falls back after the initial check for a captcha and loads the already loaded one instead of rendering the new one.

I hope this is clear.

[Fedik]

I have tried 2 capcha fields in 2 separated forms at the one page, and all works fine for me.
You know, without possibility to replicate the issue cannot be fixed.

I still suggest you to review your code that responsible for load/handle that forms. I have a doubt that it is Joomla issue.

[thinkerytim]

Thanks for your patience @Fedik -- this was actually an unrelated piece of code that had been corrupting the captcha output. Your fix works, and I appreciate your help!