Calendar widget broken in 2018.2.1

[ahenket]

As of Orbeon 2018.2.1, the date picker/calendar widget is broken. When you click the icon for the picker a small div opens bottom left of the input field and the browser reports:

[Error] TypeError: null is not an object (evaluating 'b.hasAttribute')
	notify (orbeon-ae423d43cb2a09340500f4a307592211bc88848f.js:188:1502)
	fire (orbeon-ae423d43cb2a09340500f4a307592211bc88848f.js:188:1204)
	click (orbeon-ae423d43cb2a09340500f4a307592211bc88848f.js:217:18155)
	v (orbeon-ae423d43cb2a09340500f4a307592211bc88848f.js:188:3901)

To reproduce:

<xh:html xmlns:xf="http://www.w3.org/2002/xforms"
                xmlns:xh="http://www.w3.org/1999/xhtml"
                xmlns:xs="http://www.w3.org/2001/XMLSchema">
    <xh:head>
        <xh:title>Date tester</xh:title>
        <xf:model>
            <xf:instance id="test">
                <date/>
            </xf:instance>
            <xf:bind nodeset="instance('test')" type="xs:date"/>
        </xf:model>
    </xh:head>
    <xh:body>
        <xf:input ref="instance('test')">
            <xf:label>Test Date</xf:label>
        </xf:input>
    </xh:body>
</xh:html>

[avernet]

Thank you for the detailed report @ahenket. We fixed the issue, and the fix will be included in 2019.1 as well as the next 2018.2 point release (both PE and CE).

[ahenket]

I see 'legacy date': is there a more recommended way?

[avernet]

@ahenket The "recommended way" would be to use the new fr:date component. It is implemented in XBL, and we would like it to be "picked" automatically as the implementation for an xf:input bound to a node of type date (xs:date or xf:date). However, we can't do that right now, as the XForms engine doesn't know how to switch from one implementation to another after the page has been loaded, which is required as the type of a node can change after the page is loaded. We have RFE #1248 for this, and I've added a +1 for this use case.

In the meantime, if your type doesn't change, and you know you have a date, you can explicitly use an fr:date, as done by Form Builder.

[ahenket]

I must be doing something wrong. With fr:date under 2018.2.1 the form fails to load and I get:

|Invalid schema type `fr:date` |

Code fragment:

<xh:html xmlns:xh="http://www.w3.org/1999/xhtml" xmlns:fr="http://orbeon.org/oxf/xml/form-runner" xmlns:xf="http://www.w3.org/2002/xforms">
    <xh:head>
        <xh:title>Date tester</xh:title>
        <xf:model>
            <xf:instance id="test">
                <date/>
            </xf:instance>
            <xf:bind nodeset="instance('test')" type="fr:date"/>
        </xf:model>
    </xh:head>
    <xh:body>
        <xf:input ref="instance('test')">
            <xf:label>Test Date</xf:label>
        </xf:input>
    </xh:body>
</xh:html>

[avernet]

My comment wasn't clear enough: it is the xf:input that you need to replace with fr:date, in the view. You can keep the model as it was before.

[ahenket]

Right. Now the form loads and I can input a date, but there's no date picker of any kind. The right hand side where I can click does nothing. Browser just says it is missing /xforms-server/bootstrap-datepicker.css.map which it says for all sorts of map files. Annoying but supposedly not an issue.

Also: since what version does this feature exist?

[ahenket]

Noteworthy: regardless of whether or not I prepopulate a date like 2018-01-01 in the instance, the form comes up with an empty input field. Current code:

<xh:html xmlns:xh="http://www.w3.org/1999/xhtml" xmlns:fr="http://orbeon.org/oxf/xml/form-runner" xmlns:xf="http://www.w3.org/2002/xforms">
    <xh:head>
        <xh:title>Date tester</xh:title>
        <xf:model>
            <xf:instance id="test">
                <date>2018-01-01</date>
            </xf:instance>
            <!--<xf:bind nodeset="instance('test')" type="xs:date"/>-->
        </xf:model>
    </xh:head>
    <xh:body>
        <fr:date ref="instance('test')">
            <xf:label>Test Date</xf:label>
            <xf:alert>Not a Date</xf:alert>
        </fr:date>
    </xh:body>
</xh:html>

Finally: if I activate the binding to xs:date and enter something that is not a date, the red exclamation thing comes up as expected, but:

• It comes up on top of the clickable area (that may or may not have been meant for the widget)
• It does not have the text as mouse over as stated in the form
• It does not go away when you empty the field or supply a real date

[ahenket]

I propose to close the fr:date conversation here and move that to the new issue #4107