AxiosRequestHeaders type breaks from 0.21.4 to 0.22.0
Problem
Describe the bug The type has changed and now I am getting linting errors on a working code. I get _Element implicitly has an 'any' type because index expression is not of type 'number'.ts(7015)_ error when I try to access the headers by their name on a `AxiosRequestHeaders` object. For example accessing a common header in `transfomRequest` where the content of headers is: If I try to access the common _Accept_ header key, then I will get the above error. I think the issue is at: https://github.com/axios/axios/blob/1025d1231a7747503188459dd5a6d1effdcea928/index.d.ts#L3 The type should be: [code block] Possibly the `AxiosResponseHeaders` has the same issue. To Reproduce [code block] Expected behavior Expected to not raise an error there Environment - Axios 0.23.0 - TypeScript 4.4.4 Additional context/Screenshots
Error Output
error when I try to access the headers by their name on a `AxiosRequestHeaders` object.
Unverified for your environment
Select your OS to check compatibility.
1 Fix
Update AxiosRequestHeaders Type Access Method
The type definition for AxiosRequestHeaders was changed in version 0.22.0, which now requires a more explicit type assertion when accessing headers by their name. This leads to TypeScript errors when trying to access header properties directly as strings.
Awaiting Verification
Be the first to verify this fix
- 1
Update TypeScript Access Method
Modify the way headers are accessed in your code by using a type assertion to avoid TypeScript errors.
typescriptconst acceptHeader = (headers as AxiosRequestHeaders)['Accept']; - 2
Check for Other Header Access
Review your code for other instances where headers are accessed by name and apply the same type assertion method to those accesses.
typescriptconst contentTypeHeader = (headers as AxiosRequestHeaders)['Content-Type']; - 3
Test the Changes
Run your application and ensure that there are no TypeScript linting errors related to header access. Verify that the application behaves as expected.
bashnpm run build - 4
Update Documentation
If you maintain documentation for your codebase, update it to reflect the new method of accessing headers to assist future developers.
Validation
Confirm that the TypeScript errors are resolved and that the application functions correctly after making the changes. You can also run linting checks to ensure no new errors are introduced.
Sign in to verify this fix
Environment
Submitted by
Alex Chen
2450 rep