vue-cli单元化测试（更新中）

我不是女神ヾ 2024-04-17 20:50 26阅读 0赞

1.  利用jest进行测试
2.  新建jest.config.js

module.exports = { 
     moduleFileExtensions: [ 'js', 'jsx', 'json', 'vue' ],
     transform: { 
       '^.+\\.vue$': 'vue-jest',
       '.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
       '^.+\\.jsx?$': 'babel-jest'
     },
     transformIgnorePatterns: [
       '/node_modules/'
     ],
     moduleNameMapper: { 
       '^@/(.*)$': '<rootDir>/src/$1'
     },
     snapshotSerializers: [
       'jest-serializer-vue'
     ],
     testMatch: [
       '**/__tests__/**/*.(js|jsx|ts|tsx)'
     ],
     testPathIgnorePatterns:[
     	'\.eslintrc\.js'
     ],
     testURL: 'http://localhost/',
     watchPlugins: [
       'jest-watch-typeahead/filename',
       'jest-watch-typeahead/testname'
     ]
    }

1.  HelloWorld.test.js

import {  shallowMount,mount } from '@vue/test-utils'
    import HelloWorld from '@/components/HelloWorld.vue'
    describe('HelloWorld.vue', () => { 
      it('renders props.msg when passed', () => { 
        const msg = 'new message'
        const wrapper = shallowMount(HelloWorld, { 
          propsData: {  msg }
        })
        //expect(wrapper.find('.mmm').text()).toMatch(msg)
        //expect(wrapper.props('msg')).toEqual(msg)
        /* wrapper.setProps({msg:'hello'}) expect(wrapper.props('msg').toEqual('hello')) * */
        expect(wrapper.findAll('.mmm').length).toBe(2)
      })
      
      it('快照测试，及时捕获ui的变化',()=>{ 
      	const wrapper = shallowMount(HelloWorld, { 
          propsData: {  msg:'Hello' }
        })
      	expect(wrapper).toMatchSnapshot();
      })
    })

发表评论取消回复

表情：

评论列表（有 0 条评论，26人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue-cli单元化测试（更新中）

. 利用jest进行测试 2. 新建jest.config.js module.exports = { moduleFileExtensions...

我不是女神ヾ/ 2024年04月17日 20:50/ 0 赞/ 27 阅读

相关工作记录------单元测试（持续更新）

工作记录------单元测试之前的工作中从来没有写过单元测试，新入职公司要求写单元测试，个人觉得，作为程序员单元测试还是必须会写的于此记录一下首次编写单元测

╰半橙微兮°/ 2024年03月22日 23:33/ 0 赞/ 39 阅读

相关如何安装、更新、卸载vueCli教程

一、安装VUE-CLI 配置npm淘宝镜像：`npm config set registry htps://registry.npm.taobao.org` 全局安装v

超、凢脫俗/ 2023年10月09日 15:49/ 0 赞/ 45 阅读

相关 java单元测试(java单元测试)

Java单元测试中的伪对象有哪些呢？。。 value); public void setDefaultThrowable(Throwable throwable);

快来打我*/ 2023年09月25日 08:36/ 0 赞/ 44 阅读

相关【单元测试】C++单元测试框架Google Test入门之四：参数化

文章目录一、前言二、旧的方案三、使用参数化后的方案四、参数化后的测试案例名五、类型参数化六、总结一、前言在设计

今天药忘吃喽~/ 2023年09月24日 16:47/ 0 赞/ 92 阅读

相关快速部署vuecli3 vuecli搭建 vuecli

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

本是古典何须时尚/ 2022年12月22日 11:07/ 0 赞/ 277 阅读

相关 VC++中单元测试

Visual Studio中可以直接进行C++项目的单元测试，下面为自己测试的步骤记录。（测试环境为Visual Studio2013，2012步骤相同）首先，新建C++控

浅浅的花香味﹌/ 2022年08月06日 11:06/ 0 赞/ 105 阅读

相关 C#中的单元测试

C\程序可以使用NUnit框架进行单元测试，NUnit是.NET语言的一个测试框架，和Java语言的JUnit同属于XUnit。 NUit官方的安装文件有msi的安装程序和不

骑猪看日落/ 2022年08月06日 11:05/ 0 赞/ 114 阅读

相关【单元测试】单元测试概念

单元测试是编写测试代码，用来检测特定的、明确的、细颗粒的功能。单元测试并不一定保证程序功能是正确的，更不保证整体业务是准备的。单元测试不仅仅用来保证当前代码的正确性，更重要

╰半夏微凉°/ 2022年06月10日 22:26/ 0 赞/ 462 阅读

相关【单元测试】JUnit参数化测试的讨论

文章目录什么是测试参数化 JUnit4参数化测试的局限 JUnit4 DataProvider 什么是测试参数化直接举例，还是用前面测试格式

喜欢ヅ旅行/ 2021年11月01日 12:22/ 0 赞/ 317 阅读