wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

removed sample code

This commit is contained in:
Carlos Jimenez Ruiz 2022-03-15 15:39:04 +01:00
parent 49b5ed8003
commit 9e79ad907b
10 changed files with 0 additions and 266 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/QuasarButton.vue
View File

@ -1,12 +0,0 @@
<template>
<q-btn data-cy="button" label="test emit" color="positive" rounded icon="edit" @click="$emit('test')" />
</template>
<script>
import { defineComponent } from 'vue';
export default defineComponent({
name: 'QuasarButton',
emits: ['test'],
});
</script>

65
src/components/QuasarDialog.vue
View File

@ -1,65 +0,0 @@
<template>
<!-- notice dialogRef here -->
<q-dialog ref="dialogRef" @hide="onDialogHide" data-cy="dialog">
<q-card class="q-dialog-plugin">
<q-card-section>{{ message }}</q-card-section>
<!-- buttons example -->
<q-card-actions align="right">
<q-btn data-cy="ok-button" color="primary" label="OK" @click="onOKClick" />
<q-btn color="primary" label="Cancel" @click="onCancelClick" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script>
import { useDialogPluginComponent } from 'quasar';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'QuasarDialog',
props: {
message: {
type: String,
required: true,
},
},
// REQUIRED; need to specify some events that your
// component will emit through useDialogPluginComponent()
emits: useDialogPluginComponent.emits,
setup() {
// REQUIRED; must be called inside of setup()
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginComponent();
// dialogRef - Vue ref to be applied to QDialog
// onDialogHide - Function to be used as handler for @hide on QDialog
// onDialogOK - Function to call to settle dialog with "ok" outcome
// example: onDialogOK() - no payload
// example: onDialogOK({ /*.../* }) - with payload
// onDialogCancel - Function to call to settle dialog with "cancel" outcome
return {
// This is REQUIRED;
// Need to inject these (from useDialogPluginComponent() call)
// into the vue scope for the vue html template
dialogRef,
onDialogHide,
// other methods that we used in our vue html template;
// these are part of our example (so not required)
onOKClick() {
// on OK, it is REQUIRED to
// call onDialogOK (with optional payload)
onDialogOK();
// or with payload: onDialogOK({ ... })
// ...and it will also hide the dialog automatically
},
// we can passthrough onDialogCancel directly
onCancelClick: onDialogCancel,
};
},
});
</script>

33
src/components/QuasarDrawer.vue
View File

@ -1,33 +0,0 @@
<template>
<q-drawer
v-model="showDrawer"
show-if-above
:width="200"
:breakpoint="700"
elevated
data-cy="drawer"
class="bg-primary text-white"
>
<q-scroll-area class="fit">
<div class="q-pa-sm">
<div v-for="n in 50" :key="n">Drawer {{ n }} / 50</div>
</div>
<q-btn data-cy="button">Am I on screen?</q-btn>
</q-scroll-area>
</q-drawer>
</template>
<script>
import { ref, defineComponent } from 'vue';
export default defineComponent({
name: 'QuasarDrawer',
setup() {
const showDrawer = ref(true);
return {
showDrawer,
};
},
});
</script>

21
src/components/QuasarPageSticky.vue
View File

@ -1,21 +0,0 @@
<template>
<q-page-sticky position="bottom-right" :offset="[18, 18]">
<q-btn data-cy="button" rounded color="accent" icon="arrow_forward">
{{ title }}
</q-btn>
</q-page-sticky>
</template>
<script>
import { defineComponent } from 'vue';
export default defineComponent({
name: 'QuasarPageSticky',
props: {
title: {
type: String,
required: true,
},
},
});
</script>

21
src/components/QuasarTooltip.vue
View File

