vxcontrol/ncform
1
0
Fork 0
mirror of https://github.com/vxcontrol/ncform.git synced 2026-07-19 18:23:32 -04:00
Code Issues Packages Projects Releases Wiki Activity

test(ncform): complete globalConfig test cases

Browse Source
This commit is contained in:
daniel.xiao
2019-03-11 18:26:34 +08:00
parent 6c443b20d8
commit 6854bb1283
2 changed files with 265 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ncform-e2e/ncform/cypress/integration/examples/globalConfig.spec.js
+58
View File
@@ -0,0 +1,58 @@
/// <reference types="Cypress" />
const md5 = require('blueimp-md5');
context('<context name>', () => {
before(() => {
cy.visit('http://localhost:3000/examples/components/vue-ncform/_globalConfig.html')
})
it('ignoreRulesWhenHidden is true', () => {
let id = md5('ignoreRulesWhenHidden is true');
cy.get(`[data-cy=${id}]`).within(() => {
cy.get('label').contains('show').next().find('input').as('showInput');
cy.get('legend').contains('info').as('infoItem');
cy.get('button').contains('Submit').as('submitBtn');
cy.get('div').contains('valid pass').as('resultLabel');
cy.get('@infoItem').should('not.be.visible');
cy.get('@submitBtn').click();
cy.get('@resultLabel').should('contain', 'true');
cy.get('@showInput').type('1');
cy.get('@infoItem').should('be.visible');
cy.get('@submitBtn').click();
cy.get('@resultLabel').should('contain', 'false');
})
})
it('ignoreRulesWhenHidden is false', () => {
let id = md5('ignoreRulesWhenHidden is false');
cy.get(`[data-cy=${id}]`).within(() => {
cy.get('button').contains('Submit').as('submitBtn');
cy.get('div').contains('valid pass').as('resultLabel');
cy.get('@resultLabel').should('contain', 'true');
cy.get('@submitBtn').click();
cy.get('@resultLabel').should('contain', 'false');
})
})
it('other configs', () => {
let id = md5('other configs');
cy.get(`[data-cy=${id}]`).within(() => {
cy.get('label').contains('name').next().find('input').as('nameInput');
cy.get('label').contains('fullname').next().find('input').as('fullnameInput');
cy.get('.daniel-form').should('exist');
cy.get('@nameInput').type('daniel');
cy.get('@fullnameInput').should('have.value', 'daniel xiao');
cy.get('@nameInput').clear();
cy.get('@nameInput').next().should('have.class', 'new-invalid-feedback-class');
})
})
})
packages/ncform/examples/components/vue-ncform/_globalConfig.html
+207
View File
@@ -0,0 +1,207 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>vue-ncform Example</title>
<link rel="stylesheet" href="../../../node_modules/bootstrap/dist/css/bootstrap.min.css" />
<style>
.daniel-form {
border: 1px dashed orange;
padding: 4px 8px;
}
.daniel-form .new-invalid-feedback-class {
font-weight: bold;
}
</style>
</head>
<body>
<div id="demo" class="container">
<template v-for="item in formSchemas">
<div :data-cy="item.id" v-if="mode !== 'only' || item.only" :key="item.formName">
<h4>[CASE] {{ item.title }}</h4>
<ncform :form-schema="item.formSchema" v-model="item.formSchema.value" :form-name="item.formName"></ncform>
<div v-if="item.validPass !== undefined">valid pass: {{ item.validPass }}</div>
<button
v-if="['ignoreRulesWhenHidden is true', 'ignoreRulesWhenHidden is false'].indexOf(item.title) >= 0"
class="btn btn-primary"
@click="submit(item)"
>
Submit
</button>
<hr />
</div>
</template>
</div>
<script type="text/javascript" src="../../../node_modules/vue/dist/vue.js"></script>
<script type="text/javascript" src="https://unpkg.com/blueimp-md5@2.10.0/js/md5.js"></script>
<script type="text/javascript" src="../../../node_modules/@ncform/ncform-common/dist/ncformCommon.min.js"></script>
<script type="text/javascript" src="../../../dist/vueNcform.js"></script>
<script type="text/javascript">
Vue.use(vueNcform);
new Vue({
el: '#demo',
data: {
mode: 'all', // all or only. if only mode, only objects with only:true in formSchemas are valid
formSchemas: [
{
id: md5('ignoreRulesWhenHidden is true'),
title: 'ignoreRulesWhenHidden is true',
validPass: false,
formName: 'form_' + Math.random(),
formSchema: {
type: 'object',
properties: {
show: {
type: 'string',
ui: {
columns: 6
}
},
info: {
type: 'object',
ui: {
hidden: 'dx: !{{$root.show}}'
},
properties: {
company: {
type: 'string',
rules: {
required: true
}
},
users: {
type: 'array',
items: {
type: 'object',
properties: {
name: {
type: 'string',
rules: {
required: true
}
}
}
}
}
}
}
},
globalConfig: {
ignoreRulesWhenHidden: true
}
}
},
{
id: md5('ignoreRulesWhenHidden is false'),
title: 'ignoreRulesWhenHidden is false',
validPass: true,
formName: 'form_' + Math.random(),
formSchema: {
type: 'object',
properties: {
show: {
type: 'string',
ui: {
columns: 6
}
},
name: {
type: 'string',
ui: {
hidden: 'dx: !{{$root.show}}'
},
rules: {
required: true
}
}
},
globalConfig: {
ignoreRulesWhenHidden: false
}
}
},
{
id: md5('ignoreRulesWhenHidden is false'),
title: 'ignoreRulesWhenHidden is false',
validPass: true,
formName: 'form_' + Math.random(),
formSchema: {
type: 'object',
properties: {
show: {
type: 'string',
ui: {
columns: 6
}
},
name: {
type: 'string',
ui: {
hidden: 'dx: !{{$root.show}}'
},
rules: {
required: true
}
}
},
globalConfig: {
ignoreRulesWhenHidden: false
}
}
},
{
id: md5('other configs'),
title: 'other configs',
formName: 'form_' + Math.random(),
formSchema: {
type: 'object',
properties: {
name: {
type: 'string',
ui: {
columns: 6
},
rules: {
required: true
}
},
fullname: {
type: 'string',
valueTemplate: 'dx: {{$root.name}} + " " + {{$const.userName}}',
ui: {
columns: 6
}
}
},
globalConfig: {
style: {
formCls: 'daniel-form',
invalidFeedbackCls: 'new-invalid-feedback-class'
},
constants: {
userName: 'xiao'
}
}
}
}
]
},
methods: {
submit(formItem) {
this.$ncformValidate(formItem.formName).then(data => {
formItem.validPass = data.result;
});
}
}
});
</script>
</body>
</html>