Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

fix(ngOptions): don't skip optgroup elements with value === '' #13489

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/ng/directive/ngOptions.js
Original file line number Diff line number Diff line change
Expand Up @@ -643,7 +643,7 @@ var ngOptionsDirective = ['$compile', '$parse', function($compile, $parse) {
(current === emptyOption_ ||
current === unknownOption_ ||
current.nodeType === NODE_TYPE_COMMENT ||
current.value === '')) {
(nodeName_(current) === 'option' && current.value === ''))) {
current = current.nextSibling;
}
}
Expand Down
133 changes: 124 additions & 9 deletions test/ng/directive/ngOptionsSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -1555,23 +1555,65 @@ describe('ngOptions', function() {

expect(element).toEqualSelectValue(scope.selected);

var zero = jqLite(element.find('optgroup')[0]);
var b = jqLite(zero.find('option')[0]);
var e = jqLite(zero.find('option')[1]);
var optgroups = element.find('optgroup');
expect(optgroups.length).toBe(3);

var zero = optgroups.eq(0);
var b = zero.find('option').eq(0);
var e = zero.find('option').eq(1);
expect(zero.attr('label')).toEqual('0');
expect(b.text()).toEqual('B');
expect(e.text()).toEqual('E');

var first = jqLite(element.find('optgroup')[1]);
var c = jqLite(first.find('option')[0]);
var f = jqLite(first.find('option')[1]);
var first = optgroups.eq(1);
var c = first.find('option').eq(0);
var f = first.find('option').eq(1);
expect(first.attr('label')).toEqual('first');
expect(c.text()).toEqual('C');
expect(f.text()).toEqual('F');

var second = optgroups.eq(2);
var d = second.find('option').eq(0);
var g = second.find('option').eq(1);
expect(second.attr('label')).toEqual('second');
expect(d.text()).toEqual('D');
expect(g.text()).toEqual('G');

scope.$apply(function() {
scope.selected = scope.values[0];
});

expect(element).toEqualSelectValue(scope.selected);
});


it('should group when the options are available on compile time', function() {
scope.values = [{name: 'C', group: 'first'},
{name: 'D', group: 'second'},
{name: 'F', group: 'first'},
{name: 'G', group: 'second'}];
scope.selected = scope.values[3];

createSelect({
'ng-model': 'selected',
'ng-options': 'item as item.name group by item.group for item in values'
});

expect(element).toEqualSelectValue(scope.selected);

var optgroups = element.find('optgroup');
expect(optgroups.length).toBe(2);

var first = optgroups.eq(0);
var c = first.find('option').eq(0);
var f = first.find('option').eq(1);
expect(first.attr('label')).toEqual('first');
expect(c.text()).toEqual('C');
expect(f.text()).toEqual('F');

var second = jqLite(element.find('optgroup')[2]);
var d = jqLite(second.find('option')[0]);
var g = jqLite(second.find('option')[1]);
var second = optgroups.eq(1);
var d = second.find('option').eq(0);
var g = second.find('option').eq(1);
expect(second.attr('label')).toEqual('second');
expect(d.text()).toEqual('D');
expect(g.text()).toEqual('G');
Expand All @@ -1584,6 +1626,79 @@ describe('ngOptions', function() {
});


it('should group when the options are updated', function() {
var optgroups, one, two, three, alpha, beta, gamma, delta, epsilon;

createSelect({
'ng-model': 'selected',
'ng-options': 'i.name group by i.cls for i in list'
});

scope.list = [
{cls: 'one', name: 'Alpha'},
{cls: 'one', name: 'Beta'},
{cls: 'two', name: 'Gamma'}
];
scope.$digest();

optgroups = element.find('optgroup');
expect(optgroups.length).toBe(2);

one = optgroups.eq(0);
expect(one.children('option').length).toBe(2);

alpha = one.find('option').eq(0);
beta = one.find('option').eq(1);
expect(one.attr('label')).toEqual('one');
expect(alpha.text()).toEqual('Alpha');
expect(beta.text()).toEqual('Beta');

two = optgroups.eq(1);
expect(two.children('option').length).toBe(1);

gamma = two.find('option').eq(0);
expect(two.attr('label')).toEqual('two');
expect(gamma.text()).toEqual('Gamma');

// Remove item from first group, add item to second group, add new group
scope.list.shift();
scope.list.push(
{cls: 'two', name: 'Delta'},
{cls: 'three', name: 'Epsilon'}
);
scope.$digest();

optgroups = element.find('optgroup');
expect(optgroups.length).toBe(3);

// Group with removed item
one = optgroups.eq(0);
expect(one.children('option').length).toBe(1);

beta = one.find('option').eq(0);
expect(one.attr('label')).toEqual('one');
expect(beta.text()).toEqual('Beta');

// Group with new item
two = optgroups.eq(1);
expect(two.children('option').length).toBe(2);

gamma = two.find('option').eq(0);
expect(two.attr('label')).toEqual('two');
expect(gamma.text()).toEqual('Gamma');
delta = two.find('option').eq(1);
expect(two.attr('label')).toEqual('two');
expect(delta.text()).toEqual('Delta');

// New group
three = optgroups.eq(2);
expect(three.children('option').length).toBe(1);

epsilon = three.find('option').eq(0);
expect(three.attr('label')).toEqual('three');
expect(epsilon.text()).toEqual('Epsilon');
});
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice test :)


it('should place non-grouped items in the list where they appear', function() {
createSelect({
'ng-model': 'selected',
Expand Down