Skip to content

Commit

Permalink
test: account for default standalone components
Browse files Browse the repository at this point in the history
  • Loading branch information
@homj
homj committed Dec 4, 2024
1 parent a7a9e58 commit 06c9ddb
Show file tree
Hide file tree
Showing 14 changed files with 66 additions and 120 deletions.
82 changes: 29 additions & 53 deletions libs/composables/attribute/src/attribute.composable.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,7 @@ describe('attribute.composable.ts', () => {
provide: ElementRef,
useValue: {
nativeElement: {
getAttributeNS: jest
.fn()
.mockImplementation(() => initialAssignedValue)
getAttributeNS: jest.fn().mockImplementation(() => initialAssignedValue)
}
}
},
Expand All @@ -37,10 +35,7 @@ describe('attribute.composable.ts', () => {
it('should call bindAttribute with the correct arguments', () => {
TestBed.runInInjectionContext(() => {
// Arrange
const bindAttributeSpy = jest.spyOn(
attributeModule,
'bindAttribute'
);
const bindAttributeSpy = jest.spyOn(attributeModule, 'bindAttribute');

// Act
const value = useAttribute('name', {
Expand All @@ -50,15 +45,11 @@ describe('attribute.composable.ts', () => {
});

// Assert
expect(bindAttributeSpy).toHaveBeenCalledWith(
'name',
value,
{
defaultValue: 'bar',
namespace: 'my',
target: inject(ElementRef).nativeElement
}
);
expect(bindAttributeSpy).toHaveBeenCalledWith('name', value, {
defaultValue: 'bar',
namespace: 'my',
target: inject(ElementRef).nativeElement
});

bindAttributeSpy.mockRestore();
});
Expand Down Expand Up @@ -89,19 +80,17 @@ describe('attribute.composable.ts', () => {
});

it('the defaultValue, if initialValue is `null`', () => {
TestBed.runInInjectionContext(() => {
// Act
const result = useAttribute('name', {
initialValue: null,
defaultValue: 'bar'
});

// Assert
expect(result()).toEqual('bar');
TestBed.runInInjectionContext(() => {
// Act
const result = useAttribute('name', {
initialValue: null,
defaultValue: 'bar'
});
}
);

// Assert
expect(result()).toEqual('bar');
});
});

it('the initial assigned value in the DOM if no initialValue has been defined', () => {
TestBed.runInInjectionContext(() => {
Expand Down Expand Up @@ -147,6 +136,7 @@ describe('attribute.composable.ts', () => {
}

@Component({
imports: [TestButtonComponent],
template: `
<button #buttonA bxTestButton role="menuitem"></button>
<button #buttonB bxTestButton type="submit"></button>
Expand All @@ -165,7 +155,7 @@ describe('attribute.composable.ts', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ParentComponent, TestButtonComponent ]
imports: [ParentComponent, TestButtonComponent]
}).compileComponents();

fixture = TestBed.createComponent(ParentComponent);
Expand All @@ -181,9 +171,7 @@ describe('attribute.composable.ts', () => {

it('should fall back to default value, when the value is set to `undefined`', () => {
// Arrange
const buttonADebug = fixture.debugElement.queryAll(
By.directive(TestButtonComponent)
)[0];
const buttonADebug = fixture.debugElement.queryAll(By.directive(TestButtonComponent))[0];

// Act
component.buttonA.type.set(undefined);
Expand All @@ -195,9 +183,7 @@ describe('attribute.composable.ts', () => {

it('should not fall back to default value, when the value is set to `null`', () => {
// Arrange
const buttonADebug = fixture.debugElement.queryAll(
By.directive(TestButtonComponent)
)[0];
const buttonADebug = fixture.debugElement.queryAll(By.directive(TestButtonComponent))[0];

// Act
component.buttonA.type.set(null);
Expand All @@ -217,18 +203,14 @@ describe('attribute.composable.ts', () => {
describe('when a namespace has been defined', () => {
it('should set the attribute with the namespace', () => {
// Arrange
const buttonADebug = fixture.debugElement.queryAll(
By.directive(TestButtonComponent)
)[0];
const buttonADebug = fixture.debugElement.queryAll(By.directive(TestButtonComponent))[0];

// Act
component.buttonA.label.set('Button A');
fixture.detectChanges();

// Assert
expect(buttonADebug.attributes['bx:label']).toEqual(
'Button A'
);
expect(buttonADebug.attributes['bx:label']).toEqual('Button A');
});
});
});
Expand Down Expand Up @@ -287,7 +269,7 @@ describe('attribute.composable.ts', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TestComponent ]
imports: [TestComponent]
}).compileComponents();

fixture = TestBed.createComponent(TestComponent);
Expand All @@ -305,32 +287,26 @@ describe('attribute.composable.ts', () => {
});

it('should set a namespaced attribute correctly', () => {
expect(fixture.debugElement.attributes['my:title']).toEqual(
'Hello'
);
expect(fixture.debugElement.attributes['my:title']).toEqual('Hello');
});

it.each([ null, undefined ])(
'should remove the attribute, when setting the signal\'s value to %s',
it.each([null, undefined])(
"should remove the attribute, when setting the signal's value to %s",
(value) => {
component.name.set(value);

fixture.detectChanges();

expect(
fixture.debugElement.attributes['name']
).toBeUndefined();
expect(fixture.debugElement.attributes['name']).toBeUndefined();
}
);

it('should change the attribute, when the signal\'s value changes', () => {
it("should change the attribute, when the signal's value changes", () => {
component.role.set('button');

fixture.detectChanges();

expect(fixture.debugElement.attributes['role']).toEqual(
'button'
);
expect(fixture.debugElement.attributes['role']).toEqual('button');
});

it('should bind the attribute on the custom target', () => {
Expand Down
6 changes: 3 additions & 3 deletions libs/composables/attribute/src/boolean-attribute.composable.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ describe('useBooleanAttribute', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TestComponent ]
imports: [TestComponent]
}).compileComponents();

fixture = TestBed.createComponent(TestComponent);
Expand Down Expand Up @@ -51,15 +51,15 @@ describe('useBooleanAttribute', () => {
expect(fixture.debugElement.attributes['my:editable']).toEqual('');
});

it('should remove the attribute, when setting the signal\'s value to `false`', () => {
it("should remove the attribute, when setting the signal's value to `false`", () => {
component.loading.set(false);

fixture.detectChanges();

expect(fixture.debugElement.attributes['loading']).toBeUndefined();
});

it('should set the attribute, when setting the signal\'s value to `true`', () => {
it("should set the attribute, when setting the signal's value to `true`", () => {
component.disabled.set(true);

fixture.detectChanges();
Expand Down
6 changes: 3 additions & 3 deletions libs/composables/class/src/class.composable.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ describe('useClass', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TestComponent ]
imports: [TestComponent]
}).compileComponents();

fixture = TestBed.createComponent(TestComponent);
Expand All @@ -34,15 +34,15 @@ describe('useClass', () => {
expect(fixture.debugElement.classes['highlighted']).toBeTruthy();
});

it('should add the class, when setting the signal\'s value to `true`', () => {
it("should add the class, when setting the signal's value to `true`", () => {
component.test.set(false);

fixture.detectChanges();

expect(fixture.debugElement.classes['test']).toBeFalsy();
});

it('should remove the class, when setting the signal\'s value to `false`', () => {
it("should remove the class, when setting the signal's value to `false`", () => {
component.highlighted.set(false);

fixture.detectChanges();
Expand Down
8 changes: 4 additions & 4 deletions libs/composables/class/src/classes.composable.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { useClasses } from './classes.composable';
template: ''
})
class TestComponent {
readonly classes = useClasses([ 'test', 'test2' ]);
readonly classes = useClasses(['test', 'test2']);
}

describe('useClasses', () => {
Expand All @@ -16,7 +16,7 @@ describe('useClasses', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TestComponent ]
imports: [TestComponent]
}).compileComponents();

fixture = TestBed.createComponent(TestComponent);
Expand All @@ -36,8 +36,8 @@ describe('useClasses', () => {
});
});

it('should remove the previous classes and add new classes, when changing the signal\'s value', () => {
component.classes.set([ 'foo', 'bar' ]);
it("should remove the previous classes and add new classes, when changing the signal's value", () => {
component.classes.set(['foo', 'bar']);

fixture.detectChanges();

Expand Down
23 changes: 10 additions & 13 deletions libs/composables/class/src/modifier-group.composable.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { provideBaseClass } from './provide-base-class';

@Component({
template: '',
providers: [ provideBaseClass('c-test') ]
providers: [provideBaseClass('c-test')]
})
class TestComponent {
readonly color = useModifierGroup<'primary' | 'secondary' | null | undefined>('primary');
Expand All @@ -20,7 +20,7 @@ describe('useModifierGroup', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TestComponent ]
imports: [TestComponent]
}).compileComponents();

fixture = TestBed.createComponent(TestComponent);
Expand All @@ -47,7 +47,7 @@ describe('useModifierGroup', () => {
});
});

it('should remove the previous modifier class and add a new modifier class, when changing the signal\'s value', () => {
it("should remove the previous modifier class and add a new modifier class, when changing the signal's value", () => {
component.color.set('secondary');

fixture.detectChanges();
Expand All @@ -58,16 +58,13 @@ describe('useModifierGroup', () => {
});
});

it.each([ null, undefined ])(
'should remove the previous modifier class the signal\'s value is set to %s',
(value) => {
component.color.set(value);
it.each([null, undefined])("should remove the previous modifier class the signal's value is set to %s", (value) => {
component.color.set(value);

fixture.detectChanges();
fixture.detectChanges();

expect(fixture.debugElement.classes).toEqual({
'c-test': true
});
}
);
expect(fixture.debugElement.classes).toEqual({
'c-test': true
});
});
});
8 changes: 4 additions & 4 deletions libs/composables/class/src/modifier.composable.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { provideBaseClass } from './provide-base-class';

@Component({
template: '',
providers: [ provideBaseClass('c-test') ]
providers: [provideBaseClass('c-test')]
})
class TestComponent {
readonly disabled = useModifier('disabled', { initialValue: false });
Expand All @@ -20,7 +20,7 @@ describe('useModifier', () => {

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TestComponent ]
imports: [TestComponent]
}).compileComponents();

fixture = TestBed.createComponent(TestComponent);
Expand All @@ -40,7 +40,7 @@ describe('useModifier', () => {
});
});

it('should remove the attribute, when setting the signal\'s value to `false`', () => {
it("should remove the attribute, when setting the signal's value to `false`", () => {
component.loading.set(false);

fixture.detectChanges();
Expand All @@ -50,7 +50,7 @@ describe('useModifier', () => {
});
});

it('should set the attribute, when setting the signal\'s value to `true`', () => {
it("should set the attribute, when setting the signal's value to `true`", () => {
component.disabled.set(true);

fixture.detectChanges();
Expand Down
Loading

0 comments on commit 06c9ddb

Please sign in to comment.