Xterm.js: TypeError calling resize() via fit add-on

[jpmasters]

I'm not sure how I'm getting into this state as the application is pretty complex but I have a situation where, on resizing the terminal element, in the resize() code that pads out each line in the terminal I'm ending up with lines that are undefined. This causes the code to fail when it queries for the line length:

TypeError: Cannot read property 'length' of undefined 
message:"Cannot read property 'length' of undefined"
stack:"TypeError: Cannot read property 'length' of undefined\n    at Terminal.19.Terminal.resize (http://localhost:3000/utc/bower_components/xterm.js/dist/xterm.js:4637:37)\n    at Object.exports.fit (http://localhost:3000/utc/bower_components/xterm.js/dist/addons/fit/fit.js:73:12)\n    at Terminal.Xterm.fit (http://localhost:3000/utc/bower_components/xterm.js/dist/addons/fit/fit.js:82:20)\n    at http://localhost:3000/utc/scripts/utccomponents/utcterminal.js:31:19\n    at m.$emit (http://localhost:3000/utc/bower_components/angular/angular.min.js:151:429)\n    at broadcastLeftRightResize (http://localhost:3000/utc/scripts/framework/stratosresizer/resizer.js:96:28)\n    at HTMLDocument.handleMouseUp (http://localhost:3000/utc/scripts/framework/stratosresizer/resizer.js:133:25)"

I'm using an event from the Angular resizer to call fit() but this is not called continuously while the dragging is happening, only once when the resizing is completed.

I can 'fix' it by updating the resize method in xterm.js like this:

        ch = [this.defAttr, ' ', 1];
        i = this.lines.length;
        while (i--) {
            ////////////////////////////////////////
            if (this.lines.get(i) === undefined) {
                this.lines.set(i, this.blankLine());
            }
            ////////////////////////////////////////
            while (this.lines.get(i).length < x) {
                this.lines.get(i).push(ch);
            }
        }

But my concern is that, if no-one else is having this problem, it may be an indication of a bigger issue somewhere else.

• Have you seen anything like this before and if so do you have any idea of what might cause it to happen?
• Is this a reasonable way to fix it without causing more problems downstream?

Details

• Browser and browser version: Chrome 59.0.3071.115 (Official Build) (64-bit)
• OS version: Windows 7
• xterm.js version: 2.8.1

[parisk]

@jpmasters this does not seem to be xterm.js 2.8.1; this.lines has been replaced by this.buffer.lines.

Can you please give it another try with the latest version of xterm.js?

I can definitely add a null check here though.

[Tyriar]

@parisk buffer.lines is coming in 2.9.0

[parisk]

I should stop commenting after midnight 😢.

[jpmasters]

xterm.js is clearly a labour of love @parisk :)

I've created a PR here if you're ok with it.

Cheers
Jon

[Tyriar]

I commented on the PR, this likely does indeed indicate a bigger issue somewhere as @jpmasters indicated.

The resize rows section below is meant to handle this row resizing, if this is actually happening we should figure out the root cause. this.buffer.lines.get(i) should always return an array when i < this.buffer.lines.length which is guaranteed by line 1942.

Created https://github.com/sourcelair/xterm.js/issues/824