test: restore and fix unit tests
This commit is contained in:
woothu
@@ -0,0 +1,36 @@
|
||||
import Vue from 'vue'
|
||||
import { shallowMount, mount } from '@vue/test-utils'
|
||||
import CoreuiVue from '@coreui/vue'
|
||||
import Alerts from '@/views/notifications/Alerts'
|
||||
|
||||
Vue.use(CoreuiVue)
|
||||
|
||||
describe('Alerts.vue', () => {
|
||||
it('has a name', () => {
|
||||
expect(Alerts.name).toMatch('alerts')
|
||||
})
|
||||
it('has a created hook', () => {
|
||||
expect(typeof Alerts.data).toMatch('function')
|
||||
})
|
||||
it('sets the correct default data', () => {
|
||||
expect(typeof Alerts.data).toMatch('function')
|
||||
})
|
||||
it('is Vue instance', () => {
|
||||
const wrapper = shallowMount(Alerts)
|
||||
expect(wrapper.isVueInstance()).toBe(true)
|
||||
})
|
||||
it('is Alerts', () => {
|
||||
const wrapper = shallowMount(Alerts)
|
||||
expect(wrapper.is(Alerts)).toBe(true)
|
||||
})
|
||||
test('renders correctly', () => {
|
||||
const wrapper = shallowMount(Alerts)
|
||||
expect(wrapper.element).toMatchSnapshot()
|
||||
})
|
||||
it('should have methods', () => {
|
||||
expect(typeof Alerts.methods.showAlert ).toEqual('function')
|
||||
expect(Alerts.methods.showAlert()).toBeUndefined()
|
||||
expect(typeof Alerts.methods.countDownChanged ).toEqual('function')
|
||||
expect(Alerts.methods.countDownChanged(10)).toBeUndefined()
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,20 @@
|
||||
import Vue from 'vue'
|
||||
import { shallowMount, mount } from '@vue/test-utils'
|
||||
import CoreuiVue from '@coreui/vue'
|
||||
import Badges from '@/views/notifications/Badges'
|
||||
|
||||
Vue.use(CoreuiVue)
|
||||
|
||||
describe('Badges.vue', () => {
|
||||
it('has a name', () => {
|
||||
expect(Badges.name).toMatch('badges')
|
||||
})
|
||||
it('is Badges', () => {
|
||||
const wrapper = shallowMount(Badges)
|
||||
expect(wrapper.is(Badges)).toBe(true)
|
||||
})
|
||||
test('renders correctly', () => {
|
||||
const wrapper = mount(Badges)
|
||||
expect(wrapper.element).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,32 @@
|
||||
import Vue from 'vue'
|
||||
import { shallowMount, mount } from '@vue/test-utils'
|
||||
import CoreuiVue from '@coreui/vue'
|
||||
import Modals from '@/views/notifications/Modals'
|
||||
|
||||
Vue.use(CoreuiVue)
|
||||
|
||||
describe('Modals.vue', () => {
|
||||
it('has a name', () => {
|
||||
expect(Modals.name).toMatch('modals')
|
||||
})
|
||||
it('has a created hook', () => {
|
||||
expect(typeof Modals.data).toMatch('function')
|
||||
})
|
||||
it('sets the correct default data', () => {
|
||||
expect(typeof Modals.data).toMatch('function')
|
||||
const defaultData = Modals.data()
|
||||
expect(defaultData.largeModal).toBe(false)
|
||||
})
|
||||
it('is Vue instance', () => {
|
||||
const wrapper = shallowMount(Modals)
|
||||
expect(wrapper.isVueInstance()).toBe(true)
|
||||
})
|
||||
it('is Modals', () => {
|
||||
const wrapper = shallowMount(Modals)
|
||||
expect(wrapper.is(Modals)).toBe(true)
|
||||
})
|
||||
test('renders correctly', () => {
|
||||
const wrapper = shallowMount(Modals)
|
||||
expect(wrapper.element).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,494 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Alerts.vue renders correctly 1`] = `
|
||||
<div
|
||||
class="c-wrapper"
|
||||
>
|
||||
<div>
|
||||
<crow-stub>
|
||||
<ccol-stub
|
||||
col="12"
|
||||
md="6"
|
||||
tag="div"
|
||||
>
|
||||
<ccard-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<ccardheader-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
|
||||
<strong>
|
||||
Bootstrap Alert
|
||||
</strong>
|
||||
|
||||
<div
|
||||
class="c-card-header-actions"
|
||||
>
|
||||
<a
|
||||
class="card-header-action"
|
||||
href="https://coreui.io/vue/docs/3.0/components/Alert"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
>
|
||||
<small
|
||||
class="text-muted"
|
||||
>
|
||||
docs
|
||||
</small>
|
||||
</a>
|
||||
</div>
|
||||
</ccardheader-stub>
|
||||
|
||||
<ccardbody-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<div>
|
||||
<p />
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="primary"
|
||||
>
|
||||
Primary Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="secondary"
|
||||
>
|
||||
Secondary Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="success"
|
||||
>
|
||||
Success Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="danger"
|
||||
>
|
||||
Danger Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="warning"
|
||||
>
|
||||
Warning Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="info"
|
||||
>
|
||||
Info Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="light"
|
||||
>
|
||||
Light Alert
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="dark"
|
||||
>
|
||||
Dark Alert
|
||||
</calert-stub>
|
||||
</div>
|
||||
</ccardbody-stub>
|
||||
</ccard-stub>
|
||||
</ccol-stub>
|
||||
|
||||
<ccol-stub
|
||||
col="12"
|
||||
md="6"
|
||||
tag="div"
|
||||
>
|
||||
<ccard-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<ccardheader-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Alert
|
||||
|
||||
<small>
|
||||
use
|
||||
<code>
|
||||
.c-alert-link
|
||||
</code>
|
||||
to provide links
|
||||
</small>
|
||||
</ccardheader-stub>
|
||||
|
||||
<ccardbody-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<div>
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="primary"
|
||||
>
|
||||
|
||||
Primary Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="secondary"
|
||||
>
|
||||
|
||||
Secondary Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="success"
|
||||
>
|
||||
|
||||
Success Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="danger"
|
||||
>
|
||||
|
||||
Danger Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="warning"
|
||||
>
|
||||
|
||||
Warning Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="info"
|
||||
>
|
||||
|
||||
Info Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="light"
|
||||
>
|
||||
|
||||
Light Alert with
|
||||
<a
|
||||
class="c-alert-link"
|
||||
href="#"
|
||||
>
|
||||
an example link
|
||||
</a>
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="dark"
|
||||
>
|
||||
|
||||
Dark Alert with
|
||||
|
||||
<clink-stub
|
||||
activeclass="c-active"
|
||||
class="c-alert-link"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
href="#"
|
||||
routertag="a"
|
||||
tag="span"
|
||||
target="_self"
|
||||
variant="primary"
|
||||
>
|
||||
an example link
|
||||
</clink-stub>
|
||||
|
||||
.
|
||||
|
||||
</calert-stub>
|
||||
</div>
|
||||
</ccardbody-stub>
|
||||
</ccard-stub>
|
||||
</ccol-stub>
|
||||
|
||||
<ccol-stub
|
||||
col="12"
|
||||
md="6"
|
||||
tag="div"
|
||||
>
|
||||
<ccard-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<ccardheader-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Alerts
|
||||
<small>
|
||||
with additional content
|
||||
</small>
|
||||
</ccardheader-stub>
|
||||
|
||||
<ccardbody-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<calert-stub
|
||||
show="true"
|
||||
variant="success"
|
||||
>
|
||||
<h4
|
||||
class="c-alert-heading"
|
||||
>
|
||||
Well done!
|
||||
</h4>
|
||||
|
||||
<p>
|
||||
|
||||
Aww yeah, you successfully read this important alert message.
|
||||
This example text is going to run a bit longer so that you can see
|
||||
how spacing within an alert works with this kind of content.
|
||||
|
||||
</p>
|
||||
|
||||
<hr />
|
||||
|
||||
<p
|
||||
class="c-mb-0"
|
||||
>
|
||||
|
||||
Whenever you need to, be sure to use margin utilities to keep things nice and tidy.
|
||||
|
||||
</p>
|
||||
</calert-stub>
|
||||
</ccardbody-stub>
|
||||
</ccard-stub>
|
||||
</ccol-stub>
|
||||
|
||||
<ccol-stub
|
||||
col="12"
|
||||
md="6"
|
||||
tag="div"
|
||||
>
|
||||
<ccard-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<ccardheader-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Alerts
|
||||
|
||||
<small>
|
||||
dismissible
|
||||
</small>
|
||||
</ccardheader-stub>
|
||||
|
||||
<ccardbody-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<calert-stub
|
||||
closebutton=""
|
||||
show="true"
|
||||
variant="secondary"
|
||||
>
|
||||
|
||||
Dismissible Alert!
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
closebutton=""
|
||||
fade="true"
|
||||
show="true"
|
||||
variant="secondary"
|
||||
>
|
||||
|
||||
Dismissible Alert with fade effect!
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
class="c-alert-dismissible"
|
||||
show="true"
|
||||
variant="secondary"
|
||||
/>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-m-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="info"
|
||||
>
|
||||
|
||||
Show dismissible alerts
|
||||
|
||||
</cbutton-stub>
|
||||
</ccardbody-stub>
|
||||
</ccard-stub>
|
||||
|
||||
<ccard-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<ccardheader-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Alerts
|
||||
|
||||
<small>
|
||||
auto dismissible
|
||||
</small>
|
||||
</ccardheader-stub>
|
||||
|
||||
<ccardbody-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<div>
|
||||
<calert-stub
|
||||
closebutton=""
|
||||
fade="true"
|
||||
show="10"
|
||||
variant="warning"
|
||||
>
|
||||
|
||||
Alert will dismiss after
|
||||
|
||||
<strong>
|
||||
10
|
||||
</strong>
|
||||
seconds...
|
||||
|
||||
</calert-stub>
|
||||
|
||||
<calert-stub
|
||||
closebutton=""
|
||||
show="10"
|
||||
variant="info"
|
||||
>
|
||||
|
||||
Alert will dismiss after 10 seconds...
|
||||
|
||||
<cprogress-stub
|
||||
height="4px"
|
||||
max="10"
|
||||
precision="0"
|
||||
value="10"
|
||||
variant="info"
|
||||
/>
|
||||
</calert-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-m-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="info"
|
||||
>
|
||||
|
||||
Show alert with timer
|
||||
|
||||
</cbutton-stub>
|
||||
</div>
|
||||
</ccardbody-stub>
|
||||
</ccard-stub>
|
||||
</ccol-stub>
|
||||
</crow-stub>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@@ -0,0 +1,361 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Badges.vue renders correctly 1`] = `
|
||||
<div
|
||||
class="c-wrapper"
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
class="c-row"
|
||||
>
|
||||
<div
|
||||
class="c-col-12 c-col-md-6"
|
||||
>
|
||||
<div
|
||||
class="c-card"
|
||||
>
|
||||
<!---->
|
||||
<header
|
||||
class="c-card-header"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
|
||||
<strong>
|
||||
Bootstrap Badge
|
||||
</strong>
|
||||
|
||||
<div
|
||||
class="c-card-header-actions"
|
||||
>
|
||||
<a
|
||||
class="card-header-action"
|
||||
href="https://coreui.io/vue/docs/3.0/components/Badge"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
>
|
||||
<small
|
||||
class="text-muted"
|
||||
>
|
||||
docs
|
||||
</small>
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div
|
||||
class="c-card-body"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<h2>
|
||||
Example heading
|
||||
<span
|
||||
class="c-badge c-badge-primary"
|
||||
>
|
||||
New
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<h3>
|
||||
Example heading
|
||||
<span
|
||||
class="c-badge c-badge-primary"
|
||||
>
|
||||
New
|
||||
</span>
|
||||
</h3>
|
||||
|
||||
<h4>
|
||||
Example heading
|
||||
<span
|
||||
class="c-badge c-badge-primary"
|
||||
>
|
||||
New
|
||||
</span>
|
||||
</h4>
|
||||
|
||||
<h5>
|
||||
Example heading
|
||||
<span
|
||||
class="c-badge c-badge-primary"
|
||||
>
|
||||
New
|
||||
</span>
|
||||
</h5>
|
||||
|
||||
<h6>
|
||||
Example heading
|
||||
<span
|
||||
class="c-badge c-badge-primary"
|
||||
>
|
||||
New
|
||||
</span>
|
||||
</h6>
|
||||
</div>
|
||||
|
||||
<footer
|
||||
class="c-card-footer"
|
||||
>
|
||||
<button
|
||||
class="c-btn c-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
|
||||
Notifications
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-light"
|
||||
style="position: static;"
|
||||
>
|
||||
4
|
||||
</span>
|
||||
</button>
|
||||
</footer>
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="c-col-12 c-col-md-6"
|
||||
>
|
||||
<div
|
||||
class="c-card"
|
||||
>
|
||||
<!---->
|
||||
<header
|
||||
class="c-card-header"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Badge
|
||||
|
||||
<small>
|
||||
contextual variations
|
||||
</small>
|
||||
</header>
|
||||
|
||||
<div
|
||||
class="c-card-body"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<span
|
||||
class="c-badge c-badge-primary"
|
||||
>
|
||||
Primary
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-secondary"
|
||||
>
|
||||
Secondary
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-success"
|
||||
>
|
||||
Success
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-danger"
|
||||
>
|
||||
Danger
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-warning"
|
||||
>
|
||||
Warning
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-info"
|
||||
>
|
||||
Info
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-light"
|
||||
>
|
||||
Light
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-dark"
|
||||
>
|
||||
Dark
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="c-card"
|
||||
>
|
||||
<!---->
|
||||
<header
|
||||
class="c-card-header"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Badge
|
||||
|
||||
<small>
|
||||
pills
|
||||
</small>
|
||||
</header>
|
||||
|
||||
<div
|
||||
class="c-card-body"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<span
|
||||
class="c-badge c-badge-primary c-badge-pill"
|
||||
>
|
||||
Primary
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-secondary c-badge-pill"
|
||||
>
|
||||
Secondary
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-success c-badge-pill"
|
||||
>
|
||||
Success
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-danger c-badge-pill"
|
||||
>
|
||||
Danger
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-warning c-badge-pill"
|
||||
>
|
||||
Warning
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-info c-badge-pill"
|
||||
>
|
||||
Info
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-light c-badge-pill"
|
||||
>
|
||||
Light
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="c-badge c-badge-dark c-badge-pill"
|
||||
>
|
||||
Dark
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="c-card"
|
||||
>
|
||||
<!---->
|
||||
<header
|
||||
class="c-card-header"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Badge
|
||||
|
||||
<small>
|
||||
actionable
|
||||
</small>
|
||||
</header>
|
||||
|
||||
<div
|
||||
class="c-card-body"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<a
|
||||
class="c-badge c-badge-primary"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Primary
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-secondary"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Secondary
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-success"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Success
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-danger"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Danger
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-warning"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Warning
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-info"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Info
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-light"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Light
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="c-badge c-badge-dark"
|
||||
href="#"
|
||||
target="_self"
|
||||
>
|
||||
Dark
|
||||
</a>
|
||||
</div>
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@@ -0,0 +1,317 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Modals.vue renders correctly 1`] = `
|
||||
<div
|
||||
class="c-wrapper"
|
||||
>
|
||||
<div>
|
||||
<crow-stub>
|
||||
<ccol-stub
|
||||
col="12"
|
||||
tag="div"
|
||||
>
|
||||
<ccard-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<ccardheader-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<i
|
||||
class="fa fa-align-justify"
|
||||
/>
|
||||
Bootstrap Modals
|
||||
|
||||
<div
|
||||
class="c-card-header-actions"
|
||||
>
|
||||
<a
|
||||
class="card-header-action"
|
||||
href="https://coreui.io/vue/docs/3.0/components/Modal"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
>
|
||||
<small
|
||||
class="text-muted"
|
||||
>
|
||||
docs
|
||||
</small>
|
||||
</a>
|
||||
</div>
|
||||
</ccardheader-stub>
|
||||
|
||||
<ccardbody-stub
|
||||
subtitletag="h6"
|
||||
titletag="h4"
|
||||
>
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="secondary"
|
||||
>
|
||||
|
||||
Launch demo modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="secondary"
|
||||
>
|
||||
|
||||
Launch large modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="secondary"
|
||||
>
|
||||
|
||||
Launch small modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<hr />
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="primary"
|
||||
>
|
||||
|
||||
Launch primary modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="success"
|
||||
>
|
||||
|
||||
Launch success modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="warning"
|
||||
>
|
||||
|
||||
Launch warning modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="danger"
|
||||
>
|
||||
|
||||
Launch danger modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="info"
|
||||
>
|
||||
|
||||
Launch info modal
|
||||
|
||||
</cbutton-stub>
|
||||
|
||||
<cbutton-stub
|
||||
activeclass="c-active"
|
||||
class="c-mr-1"
|
||||
event="click"
|
||||
exactactiveclass="c-active"
|
||||
routertag="a"
|
||||
target="_self"
|
||||
type="button"
|
||||
variant="dark"
|
||||
>
|
||||
|
||||
Launch dark modal
|
||||
|
||||
</cbutton-stub>
|
||||
</ccardbody-stub>
|
||||
</ccard-stub>
|
||||
</ccol-stub>
|
||||
</crow-stub>
|
||||
</div>
|
||||
|
||||
<cmodal-stub
|
||||
title="Modal title"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
size="lg"
|
||||
title="Modal title"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
size="sm"
|
||||
title="Modal title"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
title="Modal title"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
title="Modal title"
|
||||
variant="success"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
title="Modal title"
|
||||
variant="warning"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
title="Modal title"
|
||||
variant="danger"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
title="Modal title"
|
||||
variant="info"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
|
||||
<cmodal-stub
|
||||
centered="true"
|
||||
nocloseonbackdrop="true"
|
||||
size="lg"
|
||||
title="Modal title 2"
|
||||
variant="dark"
|
||||
>
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
||||
</cmodal-stub>
|
||||
</div>
|
||||
`;
|
||||
Reference in New Issue
Block a user