Will's blog Will's blog
首页
  • 前端文章

    • JavaScript
  • 学习笔记

    • 《JavaScript教程》
    • 《JavaScript高级程序设计》
    • 《ES6 教程》
    • 《Vue》
    • 《React》
    • 《TypeScript 从零实现 axios》
    • 《Git》
    • TypeScript
    • JS设计模式总结
  • HTML
  • CSS
  • VUE
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

will

前端小学生
首页
  • 前端文章

    • JavaScript
  • 学习笔记

    • 《JavaScript教程》
    • 《JavaScript高级程序设计》
    • 《ES6 教程》
    • 《Vue》
    • 《React》
    • 《TypeScript 从零实现 axios》
    • 《Git》
    • TypeScript
    • JS设计模式总结
  • HTML
  • CSS
  • VUE
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 初识 TypeScript

  • TypeScript 常用语法

  • ts-axios 项目初始化

  • ts-axios 基础功能实现

  • ts-axios 异常情况处理

  • ts-axios 接口扩展

  • ts-axios 拦截器实现

  • ts-axios 配置化实现

  • ts-axios 取消功能实现

  • ts-axios 更多功能实现

  • ts-axios 单元测试

    • 前言
    • Jest 安装和配置
    • 辅助模块单元测试
    • 请求模块单元测试
    • headers 模块单元测试
      • 测试代码编写
    • Axios 实例模块单元测试
    • 拦截器模块单元测试
    • mergeConfig 模块单元测试
    • 请求取消模块单元测试
    • 剩余模块单元测试
  • ts-axios 部署与发布

  • 《TypeScript 从零实现 axios》
  • ts-axios 单元测试
HuangYi
2020-01-05
目录

headers 模块单元测试

# headers 模块单元测试

之前我们测试了 headers 的基础方法模块,接下来我们会从业务角度测试 headers 的相关业务逻辑。

# 测试代码编写

test/headers.spec.ts:

import axios from '../src/index'

import { getAjaxRequest } from './helper'



function testHeaderValue(headers: any, key: string, val?: string): void {

  let found = false



  for (let k in headers) {

    if (k.toLowerCase() === key.toLowerCase()) {

      found = true

      expect(headers[k]).toBe(val)

      break

    }

  }



  if (!found) {

    if (typeof val === 'undefined') {

      expect(headers.hasOwnProperty(key)).toBeFalsy()

    } else {

      throw new Error(key + ' was not found in headers')

    }

  }

}



describe('headers', () => {

  beforeEach(() => {

    jasmine.Ajax.install()

  })



  afterEach(() => {

    jasmine.Ajax.uninstall()

  })



  test('should use default common headers', () => {

    const headers = axios.defaults.headers.common



    axios('/foo')



    return getAjaxRequest().then(request => {

      for (let key in headers) {

        if (headers.hasOwnProperty(key)) {

          expect(request.requestHeaders[key]).toEqual(headers[key])

        }

      }

    })

  })



  test('should add extra headers for post', () => {

    axios.post('/foo', 'fizz=buzz')



    return getAjaxRequest().then(request => {

      testHeaderValue(request.requestHeaders, 'Content-Type', 'application/x-www-form-urlencoded')

    })

  })



  test('should use application/json when posting an object', () => {

    axios.post('/foo/bar', {

      firstName: 'foo',

      lastName: 'bar'

    })



    return getAjaxRequest().then(request => {

      testHeaderValue(request.requestHeaders, 'Content-Type', 'application/json;charset=utf-8')

    })

  })



  test('should remove content-type if data is empty', () => {

    axios.post('/foo')



    return getAjaxRequest().then(request => {

      testHeaderValue(request.requestHeaders, 'Content-Type', undefined)

    })

  })



  it('should preserve content-type if data is false', () => {

    axios.post('/foo', false)



    return getAjaxRequest().then(request => {

      testHeaderValue(request.requestHeaders, 'Content-Type', 'application/x-www-form-urlencoded')

    })

  })



  test('should remove content-type if data is FormData', () => {

    const data = new FormData()

    data.append('foo', 'bar')



    axios.post('/foo', data)



    return getAjaxRequest().then(request => {

      testHeaderValue(request.requestHeaders, 'Content-Type', undefined)

    })

  })

})

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92

内部定义了 testHeaderValue 辅助函数,用于测试 headers 是否存在某个 header name 下的某个值。

至此我们完成了 ts-axios 库 headers 模块相关业务逻辑的测试,下一节课我们会对 Axios 的实例做测试。

编辑此页 (opens new window)
#TypeScript
上次更新: 2024/08/22, 14:42:43
请求模块单元测试
Axios 实例模块单元测试

← 请求模块单元测试 Axios 实例模块单元测试→

最近更新
01
我用AI写前端代码这一年:从怀疑到真香的转变
09-15
02
基于 Next.js 的无人机数据孪生可视化平台实践
07-17
03
vite 包缓存问题 处理
06-04
更多文章>
Theme by Vdoing | Copyright © 2019-2025 Will | MIT License | 桂ICP备2024034950号 | 桂公网安备45142202000030
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式