JQuery UI widget initialized in JS doesn't work in combination with FPC

[janbuelens]

Hi,

I'm trying to create a JQuery UI widget for the login form.
When page cache (FPC) is enabled, this.element in the _create function of my element doesn't work anymore.

This is because the form gets reloaded in app/code/Magento/PageCache/view/frontent/web/js/page-cache.js.
The widget 'mage.pageCache' replaces the login form with an ajax loaded form.

This issue only occurs when the widget gets initialized in JS. When it's initialized with the attribute "data-mage-init", the widget gets initialized again after the new block is loaden in page-cache.js.

I don't know if this is a bug, or I am missing something.

Here is the code I'm using for the widget.

file:app/code/Test/Module/view/frontend/web/js/test.js

define([
    'jquery',
    'jquery/ui',
], function($){
    "use strict";
    $.widget('test.myWidget', {
        _create: function() {
            console.log(this.element);
            this.element.text('My Form');
        }
    });

return $.test.myWidget;
});

file:app/code/Test/Module/view/frontend/requirejs-config.js

var config = {
    map: {
        '*': {
            myWidget: 'Test_Module/js/test',
        }
    }
};

file:app/code/Test/Module/view/frontend/template/js.phtml

<script type="text/x-magento-init">
    {
        "form.form-login": {
            "myWidget": {}
            }
    }
</script>

[piotrekkaminski]

internal issue MAGETWO-43859

[vzabaznov]

Hi @janbuelens bug was fixed and delivered, please check it in current mainline