@ -1,21 +0,0 @@
<template>
<q-btn color="primary" data-cy="button">
Button
<q-tooltip v-model="showTooltip" data-cy="tooltip" class="bg-red" :offset="[10, 10]"> Here I am! </q-tooltip>
</q-btn>
</template>
<script>
import { ref, defineComponent } from 'vue';
export default defineComponent({
name: 'QuasarTooltip',
setup() {
const showTooltip = ref(true);
return {
showTooltip,
};
},
});
</script>

42
src/components/__tests__/QuasarButton.e2e.spec.js
View File

@ -1,42 +0,0 @@
import { mount } from '@cypress/vue';
import QuasarButton from '../QuasarButton.vue';
describe('QuasarButton', () => {
it('renders a message', () => {
const label = 'Hello there';
mount(QuasarButton, {
props: {
label,
},
});
cy.dataCy('button').should('contain', label);
});
it('renders another message', () => {
const label = 'Will this work?';
mount(QuasarButton, {
props: {
label,
},
});
cy.dataCy('button').should('contain', label);
});
it('should have a `positive` color', () => {
mount(QuasarButton);
cy.dataCy('button').should('have.backgroundColor', 'var(--q-positive)').should('have.color', 'white');
});
it('should emit `test` upon click', () => {
mount(QuasarButton);
cy.dataCy('button')
.click()
.should(() => {
expect(Cypress.vueWrapper.emitted('test')).to.have.length(1);
});
});
});

24
src/components/__tests__/QuasarDialog.spec.js
View File

@ -1,24 +0,0 @@
import { mount } from '@cypress/vue';
import DialogWrapper from 'app/test/cypress/wrappers/DialogWrapper.vue';
import QuasarDialog from '../QuasarDialog.vue';
describe('QuasarDialog', () => {
it('should show a dialog with a message', () => {
const message = 'Hello, I am a dialog';
mount(DialogWrapper, {
props: {
component: QuasarDialog,
componentProps: {
message,
},
},
});
cy.dataCy('dialog').should('exist').should('contain', message);
});
it('should close a dialog when clikcing ok', () => {
// The dialog is still visible from the previous test
cy.dataCy('dialog').should('exist').dataCy('ok-button').click();
cy.dataCy('dialog').should('not.exist');
});
});

15
src/components/__tests__/QuasarDrawer.spec.js
View File

@ -1,15 +0,0 @@
import { mount } from '@cypress/vue';
import LayoutContainer from 'app/test/cypress/wrappers/LayoutContainer.vue';
import QuasarDrawer from '../QuasarDrawer.vue';
describe('QuasarDrawer', () => {
it('should show a drawer', () => {
mount(LayoutContainer, {
props: {
component: QuasarDrawer,
},
});
cy.dataCy('drawer').should('exist').dataCy('button').should('not.be.visible');
cy.get('.q-scrollarea .scroll').scrollTo('bottom', { duration: 500 }).dataCy('button').should('be.visible');
});
});

22
src/components/__tests__/QuasarPageSticky.spec.js
View File

@ -1,22 +0,0 @@
import { mount } from '@cypress/vue';
import LayoutContainer from 'app/test/cypress/wrappers/LayoutContainer.vue';
import QuasarPageSticky from '../QuasarPageSticky.vue';
describe('QuasarPageSticky', () => {
it('should show a sticky at the bottom-right of the page', () => {
mount(LayoutContainer, {
props: {
component: QuasarPageSticky,
title: 'Test',
},
});
cy.dataCy('button')
.should('be.visible')
.should(($el) => {
const rect = $el[0].getBoundingClientRect();
expect(rect.bottom).to.equal(window.innerHeight - 18);
expect(rect.right).to.equal(window.innerWidth - 18);
});
});
});

11
src/components/__tests__/QuasarTooltip.spec.js
View File

@ -1,11 +0,0 @@
import { mount } from '@cypress/vue';
import QuasarTooltip from '../QuasarTooltip.vue';
describe('QuasarTooltip', () => {
it('should show a tooltip', () => {
mount(QuasarTooltip);
cy.dataCy('button').trigger('mouseover');
cy.dataCy('tooltip').contains('Here I am!');
});
});