Reproduction page for code-mirror initialization problem

[ahenket]

I've been asked to produce a reproduction page for a code-mirror initialization problem. The problem I'm trying to demonstrate in a toned down version of the pages we have is that when you replace the contents of an instance that code-mirror reads from, it does not update it's contents in the page. Only a page refresh/load seems to trigger code-mirror. However: in creating the page I keep running into another problem I cannot get past. From the orbeon.log:

Required item type of first argument of exf:readonly() is node(); supplied value has item type xs:string

Since I'm not doing anything with readonly, I'm assuming a bug somewhere else. I have no reason to believe the page below has any trouble like that.

Anyway to cut this short: I believe the page below will demonstrate my code-mirror problem but I cannot verify that because of ... well another code-mirror problem. Deactivate the fr:code-mirror line and activate the xf:output line below it to see how it should have worked.

<xh:html xmlns:xf="http://www.w3.org/2002/xforms" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:fr="http://orbeon.org/oxf/xml/form-runner" xmlns:xxf="http://orbeon.org/oxf/xml/xforms" xmlns:xh="http://www.w3.org/1999/xhtml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.w3.org/1999/xhtml https://raw.github.com/orbeon/orbeon-forms/master/src/main/resources/org/orbeon/oxf/xml/schemas/xhtml1-transitional-orbeon.xsd">
    <xh:head>
        <xh:title>Orbeon CodeMirror Test</xh:title>
        <xh:style type="text/css">
            .CodeMirror { width: 100% !important; height: 100% !important; }
        </xh:style>
        <xf:model id="code-mirror">
            <xf:instance id="xml" xxf:exclude-result-prefixes="#all">
                <xml/>
            </xf:instance>

            <xf:instance id="templates" xxf:exclude-result-prefixes="#all">
                <templates>
                    <t id="2.16.840.1.113883.3.1937.99.62.3.10.4" effectiveDate="2009-10-01T00:00:00" name="Template 1"/>
                    <t id="2.16.840.1.113883.3.1937.99.62.3.10.1" effectiveDate="2011-01-28T00:00:00" name="Template 2"/>
                </templates>
            </xf:instance>

            <xf:submission id="get-template-1" serialization="none" method="get" resource="http://decor.nictiz.nl/decor/services/RetrieveTemplate?prefix=demo1-&amp;language=nl-NL&amp;id={encode-for-uri(instance('templates')/t[1]/@id)}&amp;effectiveDate={encode-for-uri(instance('templates')/t[1]/@effectiveDate)}&amp;format=xml" replace="instance" instance="xml">
                <xf:message ev:event="xforms-submit-error" level="modal">
                    A submission error occurred: <xf:output value="event('error-type')"/>; Status: <xf:output value="event('response-status-code')"/>; URI: <xf:output value="event('resource-uri')"/>; Headers: <xf:output value="event('response-headers')"/>; Body: <xf:output value="event('response-body')"/>
                </xf:message>
            </xf:submission>
            <xf:submission id="get-template-2" serialization="none" method="get" resource="http://decor.nictiz.nl/decor/services/RetrieveTemplate?prefix=demo1-&amp;language=nl-NL&amp;id={encode-for-uri(instance('templates')/t[2]/@id)}&amp;effectiveDate={encode-for-uri(instance('templates')/t[2]/@effectiveDate)}&amp;format=xml" replace="instance" instance="xml">
                <xf:message ev:event="xforms-submit-error" level="modal">
                    A submission error occurred: <xf:output value="event('error-type')"/>; Status: <xf:output value="event('response-status-code')"/>; URI: <xf:output value="event('resource-uri')"/>; Headers: <xf:output value="event('response-headers')"/>; Body: <xf:output value="event('response-body')"/>
                </xf:message>
            </xf:submission>

         <!-- resources for internationalization -->
            <xf:instance id="resources-instance">
                <artXformResources packageRoot="art">
                    <resources xml:lang="en-US" displayName="English (en-US)"/>
                </artXformResources>
            </xf:instance>
         <!-- language -->
            <xf:instance id="language">
                <language>en-US</language>
            </xf:instance>

         <!-- Startup actions -->
            <xf:action ev:event="xforms-model-construct-done">
                <xf:send submission="get-template-1"/>
            </xf:action>
            <xxf:variable name="resources" select="instance('resources-instance')//resources[1]"/>
        </xf:model>
    </xh:head>
    <xh:body>
        <xh:table width="100%" class="detail zebra-table">
            <xh:tr>
                <xh:td>
                    <xh:div style="background-color: GhostWhite;">
                        <xh:div class="detail">
                            <xf:trigger>
                                <xf:label>Template 1</xf:label>
                                <xf:send ev:event="DOMActivate" submission="get-template-1"/>
                            </xf:trigger>
                            <xf:trigger>
                                <xf:label>Template 2</xf:label>
                                <xf:send ev:event="DOMActivate" submission="get-template-2"/>
                            </xf:trigger>
                        </xh:div>
                        <xh:div style="font-weight: bold;">
                            <xf:output ref="instance('templates')/*[@id=instance('xml')//template[1]/@id]/@name"/>
                        </xh:div>
                        <xf:repeat nodeset="instance('xml')//example">
                            <xh:div style="border: 1px solid black; margin-bottom: 5px;" class="not-selectable">
                                <fr:code-mirror ref="xxf:serialize(.,'html')"/>
                                <!--<xf:output mediatype="text/html" value="xxf:serialize(xxforms:call-xpl('oxf:/ops/utils/formatting/format-multiple.xpl', 'data', ., 'data'), 'html')"/>-->
                            </xh:div>
                        </xf:repeat>
                    </xh:div>
                </xh:td>
            </xh:tr>
        </xh:table>
    </xh:body>
</xh:html>

[avernet]

Currently, the component doesn't support ref pointing to a string. As a workaround, you can use xxf:element('e', xxf:serialize(.,'xml')). Also, I'd use the xml rather than html serialization, otherwise you might missing end tags for elements where end tags are not allowed in HTML. You'll let us know if this works for you.

[avernet]

37dc132 solves the issue, closing.

[ahenket]

Yes! This works: <fr:code-mirror ref="xxf:element('e', replace(xxforms:serialize(.,'html'),'(^<example[^>]>\s)|(\s*</example>$)',''))"/>

My code is wrapped inside an <example/> element that I cannot unwrap before serializing because it might be a series of nodes, so I remove those start/end tags after serialization.

[avernet]

Excellent, and thank you for confirming!

On Thu, Jul 2, 2015 at 12:59 PM, Alexander Henket notifications@github.com wrote:

Yes! This works:

— Reply to this email directly or view it on GitHub https://github.com/orbeon/orbeon-forms/issues/2280#issuecomment-118150702 .