Scoller.tableView not always displayed on first viewing

[jlhughes]

On 'some' FilterController->Scroller->TableSelection setups the Scroller.tableView does not display until a window resize event occurs. When the resize occurs, the table is drawn but the error listed below is also generated for each table row.

Just noticing that I have notes in the filterController setup regarding two styles of inner tableView setup with one not honouring popup height/width. Perhaps this is related or helps with the investigation.

If you require/want a test setup, I can package the app up for you. Thanks Joel

Setup:

            name: 'filterController',
            class: 'foam.u2.ViewSpec',
            factory: function() {
                var fc = this.FilterController.create({
                    textSearch: false,
                    allowAddingFilters: false,
                    data$: this.filteredDAO$,
                    tableView: this.Scroller.create({
                        of: this.Fieldworker,
                        data$: this.filteredDAO$,
                        //
                        // NOTE: this creation style ignores popup height/width
                        // while the next honours the popup height/width
                        // tableView: this.TableSelection.create({
                        //     of: this.of,
                        //     data: this.dao,
                        //     columns: this.tableColumns
                        // }, this)
                        //
                        tableView: {
                            class: 'foam.u2.TableSelection',
                            view: {
                                class: 'foam.u2.TableView',
                                columns: this.tableColumns
                            },
                            selectionQuery$: this.fieldworkerSelectionQuery$
                        }
                    }, this)
                }, this);
                return fc;
            }

Error for each Table row on window resize:

Uncaught TypeError: Cannot read property 'getBoundingClientRect' of null at Object.onResize (foam-bin.js:28066) at l (foam-bin.js:5358) at frameFired (foam-bin.js:6933)

translates to:

  listeners: [
    {
      name: 'onResize',
      isFramed: true,
      code: function() {
        // Determine the height of the table's space.
        var height = this.el().getBoundingClientRect().height;    <-----
        this.scrollHeight_ = height;
        this.scrollExtent_ = Math.floor(height / this.rowHeight);
      }
    },

[kgrgreer]

If you require/want a test setup, I can package the app up for you.

That would be helpful.

It appears that onResize() is being called either before it's been added to the DOM or after it's been removed. More defensive code would just return from onResize() if this.el() is null, but it would be good to figure out why this is happening.

On 13 March 2017 at 12:21, Joel Hughes notifications@github.com wrote:

On 'some' FilterController->Scroller->TableSelection setups the Scroller.tableView does not display until a window resize event occurs. When the resize occurs, the table is drawn but the error listed below is also generated for each table row.

Just noticing that I have notes in the filterController setup regarding two styles of inner tableView setup with one not honouring popup height/width. Perhaps this is related or helps with the investigation.

If you require/want a test setup, I can package the app up for you. Thanks Joel

Setup:

        name: 'filterController',
        class: 'foam.u2.ViewSpec',
        factory: function() {
            var fc = this.FilterController.create({
                textSearch: false,
                allowAddingFilters: false,
                data$: this.filteredDAO$,
                tableView: this.Scroller.create({
                    of: this.Fieldworker,
                    data$: this.filteredDAO$,
                    //
                    // NOTE: this creation style ignores popup height/width
                    // while the next honours the popup height/width
                    // tableView: this.TableSelection.create({
                    //     of: this.of,
                    //     data: this.dao,
                    //     columns: this.tableColumns
                    // }, this)
                    //
                    tableView: {
                        class: 'foam.u2.TableSelection',
                        view: {
                            class: 'foam.u2.TableView',
                            columns: this.tableColumns
                        },
                        selectionQuery$: this.fieldworkerSelectionQuery$
                    }
                }, this)
            }, this);
            return fc;
        }

Error for each Table row on window resize:

Uncaught TypeError: Cannot read property 'getBoundingClientRect' of null at Object.onResize (foam-bin.js:28066) at l (foam-bin.js:5358) at frameFired (foam-bin.js:6933)

translates to:

listeners: [ { name: 'onResize', isFramed: true, code: function() { // Determine the height of the table's space. var height = this.el().getBoundingClientRect().height; <----- this.scrollHeight = height; this.scrollExtent = Math.floor(height / this.rowHeight); } },

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/foam-framework/foam2/issues/257, or mute the thread https://github.com/notifications/unsubscribe-auth/AHHXs7eMgcnD19PkXEegKG1by5yPaFLwks5rlWz8gaJpZM4Mbe7u .