목록Frontend/Test Driven (6)

로메오의 블로그

[Json-server] JSON-Server 이용해서 Mock API 만들기

$ yarn global add json-server json-server를 global로 설치합니다. $ cd /project/path $ mkdir mock-project $ cd mock-project $ yarn init $ touch db.json 프로젝트를 설정하고, json 파일을 생성합니다. db.json { "company": [ { "id": 1, "name": "Google", "country": "USA" }, { "id": 2, "name": "Samsung", "country": "Korea" }, { "id": 3, "name": "Xiaomi", "country": "China" } ], "users": [ { "id": 1, "name": "Lee", "role": "dev..
Frontend/Test Driven 2019. 11. 25. 22:30
[Jasmine] 테스트 코드 작성

karma.conf.js module.exports = function(config) { config.set({ basePath: '', frameworks: ['jasmine'], files: [ './js/index.js', './__test__/*.spec.js' ], exclude: [ ], preprocessors: { }, reporters: ['progress'], port: 9876, colors: true, logLevel: config.LOG_INFO, autoWatch: true, browsers: ['Chrome'], singleRun: false, concurrency: Infinity }) } karma 환경설정 파일을 열어서 files 부분을 수정합니다. js/index.js ..
Frontend/Test Driven 2019. 6. 29. 17:00
[Jasmine] Karma 환경설정

karma cli 설치 $ npm install -g karma-cli 프로젝트 생성 $ cd /my/project/path $ mkdir firstProject $ cd firstProject $ npm init -y $ mkdir html js __test__ $ touch html/index.html js/index.js __test__/index.spec.js $ touch testRunner.html 프로젝트 파일구조가 설정되었습니다. 모듈 설치 karma, jasmine 설치 $ npm install --save-dev karma karma-jasmine $ npm install --save-dev jasmine-core 브라우저 러너 설치 $ npm install --save-dev karm..
Frontend/Test Driven 2019. 6. 29. 16:34
[QUnit] mock storage 사용하기

QUnit은 local server에서 구동할것이기 때문에 webpack으로 dev server 설정을 먼저 하세요. WEBPACK DEV SERVER 구동하기 js/index.js 실제 개발 코드가 되겠습니다. // Storage에 데이터를 저장한다. let myphone localStorage.setItem('mySmartPhone', 'iPhone') myphone = localStorage.getItem('mySmartPhone') console.log('내 폰은 ' + myphone + ' 입니다.') localStorage에 mySmartPhone 의 실제값은 iPhone이 들어갑니다. __test__/index.spec.js // mockStorage 함수를 생성한다. QUnit.begin(..
Frontend/Test Driven 2019. 6. 28. 04:14
[QUnit] 테스트 코드 작성하기

기본테스트 js/index.js // 더하기 함수 const addNumber = (first, last) => { return parseInt(first, 10) + parseInt(last, 10) } __test__/index.spec.js QUnit.test('더하기 함수 테스트', assert => { const result1 = addNumber(10, 30) assert.equal(result1, 40, '10 + 30 = 40') }) 코드를 작성하고 브라우저 새로고침을 합니다. QUnit.skip __test__/index.spec.js 에 추가합니다. QUnit.skip('테스트 보류함', assert => { const result1 = addNumber(10, 30) assert.e..
Frontend/Test Driven 2019. 6. 28. 03:37
[QUnit] 테스트 환경 설정

QUnit은 local server에서 구동할것이기 때문에 webpack으로 dev server 설정을 먼저 하세요. WEBPACK DEV SERVER 구동하기 프로젝트 생성하기 프로젝트 root 폴더에 testRunner.html 파일을 생성합니다. 그리고 __test__ 폴더를 만들고 index.spec.js 파일을 생성합니다. js 폴더에 index.js 파일도 생성합니다. $ cd /my/project/path/firstProject $ touch testRunner.html $ mkdir __test__ $ touch __test__/index.spec.js $ mkdir js $ touch js/index.js testRunner.html 파일을 열어서 코딩을 합니다. 스크립트 파일은 cdn에..
Frontend/Test Driven 2019. 6. 27. 05:34
Prev 1 Next