/* global cy */
import InfoVueJsonPretty from './index.vue'

const mount = (r: any = {}, m: any = {}) => {
    let modelData = {
        testModel: {
            foo: 'bar'
        }
    }
    // 合并 modelData 与 m
    Object.assign(modelData, m)
    let row = {
        model: 'testModel',
        deep: 1,
        showLength: true,
        showDoubleQuotes: true,
        highlightSelectedNode: false,
        path: 'testPath',
        edit: true
    }
    // 合并 row 与 r
    Object.assign(row, r)
    cy.mount(InfoVueJsonPretty, {
        props: {
            row,
            modelData
        }
    })
}

describe('<InfoVueJsonPretty/>', () => {
    it('呈现正确的数据', () => {
        mount()
        cy.get('.vjs-tree').should('contain', 'foo')
    })

    it('不可编辑修改', () => {
        mount({ edit: false })
        cy.get('.vjs-tree').contains('bar').click()
        cy.get('.vjs-tree').find('input').should('have.length', '0')
    })

    it('切换编辑模式，可修改', () => {
        mount()
        cy.get('.vjs-tree').contains('bar').click()
        cy.get('.vjs-tree').find('input').should('have.length', '1')
    })

    it('不显示双引号', () => {
        mount({ showDoubleQuotes: false })
        cy.get('.vjs-key').should('have.text', 'foo:')
    })

    it('显示双引号', () => {
        mount({ showDoubleQuotes: true })
        cy.get('.vjs-key').should('have.text', '"foo":')
    })

    it('默认不展开显示', () => {
        mount(
            { deep: 0 },
            {
                testModel: {
                    name: 'code',
                    code: {
                        python: ['VSCode', 'PyCharm'],
                        java: ['VSCode', 'idea']
                    }
                }
            }
        )
        cy.get('.vjs-tree-brackets').should('have.text', '{...}')
    })
    it('默认只展开两级显示', () => {
        mount(
            { deep: 2 },
            {
                testModel: {
                    name: 'code',
                    code: {
                        python: ['VSCode', 'PyCharm'],
                        java: ['VSCode', 'idea']
                    }
                }
            }
        )
        cy.get('#__cy_vue_root > div > div > div:nth-child(4) > span.vjs-key').should('have.text', '"python":')
        cy.get('#__cy_vue_root > div > div > div:nth-child(4) > span:nth-child(3) > span.vjs-tree-brackets').should(
            'have.text',
            '[...]'
        )
    })
    it('默认全部展开显示', () => {
        mount(
            { deep: 100 },
            {
                testModel: {
                    name: 'code',
                    code: {
                        python: ['VSCode', 'PyCharm'],
                        java: ['VSCode', 'idea']
                    }
                }
            }
        )
        cy.get('#__cy_vue_root > div > div > div:nth-child(4) > span.vjs-key').should('have.text', '"python":')
        cy.get('#__cy_vue_root > div > div > div:nth-child(5) > span > span.vjs-value.vjs-value-string').should(
            'have.text',
            '"VSCode"'
        )
    })
})