IconButton is destroyed on creation

[gedri]

Hello,
I am aware that IconButton is deprecated and already worked to replace it with RibbonButton in our code, but I think the issue I describe below may be a symptom for a more general problem which might happen also in other situations so I decided to post this nevertheless.

The problem is that on the first time I create an IconButton (only on the first time!), it is getting destroyed during init.
Here is a simple way to reproduce the problem:
1. In the hello button showcase example (https://smartclient.com/smartclient/...id=helloButton) replace the code with this code:

var btn = isc.IconButton.create({
    title: "Hello",
    icon: "icons/16/world.png",
    iconOrientation: "right",
    click: "isc.say('Hello world!')"
});
btn.show()

2. Run the example - you will get this error in the browser :

*14:19:11.719:MUP0:ERROR:IconButton:isc_IconButton_0:ruleScope component could not be found for isc_IconButton_0. This component will not be part of ruleScope at this time.
Stack trace:

    Canvas.computeRuleScope() on [IconButton ID:isc_IconButton_0] @ ISC_Core.js:4249:229
    Canvas.draw(_1=>true) on [IconButton ID:isc_IconButton_0] @ ISC_Core.js:3169:6
    StatefulCanvas.draw(_1=>true, _2=>undef, _3=>undef) on [IconButton ID:isc_IconButton_0] @ ISC_Foundation.js:222:431
    Canvas.show() on [IconButton ID:isc_IconButton_0] @ ISC_Core.js:4018:320
    null.eval(<no args: exited>) @ [no file]:8:5
    [c]Class.evaluate(_1=>"var btn = isc.IconButton.create({\n ti..."[169], _2=>null, _3=>false, _4=>undef, _5=>undef, _6=>undef) on [Class Class] @ ISC_Core.js:276:9
    eval(_1=>"var btn = isc.IconButton.create({\n ti..."[169], _2=>undef) @ ISC_Core.js:477:447
    ExampleViewer.evalAndCaptureGlobals(_1=>"var btn = isc.IconButton.create({\n ti..."[169], _2=>Array[1]) on [ExampleViewer ID:featureExplorer_exampleViewer] @ ISC_ExampleViewer.js:99:226
    ExampleViewer.evalExample(_1=>"var btn = isc.IconButton.create({\n ti..."[169]) on [ExampleViewer ID:featureExplorer_exampleViewer] @ ISC_ExampleViewer.js:96:512
    ExampleViewer.showExample(_1=>undef) on [ExampleViewer ID:featureExplorer_exampleViewer] @ ISC_ExampleViewer.js:96:61
    ExampleSourcePane.tryEditedCode() on [ExampleSourcePane ID:featureExplorer_exampleViewer_exampleSourcePane] @ ISC_ExampleViewer.js:115:2029
    SourceEditor.tryClicked(_1=>undef) on [SourceEditor ID:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor] @ ISC_ExampleViewer.js:119:491
    _3.eval(event=>Obj, eventInfo=>undef) on [IButton ID:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor_sourceEditorToolbar_tryItButton] @ [no file]:3:35
    StatefulCanvas.handleActivate(_1=>Obj, _2=>undef) on [IButton ID:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor_sourceEditorToolbar_tryItButton] @ ISC_Foundation.js:242:108
    StatefulCanvas.handleClick(_1=>Obj, _2=>undef) on [IButton ID:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor_sourceEditorToolbar_tryItButton] @ ISC_Foundation.js:243:13
    [c]EventHandler.bubbleEvent(_1=>[IButton ID:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor_sourceEditorToolbar_tryItButton], _2=>"click", _3=>undef, _4=>undef, _5=>undef) on [Class EventHandler] @ ISC_Core.js:2509:89
    [c]EventHandler.handleClick(_1=>[IButton ID:featureExplorer_exampleViewer_exampleSourcePane_sourceEditor_sourceEditorToolbar_tryItButton], _2=>undef) on [Class EventHandler] @ ISC_Core.js:2317:50
    EventHandler._handleMouseUp(_1=>[object MouseEvent], _2=>undef) on [Class EventHandler] @ ISC_Core.js:2299:11
    [c]EventHandler.handleMouseUp(_1=>[object MouseEvent], _2=>undef) on [Class EventHandler] @ ISC_Core.js:2290:57
    [c]EventHandler.dispatch(_1=>[c]EventHandler.handleMouseUp(), _2=>[object MouseEvent]) on [Class EventHandler] @ ISC_Core.js:2608:122
    HTMLDocument.eval(event=>[object MouseEvent]) @ [no file]:3:123

If you run the the example again, it will not show the error any more (until you close the browser window and start over).

I have tracked down this error to this code in RibbonBar.js - the problem is that as part of logWarn, the control is already created with a global ID and when it finally calls the Super("init") it finds the global id already in use so it destroys the 'old' control, but the old control is actually the current one so we end up with init returning a destroyed control...
I suspect that might happen also in other situations so you might want to solve that problem although the case here is with a deprecated control.

init : function () {
        if (!window.sessionStorage.iscSkipIconButtonWarning) {
            window.sessionStorage.iscSkipIconButtonWarning = true;
            this.logWarn("Note that IconButton is deprecated and will be removed in the " +
                "next major release. Use RibbonButton instead,");
        }
        return this.Super("init", arguments);
    }

I am seeing this on v13.0p_2022-01-12

Regards
Gil

[Isomorphic]

Thanks for the detailed report - we've fixed this issue for IconButton and IconMenuButton in 13.0+, for tomorrow's builds, dated September 13 or later.

[claudiobosticco]

hello, I was about to report this issue, when I saw this thread.
The build:
SmartClient Version: v13.0p_2022-09-14/Enterprise Deployment (built 2022-09-14)
fixes the issue for me, thank you very much.