PDA

View Full Version : [FIXED] LoadMask with { useMsg: false } no longer suppresses message element



neonova
4 Oct 2011, 6:55 AM
REQUIRED INFORMATION

Ext version tested:

Ext 4.0.6

Browser versions tested against:

FF 7.0.1
Chrome 14

Description:

Creating a LoadMask with 'useMsg' set to false used to disable the loading message entirely (just graying out the component,) but as of 4.0.6 it still displays a 'message', it just forces that message to be a single space.

Steps to reproduce the problem:

someCmp.setLoading({ useMsg: false });

The result that was expected:

someCmp gets the "x-mask" gray background, but not the "x-mask-msg" spinner box -- as in 4.0.2a.

The result that occurs instead:

someCmp gets the "x-mask-msg" spinner box.

Test Case:

Ext.create('Ext.container.Viewport', {
layout: 'anchor',
defaults: {
bodyPadding: '10 20',
height: 64,
margin: 10,
padding: 0
},
items: [{
xtype: 'panel',
title: 'setLoading(true)',
html: 'This is the default loading mask',
listeners: {
afterrender: function() {
this.setLoading(true);
}
}
}, {
xtype: 'panel',
title: 'setLoading({ useMsg: false })',
html: 'This is a loading mask with message disabled',
listeners: {
afterrender: function() {
this.setLoading({ useMsg: false });
}
}
}, {
xtype: 'panel',
title: 'setLoading({ msg: \'\' })',
html: 'This is a loading mask with an empty string message',
listeners: {
afterrender: function() {
this.setLoading({ msg: '' });
}
}
}, {
xtype: 'panel',
title: 'setLoading({ msg: \'\', width: 32, height: 32 })',
html: 'This is a loading mask with an empty string message and fixed dimensions',
listeners: {
afterrender: function() {
this.setLoading({ msg: '', width: 32, height: 32 });
}
}
}]
});

HELPFUL INFORMATION

Screenshot or Video:

This is the behavior in 4.0.2a:
28505
This is the behavior in 4.0.6:
28506

(The absent load-mask-backgrounds are a separate bug, I think, which seems to have already been reported.)


Debugging already done:

none

Possible fix:

The following change seems to work, in src/LoadMask.js:220


onShow: function() {
var me = this;
me.callParent(arguments);
me.loading = true;
if (me.useMsg) {
me.msgEl.update(me.msg);
} else {
// me.msgEl.update(' ');
me.msgEl.parent().hide();
}
},


Additional CSS used:

only default ext-all.css

mdlincoln
4 Oct 2011, 4:46 PM
We have confirmed this issue and created a bug report for it.