Protocol "https:" not supported. Expected "http:"

[richard-thai]

I’ve added MSW (v2.4.3) into our project to mock the API requests, but after doing so, I encountered the following error:

[ERR_INVALID_PROTOCOL]: Protocol "https:" not supported. Expected "http:" (see the stack trace below).

The full stack trace is attached below for reference. I’m currently using Next.js (v14.2.12) and msw (v2.4.3), and the error seems to occur when handling https requests within a Node.js environment.

Your help would be greatly appreciated. Thank you in advance for your support.

@example/web:dev: ⨯ TypeError [ERR_INVALID_PROTOCOL]: Protocol "https:" not supported. Expected "http:" @example/web:dev: at new ClientRequest (node:_http_client:183:11) @example/web:dev: at new _NodeClientRequest (webpack-internal:///(instrument)/../../packages/mock/node_modules/@mswjs/interceptors/lib/node/chunk-CVV3L375.mjs:22 9:5) @example/web:dev: at Object.interceptorsHttpRequest [as request] (webpack-internal:///(instrument)/../../packages/mock/node_modules/@mswjs/interceptors/lib/node/ chunk-CVV3L375.mjs:847:12) @example/web:dev: at eval (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/nodeHttpClient.js:199:145) @example/web:dev: at new Promise (<anonymous>) @example/web:dev: at NodeHttpClient.makeRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/nodeHttpClient.js:198:16) @example/web:dev: at NodeHttpClient.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/nodeHttpClient.js:120:36) @example/web:dev: at eval (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/pipeline.js:57:32) @example/web:dev: at Object.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/policies/logPolicy.js:31:24) @example/web:dev: at eval (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/pipeline.js:55:31) @example/web:dev: at Object.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/app-configuration/dist-esm/src/appConfigCredential.js:36:20) @example/web:dev: at async Object.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/app-configuration/dist-esm/src/internal/synctokenpolicy.js:32: 30) @example/web:dev: at async Object.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/policies/redirectPolicy.js:27:30) @example/web:dev: at async Object.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-rest-pipeline/dist/esm/policies/retryPolicy.js:39:32) @example/web:dev: at async Object.sendRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-client/dist/esm/deserializationPolicy.js:41:30) @example/web:dev: at async AppConfiguration.sendOperationRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-client/dist/esm/serviceClient.js:119:3 3) @example/web:dev: at async AppConfiguration.sendOperationRequest (webpack-internal:///(rsc)/../../node_modules/@azure/core-http-compat/dist/esm/extendedClient.js :50:24) @example/web:dev: at async eval (webpack-internal:///(rsc)/../../node_modules/@azure/app-configuration/dist-esm/src/appConfigurationClient.js:282:30) @example/web:dev: at async Object.withSpan (webpack-internal:///(rsc)/../../node_modules/@azure/core-tracing/dist/esm/tracingClient.js:39:28) @example/web:dev: at async Object.getPage (webpack-internal:///(rsc)/../../node_modules/@azure/app-configuration/dist-esm/src/appConfigurationClient.js:187:38) { @example/web:dev: digest: '3030512967', @example/web:dev: page: '/' @example/web:dev: }

[zhiyuanliang-ms]

Hi, @richard-thai Sorry for the late response. Thank you for reaching out.

Could you provide more details? If you can share your application in a repo, it will be very helpful.

I’ve added MSW (v2.4.3) into our project to mock the API requests, but after doing so,

I am not very clear about this. Could you give me more context about it please?

Are you trying to mock the App Config Service to get key value? We are using API of azure app config js sdk @azure/app-configuration. When you create an AzureAppConfigurationClient, no matter what endpoint you passed, the sdk will forward request to it. You can verify it by using a fake connection string(replacing the endpoint) and check whether the endpoint will receive your request after your call AppConfigurationClient.listConfigurationSettings()

I am also mocking app config service in this branch. If you go to see integrationTestHelper file, you can see I used a local https server and returns key values in the response.

BTW, from the error message, it seems like the root cause is from Azure JS SDK @azure/app-configuration instead of the JS provider @azure/app-configuration-provider. But I can take a look at it.

[zhiyuanliang-ms]

Hi, @richard-thai

Is there any update on this issue?