1. #1
    Ext JS Premium Member rex.staples's Avatar
    Join Date
    Jul 2007
    Location
    Austin, TX
    Posts
    35
    Vote Rating
    1
    rex.staples is on a distinguished road

      0  

    Default "Layout run failed" when using ext-dev.js instead of ext-debug.js

    "Layout run failed" when using ext-dev.js instead of ext-debug.js


    Using ExtJS 4.1.1a when I load this simplified testbed:

    Code:
    <!DOCTYPE html>
    <html><head><title>Test</title>
      <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
      <!-- ext-dev.js   :: Layout run failed
           ext-debug.js :: No layout errors. -->
      <script type="text/javascript" src="ext/ext-dev.js"></script>
      <script type="text/javascript" src="ext/src/diag/layout/Context.js"></script>
      <script type="text/javascript" src="ext/src/diag/layout/ContextItem.js"></script>
      <script type="text/javascript">
    
    Ext.define('My.Container', {
        extend: 'Ext.container.Container',
        alias: 'widget.my-container',
    
        childEls: ['body'],
        renderTpl: '<div id="{id}-body"></div>',
    
        items: { xtype: 'button', text: 'Ok' },
    
        getTargetEl: function() {
            return this.body || this.el;
        }
    });
    
    Ext.define('Test.view.Viewport', {
        extend: 'Ext.container.Viewport',
        items: { xtype: 'my-container' }
    });
    
    Ext.application({
        autoCreateViewport: true,
        name: 'Test'
    });
    
    </script></head><body></body></html>
    I see this in the console log:

    Code:
    ==================== LAYOUT ====================                                                                                              ext-dev.js (line 11363)
    ----------------- SUCCESS -----------------                                                                                                   ext-dev.js (line 11363)
    Cycles: 0, Flushes: 0, Calculates: 0 in 0 msec                                                                                                ext-dev.js (line 11363)
    Calculates by type:                                                                                                                           ext-dev.js (line 11363)
    ==================== LAYOUT ====================                                                                                              ext-dev.js (line 11363)
    Layout run failed                                                                                                                             ext-dev.js (line 11363)
      [E] ----------------- FAILURE -----------------
        log (message="[E] ----------------- FAILURE -----------------")                                                                           ext-dev.js (line 11363)
        Ext.layout.Context#run()                                                                                                                  Context.js (line 376)
        Ext.AbstractComponent.flushLayouts()                                                                                                      Abstra...3937400 (line 84)
        Ext.AbstractComponent.resumeLayouts(flush=true)                                                                                           Abstra...3937400 (line 100)
        resumeLayouts(flush=true)                                                                                                                 Abstra...3937400 (line 3437)
        Ext.util.Renderable#render(container=Object { dom=body#ext-gen1001.x-body, id="ext-gen1001", $cache={...}, more...}, position=undefined)  Render...3937491 (line 809)
        Ext.AbstractComponent#constructor(config=Object {})                                                                                       Abstra...3937400 (line 1126)
        Ext.Base#callParent(args=[Object {}])                                                                                                     ext-dev.js (line 6260)
        Ext.Component#constructor(config=Object {})                                                                                               Compon...3937281 (line 336)
        Test.view.Viewport()                                                                                                                      ext-dev.js (line 7448)
        Ext.ClassManager.instantiate0(c=constructor(), a=[])                                                                                      XTempl...l/seq/8 (line 7788)
        instantiate()                                                                                                                             ext-dev.js (line 8188)
        alias()                                                                                                                                   ext-dev.js (line 3004)
        create()                                                                                                                                  ext-dev.js (line 5452)
        Ext.app.Application#onBeforeLaunch()                                                                                                      Applic...3937173 (line 205)
        (?)()                                                                                                                                     Applic...3937173 (line 174)
        createSingle()                                                                                                                            ext-dev.js (line 14487)
        Ext.Base#fire()                                                                                                                           ext-dev.js (line 14647)
        fire()                                                                                                                                    ext-dev.js (line 14890)
        fireReadyEvent()                                                                                                                          ext-dev.js (line 14988)
        onDocumentReady(fn=function(), scope=undefined, options=Object { single=true})                                                            ext-dev.js (line 15012)
        fn()                                                                                                                                      ext-dev.js (line 10045)
        triggerReady()                                                                                                                            ext-dev.js (line 10031)
        refreshQueue()                                                                                                                            ext-dev.js (line 9529)
        refreshQueue()                                                                                                                            ext-dev.js (line 9530)
        refreshQueue()                                                                                                                            ext-dev.js (line 9530)
        refreshQueue()                                                                                                                            ext-dev.js (line 9530)
        refreshQueue()                                                                                                                            ext-dev.js (line 9530)
        onFileLoaded(className="Ext.draw.SpriteDD", filePath="http://oe.localhost/ext/src/draw/SpriteDD.js")                                      ext-dev.js (line 9936)
        (?)()                                                                                                                                     ext-dev.js (line 2990)
        onLoadFn()                                                                                                                                ext-dev.js (line 9556)
      con[level](message);                                                                                                                        ext-dev.js (line 11363)
    ++ext-comp-1001<autocontainer> - boxChildren: undefined/1 - size: configured/configured                                                       ext-dev.js (line 11363)
       --my-container-1002<autocontainer> - boxParent: ext-gen1001 - size: natural/shrinkWrap                                                     ext-dev.js (line 11363)
             triggeredBy: count=3                                                                                                                 ext-dev.js (line 11363)
                button-1003.height (24) dirty: false, setBy: button-1003<button>                                                                  ext-dev.js (line 11363)
                my-container-1002-body.width (24) dirty: false, setBy: button-1003<button>                                                        ext-dev.js (line 11363)
                my-container-1002.containerChildrenDone:dom () dirty: false, setBy: ?                                                             ext-dev.js (line 11363)
          ++button-1003<button> - boxParent: ext-gen1001 - size: shrinkWrap/shrinkWrap                                                            ext-dev.js (line 11363)
       ++my-container-1002<autocomponent> - boxParent: ext-gen1001 - size: natural/shrinkWrap                                                     ext-dev.js (line 11363)
    Cycles: 8, Flushes: 3, Calculates: 8 in 13 msec                                                                                               ext-dev.js (line 11363)
    Calculates by type:                                                                                                                           ext-dev.js (line 11363)
    autocontainer: 2 in 4 tries (2x) at 3 msec (avg 0.75 msec)                                                                                    ext-dev.js (line 11363)
    button: 1 in 1 tries (1x) at 0 msec (avg 0 msec)                                                                                              ext-dev.js (line 11363)
    autocomponent: 2 in 3 tries (1.5x) at 0 msec (avg 0 msec)                                                                                     ext-dev.js (line 11363)
    I would love to get any direction on this from the Sencha experts.

    Thanks!

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,549
    Vote Rating
    873
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Looks to be the use of childEls with renderTpl. Remove one of them and all is good.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Ext JS Premium Member rex.staples's Avatar
    Join Date
    Jul 2007
    Location
    Austin, TX
    Posts
    35
    Vote Rating
    1
    rex.staples is on a distinguished road

      0  

    Default


    Mitchell,

    Thanks for the reply. Unless there is a new ExtJS pattern I'm unfamiliar with I had come to understand that:

    childEls + renderTpl (and the childEls {id}-child id syntax) + getTargetEl

    was the secret config sauce to any class that wants to extend Ext.container.Container. While I've reduced my template in the example here to be trivial the render template is actually a critical part of the custom container.

    I know that Ed wrote up a description of the different ext files about a year back, but it is no longer up to date to include all the files in the distribution.

    Rex
    Last edited by rex.staples; 25 Nov 2012 at 6:41 PM. Reason: ninjas

Thread Participants: 1