diff --git a/README.md b/README.md
index 893f855f..052da785 100644
--- a/README.md
+++ b/README.md
@@ -70,7 +70,7 @@ It will be an object of a form something like:
```js
this.get('tour').set('defaults', {
- classes: 'shepherd-element shepherd-open shepherd-theme-arrows',
+ classes: 'custom-class-name-1 custom-class-name-2',
scrollTo: false,
showCancelLink: true
});
@@ -160,7 +160,7 @@ this.get('tour').set('steps', [
type: 'next'
}
],
- classes: 'shepherd shepherd-open shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
highlightClass: 'highlight',
scrollTo: false,
diff --git a/addon/services/tour.js b/addon/services/tour.js
index 8fe8e156..1ba448f3 100644
--- a/addon/services/tour.js
+++ b/addon/services/tour.js
@@ -325,7 +325,6 @@ export default Service.extend(Evented, {
text: 'Exit',
action: tour.cancel
}],
- classes: 'shepherd shepherd-open shepherd-theme-arrows shepherd-transparent-text',
copyStyles: false,
title: get(this, 'errorTitle'),
text: [get(this, 'messageForUser')]
diff --git a/tests/acceptance/ember-shepherd-test.js b/tests/acceptance/ember-shepherd-test.js
index ecace3db..ddef213b 100644
--- a/tests/acceptance/ember-shepherd-test.js
+++ b/tests/acceptance/ember-shepherd-test.js
@@ -2,25 +2,19 @@ import { module, test } from 'qunit';
import { visit, click, find } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
import sinonTest from 'ember-sinon-qunit/test-support/test';
-import steps from '../data';
+import { builtInButtons, steps as defaultSteps } from '../data';
-let tour;
module('Acceptance | Tour functionality tests', function(hooks) {
+ let tour;
+
setupApplicationTest(hooks);
hooks.beforeEach(function() {
tour = this.owner.lookup('service:tour');
- tour.setProperties({
- steps,
- confirmCancel: false,
- modal: false,
- defaults: {
- classes: 'shepherd-theme-arrows',
- scrollTo: true,
- showCancelLink: true
- }
- });
+
+ tour.set('confirmCancel', false);
+ tour.set('modal', false);
});
test('Shows cancel link', async function(assert) {
@@ -39,27 +33,14 @@ module('Acceptance | Tour functionality tests', function(hooks) {
};
const steps = [{
- id: 'test-highlight',
+ id: 'step-without-cancel-link',
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
showCancelLink: false,
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
- highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
- text: ['Testing highlight']
}
}];
@@ -86,36 +67,12 @@ module('Acceptance | Tour functionality tests', function(hooks) {
});
sinonTest('Confirm cancel makes you confirm cancelling the tour', async function(assert) {
- const steps = [{
- id: 'intro',
- options: {
- attachTo: '.first-element bottom',
- builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
- ],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
- title: 'Welcome to Ember Shepherd!',
- text: ['A field that has rested gives a bountiful crop.'],
- scrollTo: false
- }
- }];
-
const stub = this.stub(window, 'confirm');
await visit('/');
tour.set('confirmCancel', true);
- tour.set('steps', steps);
+ tour.set('steps', defaultSteps);
await click('.toggleHelpModal');
@@ -174,21 +131,10 @@ module('Acceptance | Tour functionality tests', function(hooks) {
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
text: ['Testing highlight']
}
}];
@@ -215,21 +161,10 @@ module('Acceptance | Tour functionality tests', function(hooks) {
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
text: ['Testing highlight']
}
}];
@@ -250,49 +185,31 @@ module('Acceptance | Tour functionality tests', function(hooks) {
test('Defaults applied', async function(assert) {
assert.expect(1);
- const defaults = {
- classes: 'shepherd-theme-arrows test-defaults',
- scrollTo: false,
- showCancelLink: true
- };
-
- const steps = [{
- id: 'test-defaults-classes',
- options: {
- attachTo: '.first-element bottom',
- builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
- ],
- copyStyles: false,
- highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
- text: ['Testing defaults']
+ const stepsWithoutClasses = [
+ {
+ id: 'test-highlight',
+ options: {
+ attachTo: '.first-element bottom',
+ builtInButtons: [
+ builtInButtons.cancel,
+ builtInButtons.next,
+ ],
+ }
}
- }];
+ ];
await visit('/');
- tour.set('defaults', defaults);
- tour.set('steps', steps);
+ tour.set('steps', stepsWithoutClasses);
await click('.toggleHelpModal');
- assert.ok(document.querySelector('.test-defaults'), 'defaults class applied');
+ assert.ok(document.querySelector('.custom-default-class'), 'defaults class applied');
});
test('configuration works with attachTo object when element is a simple string', async function(assert) {
assert.expect(1);
- // Override default behavior
const steps = [{
id: 'test-attachTo-string',
options: {
@@ -301,22 +218,9 @@ module('Acceptance | Tour functionality tests', function(hooks) {
on: 'bottom'
},
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
- highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
- text: ['Testing highlight']
}
}];
@@ -334,7 +238,6 @@ module('Acceptance | Tour functionality tests', function(hooks) {
await visit('/');
- // Override default behavior
const steps = [{
id: 'test-attachTo-dom',
options: {
@@ -343,22 +246,9 @@ module('Acceptance | Tour functionality tests', function(hooks) {
on: 'bottom'
},
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
- highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
- text: ['Testing highlight']
}
}];
@@ -398,11 +288,6 @@ module('Acceptance | Tour functionality tests', function(hooks) {
text: 'button three'
}
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
- highlightClass: 'highlight',
- title: 'Welcome to Ember-Shepherd!',
- text: ['Testing highlight']
}
}];
@@ -474,21 +359,9 @@ module('Acceptance | Tour functionality tests', function(hooks) {
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
- title: 'Welcome to Ember Shepherd!',
- text: ['A field that has rested gives a bountiful crop.'],
scrollTo: true,
scrollToHandler() {
return document.querySelector('#ember-testing-container').scrollTop = 120;
@@ -546,22 +419,10 @@ module('Acceptance | Tour functionality tests', function(hooks) {
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
copyStyles: true,
- title: 'Welcome to Ember Shepherd!',
- text: ['A field that has rested gives a bountiful crop.'],
- scrollTo: false
}
}];
diff --git a/tests/data.js b/tests/data.js
index 5d87d29e..a1aa1d7b 100644
--- a/tests/data.js
+++ b/tests/data.js
@@ -1,21 +1,31 @@
-export default [
+export const builtInButtons = {
+ cancel: {
+ classes: 'shepherd-button-secondary cancel-button',
+ text: 'Exit',
+ type: 'cancel'
+ },
+ next: {
+ classes: 'shepherd-button-primary next-button',
+ text: 'Next',
+ type: 'next'
+ },
+ back: {
+ classes: 'shepherd-button-primary back-button',
+ text: 'Back',
+ type: 'back'
+ }
+};
+
+export const steps = [
{
id: 'intro',
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
title: 'Welcome to Ember Shepherd!',
text: [
@@ -33,23 +43,11 @@ export default [
options: {
attachTo: '.install-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: ['Installation is simple, if you are using Ember-CLI, just install like any other addon.']
}
@@ -59,23 +57,11 @@ export default [
options: {
attachTo: '.usage-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: ['To use the tour service, simply inject it into your application and use it like this example.']
}
@@ -88,23 +74,11 @@ export default [
on: 'top'
},
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
'We implemented true modal functionality by disabling clicking of the rest of the page.',
@@ -120,23 +94,11 @@ export default [
on: 'top'
},
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
`When using a modal, most times just setting the z-index of your element to something high will
@@ -150,23 +112,11 @@ export default [
options: {
attachTo: '.built-in-buttons-element top',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
`For the common button types ("next", "back", "cancel", etc.), we implemented Ember actions
@@ -180,23 +130,11 @@ export default [
options: {
attachTo: '.disable-scroll-element top',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
`When navigating the user through a tour, you may want to disable scrolling, so they
@@ -209,18 +147,10 @@ export default [
id: 'noAttachTo',
options: {
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: ['If no attachTo is specified, the modal will appear in the center of the screen, as per the Shepherd docs.']
}
diff --git a/tests/dummy/app/data.js b/tests/dummy/app/data.js
index 2eb7310b..a1aa1d7b 100644
--- a/tests/dummy/app/data.js
+++ b/tests/dummy/app/data.js
@@ -1,29 +1,39 @@
-export default [
+export const builtInButtons = {
+ cancel: {
+ classes: 'shepherd-button-secondary cancel-button',
+ text: 'Exit',
+ type: 'cancel'
+ },
+ next: {
+ classes: 'shepherd-button-primary next-button',
+ text: 'Next',
+ type: 'next'
+ },
+ back: {
+ classes: 'shepherd-button-primary back-button',
+ text: 'Back',
+ type: 'back'
+ }
+};
+
+export const steps = [
{
id: 'intro',
options: {
attachTo: '.first-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
title: 'Welcome to Ember Shepherd!',
text: [
`Ember Shepherd is a javascript library for guiding users through your Ember app.
It is an Ember addon that wraps Shepherd
- and extends its functionality. Shepherd uses Popper.js,
+ and extends its functionality. Shepherd uses Popper.js,
another open source library, to position all of its steps.`,
- `Popper.js makes sure your steps never end up off screen or cropped by an
+ `Popper makes sure your steps never end up off screen or cropped by an
overflow. Try resizing your browser to see what we mean.`
]
}
@@ -33,23 +43,11 @@ export default [
options: {
attachTo: '.install-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: ['Installation is simple, if you are using Ember-CLI, just install like any other addon.']
}
@@ -59,23 +57,11 @@ export default [
options: {
attachTo: '.usage-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: ['To use the tour service, simply inject it into your application and use it like this example.']
}
@@ -88,23 +74,11 @@ export default [
on: 'top'
},
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
'We implemented true modal functionality by disabling clicking of the rest of the page.',
@@ -120,23 +94,11 @@ export default [
on: 'top'
},
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
`When using a modal, most times just setting the z-index of your element to something high will
@@ -150,23 +112,11 @@ export default [
options: {
attachTo: '.built-in-buttons-element top',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
`For the common button types ("next", "back", "cancel", etc.), we implemented Ember actions
@@ -180,23 +130,11 @@ export default [
options: {
attachTo: '.disable-scroll-element top',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- },
- {
- classes: 'shepherd-button-primary next-button',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: [
`When navigating the user through a tour, you may want to disable scrolling, so they
@@ -209,18 +147,10 @@ export default [
id: 'noAttachTo',
options: {
builtInButtons: [
- {
- classes: 'shepherd-button-secondary cancel-button',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary back-button',
- text: 'Back',
- type: 'back'
- }
+ builtInButtons.cancel,
+ builtInButtons.back,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
+ classes: 'custom-class-name-1 custom-class-name-2',
copyStyles: false,
text: ['If no attachTo is specified, the modal will appear in the center of the screen, as per the Shepherd docs.']
}
diff --git a/tests/dummy/app/routes/application.js b/tests/dummy/app/routes/application.js
index 4b7bbdad..53bfdc19 100644
--- a/tests/dummy/app/routes/application.js
+++ b/tests/dummy/app/routes/application.js
@@ -3,13 +3,13 @@ import Route from '@ember/routing/route';
import config from '../config/environment';
import { inject as service } from '@ember/service';
import { scheduleOnce } from '@ember/runloop';
-import steps from '../data';
+import { steps as defaultSteps } from '../data';
export default Route.extend({
tour: service(),
disableScroll: true,
defaults: {
- classes: 'shepherd-element shepherd-theme-arrows',
+ classes: 'shepherd-theme-arrows custom-default-class',
scrollTo: true,
showCancelLink: true
},
@@ -21,7 +21,7 @@ export default Route.extend({
tour.set('disableScroll', this.get('disableScroll'));
tour.set('modal', true);
tour.set('confirmCancel', false);
- tour.set('steps', steps);
+ tour.set('steps', defaultSteps);
tour.set('requiredElements', [
{
selector: '.first-element',
diff --git a/tests/unit/services/tour-test.js b/tests/unit/services/tour-test.js
index dd47803f..780bc12a 100644
--- a/tests/unit/services/tour-test.js
+++ b/tests/unit/services/tour-test.js
@@ -3,6 +3,7 @@ import { setupTest } from 'ember-qunit';
import EmberObject from '@ember/object';
import { run } from '@ember/runloop';
import { getElementPosition, setPositionForHighlightElement } from 'ember-shepherd/utils';
+import { builtInButtons } from '../../data';
const steps = [
{
@@ -10,19 +11,10 @@ const steps = [
options: {
attachTo: '.test-element bottom',
builtInButtons: [
- {
- classes: 'shepherd-button-secondary',
- text: 'Exit',
- type: 'cancel'
- },
- {
- classes: 'shepherd-button-primary',
- text: 'Next',
- type: 'next'
- }
+ builtInButtons.cancel,
+ builtInButtons.next,
],
- classes: 'shepherd shepherd-theme-arrows shepherd-transparent-text',
- copyStyles: false,
+ classes: 'custom-class-name-1 custom-class-name-2',
title: 'Welcome to Ember-Shepherd!',
text: ['Test text'],
scrollTo: true,