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

Jump to bottom

feat!: Change on and off option to onlabel and offlabel Closes #99 #100

Merged
merged 6 commits into from
Dec 26, 2022
Merged

feat!: Change on and off option to onlabel and offlabel Closes #99 #100

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
f342dbc
styles: Format test loader with prettier
palcarazm Dec 26, 2022
5b86e08
style: Format cypress togglemodel with prettier
palcarazm Dec 26, 2022
a6c8e3b
feat!: Change on and off option to onlabel and offlabel Closes #99
palcarazm Dec 26, 2022
f8f0a3c
test: Update test to consider feature #99.
palcarazm Dec 26, 2022
1ae810d
docs: Update README
palcarazm Dec 26, 2022
b855955
test: Fix colors tests
palcarazm Dec 26, 2022
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
9 changes: 4 additions & 5 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,6 @@
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->


- [Installation](#installation)
- [CDN](#cdn)
- [ECMAS Interface](#ecmas-interface)
Expand Down Expand Up @@ -145,8 +144,8 @@ EX: Initialize id `chkToggle` with a single line of JavaScript.
<input
type="checkbox"
data-toggle="toggle"
data-on="Enabled"
data-off="Disabled" />
data-onlabel="Enabled"
data-offlabel="Disabled" />
<input type="checkbox" id="toggle-two" />
<script>
document.querySelector("#toggle-two").bootstrapToggle({
Expand All @@ -158,8 +157,8 @@ EX: Initialize id `chkToggle` with a single line of JavaScript.

| Name | Type | Default | Description |
| ---------- | ----------- | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `on` | string/html | "On" | Text of the on toggle |
| `off` | string/html | "Off" | Text of the off toggle |
| `onlabel` | string/html | "On" | Text of the on toggle |
| `offlabel` | string/html | "Off" | Text of the off toggle |
| `size` | string | "normal" | Size of the toggle. Possible values are: `large`, `normal`, `small`, `mini`. |
| `onstyle` | string | "primary" | Style of the on toggle. Possible values are: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `light`, `dark` and with `outline-` prefix |
| `offstyle` | string | "secondary" | Style of the off toggle. Possible values are: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `light`, `dark` and with `outline-` prefix |
Expand Down
70 changes: 62 additions & 8 deletions cypress/e2e/custom-text.spec.cy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,66 @@ import ToggleModel from "../support/togglemodel";
import PageModel from "../support/pagemodel";

describe("Custom Text feature", () => {
context("Given ECMAS bootstrap toggle interface",()=>{
context("Given ECMAS bootstrap toggle interface", () => {
testCase("ecmas");
});
context("Given jQuery bootstrap toggle interface",()=>{
context("Given jQuery bootstrap toggle interface", () => {
testCase("jquery");
});
});

function testCase(bstInterface) {
context("When data-onlabel attribute is set", () => {
const data_test = "custom-text";
it("Then toggle-on text is equal to a custom text", () => {
PageModel.load(bstInterface, data_test);
PageModel.getTests().each(($test) => {
if (
$test.find('input[data-toggle="toggle"][data-onlabel]').length > 0
) {
cy.wrap($test)
.find("code")
.then(($element) => {
cy.wrap($test)
.find(".toggle-on")
.should("have.text", $element.html());
});
}
});
});
});

context("When data-offlabel attribute is set", () => {
const data_test = "custom-text";
it("Then toggle-off text is equal to a custom text", () => {
PageModel.load(bstInterface, data_test);
PageModel.getTests().each(($test) => {
if (
$test.find('input[data-toggle="toggle"][data-offlabel]').length > 0
) {
cy.wrap($test)
.find("code")
.then(($element) => {
cy.wrap($test)
.find(".toggle-off")
.should("have.text", $element.html());
});
}
});
});
});

context("When data-on attribute is set", () => {
const data_test = "custom-text";
it("Then toggle-on text is equal to a custom text", () => {
PageModel.load(bstInterface, data_test);
PageModel.getTests().each(($test) => {
if ($test.find('input[data-toggle="toggle"][data-on]').length > 0) {
ToggleModel.DEPRECATION.warnCheck(
ToggleModel.DEPRECATION.ATTRIBUTE,
"data-on",
"data-onlabel"
);
cy.wrap($test)
.find("code")
.then(($element) => {
Expand All @@ -36,6 +81,11 @@ function testCase(bstInterface) {
PageModel.load(bstInterface, data_test);
PageModel.getTests().each(($test) => {
if ($test.find('input[data-toggle="toggle"][data-off]').length > 0) {
ToggleModel.DEPRECATION.warnCheck(
ToggleModel.DEPRECATION.ATTRIBUTE,
"data-off",
"data-offlabel"
);
cy.wrap($test)
.find("code")
.then(($element) => {
Expand All @@ -48,33 +98,37 @@ function testCase(bstInterface) {
});
});

context("When data-on attribute isn't set", () => {
context("When data-onlabel attribute isn't set", () => {
const data_test = "custom-text";
it("Then toggle-on text is equal to the default text", () => {
PageModel.load(bstInterface, data_test);
PageModel.getTests().each(($test) => {
if (
$test.find('input[data-toggle="toggle"]:not([data-on])').length > 0
$test.find(
'input[data-toggle="toggle"]:not([data-onlabel]):not([data-on])'
).length > 0
) {
cy.wrap($test)
.find(".toggle-on")
.should("have.text", ToggleModel.DEFAULTS.on);
.should("have.text", ToggleModel.DEFAULTS.onlabel);
}
});
});
});

context("When data-off attribute isn't set", () => {
context("When data-offlabel attribute isn't set", () => {
const data_test = "custom-text";
it("Then toggle-off text is equal to the default text", () => {
PageModel.load(bstInterface, data_test);
PageModel.getTests().each(($test) => {
if (
$test.find('input[data-toggle="toggle"]:not([data-off])').length > 0
$test.find(
'input[data-toggle="toggle"]:not([data-offlabel]):not([data-off])'
).length > 0
) {
cy.wrap($test)
.find(".toggle-off")
.should("have.text", ToggleModel.DEFAULTS.off);
.should("have.text", ToggleModel.DEFAULTS.offlabel);
}
});
});
Expand Down
8 changes: 7 additions & 1 deletion cypress/support/pagemodel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,13 @@ class PageModel {
* @static
*/
static load(bstInterface, btn_data_test) {
cy.visit("./test/test-app." + bstInterface.toLowerCase() + ".html");
cy.visit("./test/test-app." + bstInterface.toLowerCase() + ".html", {
onBeforeLoad(win) {
cy.stub(win.console, "log").as("consoleLog");
cy.stub(win.console, "warn").as("consoleWarn");
cy.stub(win.console, "error").as("consoleError");
},
});
cy.get('button[data-test="' + btn_data_test + '"]').click();
}

Expand Down
Loading