Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[OR-1212]: o-labels failing tests #1937

Merged
merged 1 commit into from
Jan 17, 2025
Merged

[OR-1212]: o-labels failing tests #1937

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
25 changes: 19 additions & 6 deletions components/o-labels/test/scss/_mixins.test.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

@include describe('oLabels mixins') {

@include describe('_oLabelsBaseContent') {
Expand All @@ -7,6 +6,7 @@
@include output() {
@include _oLabelsBaseContent;
}

@include contains() {
$expected-vertical-padding: calc(#{oSpacingByName('s1')} - #{1px});
$expected-horizontal-padding: calc(#{oSpacingByName('s2')} - #{1px});
Expand All @@ -23,9 +23,11 @@
@include output($selector: false) {
@include _oLabelsSize('big');
}

@include contains($selector: false) {
$expected-vertical-padding: calc(#{oSpacingByName('s2')} - #{1px});
$expected-horizontal-padding: calc(#{oSpacingByName('s2')} - #{1px});

.o-labels--big {
padding: $expected-vertical-padding $expected-horizontal-padding;
}
Expand All @@ -42,9 +44,11 @@
@include output($selector: false) {
@include _oLabelsSize('small');
}

@include contains($selector: false) {
$expected-vertical-padding: calc(#{2px} - #{1px});
$expected-horizontal-padding: calc(#{4px} - #{1px});

.o-labels--small {
padding: $expected-vertical-padding $expected-horizontal-padding;
}
Expand All @@ -63,19 +67,22 @@
@include oLabelsContent($opts: ('size': 'small'));
}
}

@include expect($selector: false) {
.o-example-label {
font-size: 12px;
line-height: 1;
padding: calc(#{2px} - #{1px}) calc(#{4px} - #{1px});
}

.o-typography--loading-sans .o-example-label {
font-size: 10.44px;
}
}
}
}
}

@include describe('with "state" and no "size"') {
@include it('outputs state styles only') {
@include assert() {
Expand All @@ -84,25 +91,27 @@
@include oLabelsContent($opts: ('state': 'content-commercial'));
}
}

@include expect() {
.o-example-label {
background-color: #008040;
background-color: rgb(0, 127.50102, 64.16718);
; // #008040
color: white;
}
}
}
}
}

@include describe('with a custom "state" and no "size"') {
@include it('outputs custom state styles only') {
@include assert() {
@include output() {
.o-example-label {
@include oLabelsContent($opts: ('state': (
'background-color': hotpink
)));
@include oLabelsContent($opts: ('state': ('background-color': hotpink)));
}
}

@include expect() {
.o-example-label {
background-color: hotpink;
Expand All @@ -112,6 +121,7 @@
}
}
}

@include describe('with "state" and "size"') {
@include it('outputs state and size styles') {
@include assert() {
Expand All @@ -120,9 +130,10 @@
@include oLabelsContent($opts: ('size': 'small', 'state': 'content-commercial'));
}
}

@include expect($selector: false) {
.o-example-label {
background-color: #008040;
background-color: rgb(0, 127.50102, 64.16718); // #008040
color: white;
font-size: 12px;
line-height: 1;
Expand All @@ -136,12 +147,14 @@
}
}
}

@include describe('with "base"') {
@include it('outputs fundamental label styles required by all labels') {
@include assert() {
@include output() {
@include oLabelsContent($opts: ('base': true));
}

@include contains() {
box-sizing: border-box;
}
Expand Down
Loading