diff --git a/packages/ncform-e2e/ncform-theme-elementui/cypress.json b/packages/ncform-e2e/ncform-theme-elementui/cypress.json index c515954..f90bc8e 100644 --- a/packages/ncform-e2e/ncform-theme-elementui/cypress.json +++ b/packages/ncform-e2e/ncform-theme-elementui/cypress.json @@ -1,3 +1,4 @@ { - "projectId": "5y86ie" + "projectId": "5y86ie", + "ignoreTestFiles": ["__template.spec.js", "common.js"] } diff --git a/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/__template.spec.js b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/__template.spec.js new file mode 100644 index 0000000..61cdf85 --- /dev/null +++ b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/__template.spec.js @@ -0,0 +1,31 @@ +/// + +context('', () => { + + before(() => { + cy.visit('http://localhost:3004/examples/components/playground/index.html') + }) + + it('', () => { + let formSchema = { + type: 'object', + properties: { + name: { + type: 'string', + } + } + }; + cy.window() + .its('editor') + .invoke('setValue', JSON.stringify(formSchema, null, 2)); + common.startRun(); + + cy.get('.previewArea').within(() => { + // Declare action elements + + // common.submitForm(); + }) + + }); + +}) diff --git a/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/common.js b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/common.js new file mode 100644 index 0000000..c7fb2bf --- /dev/null +++ b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/common.js @@ -0,0 +1,19 @@ +export function fillInSchema(formSchema) { + return cy.window() + .its('editor') + .invoke('setValue', JSON.stringify(formSchema, null, 2)); +} + +export function startRun() { + return cy.get('button').contains('Run').click(); +} + +export function submitForm() { + return cy.get('button').contains('Get Data').click() +} + +export default { + startRun, + submitForm, + fillInSchema +} diff --git a/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/input.spec.js b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/input.spec.js new file mode 100644 index 0000000..3db6748 --- /dev/null +++ b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/input.spec.js @@ -0,0 +1,35 @@ +/// + +import common from './common'; + +context('input', () => { + before(() => { + cy.visit('http://localhost:3004/examples/components/playground/index.html'); + }); + + it('', () => { + let formSchema = { + type: 'object', + properties: { + name: { + type: 'string', + } + } + }; + common.fillInSchema(formSchema); + common.startRun(); + // common.submitForm(); + + cy.get('.previewArea').within(() => { + + // Declare action elements + cy.get('label').contains('name').as('nameLabel'); + cy.get('@nameLabel').next().find('input').as('nameInput'); + + cy.get('@nameInput').type('daniel').should('have.value', 'daniel'); + + + }) + + }); +}); diff --git a/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/querying.spec.js b/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/querying.spec.js deleted file mode 100644 index 3ed352f..0000000 --- a/packages/ncform-e2e/ncform-theme-elementui/cypress/integration/examples/querying.spec.js +++ /dev/null @@ -1,70 +0,0 @@ -/// - -context('Querying', () => { - beforeEach(() => { - cy.visit('https://example.cypress.io/commands/querying') - }) - - // The most commonly used query is 'cy.get()', you can - // think of this like the '$' in jQuery - - it('cy.get() - query DOM elements', () => { - // https://on.cypress.io/get - - cy.get('#query-btn').should('contain', 'Button') - - cy.get('.query-btn').should('contain', 'Button') - - cy.get('#querying .well>button:first').should('contain', 'Button') - // ↲ - // Use CSS selectors just like jQuery - - cy.get('[data-test-id="test-example"]').should('have.class', 'example') - }) - - it('cy.contains() - query DOM elements with matching content', () => { - // https://on.cypress.io/contains - cy.get('.query-list') - .contains('bananas') - .should('have.class', 'third') - - // we can pass a regexp to `.contains()` - cy.get('.query-list') - .contains(/^b\w+/) - .should('have.class', 'third') - - cy.get('.query-list') - .contains('apples') - .should('have.class', 'first') - - // passing a selector to contains will - // yield the selector containing the text - cy.get('#querying') - .contains('ul', 'oranges') - .should('have.class', 'query-list') - - cy.get('.query-button') - .contains('Save Form') - .should('have.class', 'btn') - }) - - it('.within() - query DOM elements within a specific element', () => { - // https://on.cypress.io/within - cy.get('.query-form').within(() => { - cy.get('input:first').should('have.attr', 'placeholder', 'Email') - cy.get('input:last').should('have.attr', 'placeholder', 'Password') - }) - }) - - it('cy.root() - query the root DOM element', () => { - // https://on.cypress.io/root - - // By default, root is the document - cy.root().should('match', 'html') - - cy.get('.query-ul').within(() => { - // In this within, the root is now the ul DOM element - cy.root().should('have.class', 'query-ul') - }) - }) -}) diff --git a/packages/ncform-show/src/components/playground/playground.js b/packages/ncform-show/src/components/playground/playground.js index 07a8526..07507be 100755 --- a/packages/ncform-show/src/components/playground/playground.js +++ b/packages/ncform-show/src/components/playground/playground.js @@ -1013,7 +1013,7 @@ export default { methods: { createEditor() { - this.$options.editor = window.ace.edit(this.$refs.editor); + window.editor = this.$options.editor = window.ace.edit(this.$refs.editor); this.$options.editor.$blockScrolling = Infinity; }, templateChange(v) {