HttpParams : Handling of null & undefined values

[chrish619]

I'm submitting a...

[ ] Regression
[x] Bug report
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request

Current behavior

new HttpParams().set('arg', null).toString(); // "arg=null"
let a = {};
new HttpParams().set('arg', a.any).toString(); // "arg=undefined"

Expected behavior

new HttpParams().set('arg', null).toString(); // "arg="
let a = {};
new HttpParams().set('arg', a.any).toString(); // "arg="

Minimal reproduction of the problem with instructions

https://github.com/angular/angular/blob/master/packages/common/http/src/params.ts#L57
This is due to the underlying encodeURIComponent return string literals for "null" or "undefined";

(edited) Plnkr replication : https://embed.plnkr.co/k5naIib3sGADM91UZ31a/

What is the motivation / use case for changing the behavior?

This has mostly arisen due to HttpClient, and replacement of URLSearchParams, with HttpParams

Is this an intended behaviour, or does this require a fix? e.g.

• null and undefined are converted to ""? or;
• null is "", and undefined is thrown?

I appreciate these are not intended as direct replacements, and you can create your own HttpParameterCodec, but this seems like an unintended operation.

Environment

Angular version: 4.3.3

Browser:
- [x] Chrome (desktop) version 60.0

[robwormald]

This is the intended behavior, I believe, as it tracks the behavior of the native-standard - https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams

let q = new URLSearchParams();
q.append('x', null);
q.append('y', undefined);
q.append('z', '');

q.toString(); // x=null&y=undefined&z=

Since there's no way to encode a null/undefined value to a string, the behavior is sort of undefined :) - best to pass an empty string if that's what you want to send.

[alxhub]

Also, note that the signature of .set() for example does not allow null or undefined for the value to set, so your reproduction would not compile under strictNullChecks.

[pavel-blagodov]

Try this example written in ES5. It uses correct application/x-www-form-urlencoded encoding algorithm since encodeURIComponent works in accordance with https://www.w3.org/TR/html5/forms.html#url-encoded-form-data

var MyHttpUrlEncoder =
      ng.core.Class({
        extends: ng.common.http.HttpUrlEncodingCodec,
        constructor: function () {},
        encodeKey: function (k) {
          return encodeURIComponent(k);
        },
        encodeValue: function (v) {
          return encodeURIComponent(this.serializeValue(v));
        },
        serializeValue: function (v) {
          if (_.isObject(v)) {
            return _.isDate(v) ? v.toISOString() : JSON.stringify(v);
          }
          if (v === null || _.isUndefined(v)) {
            return "";
          }
          return v;
        }
      });

then

new ng.common.http.HttpParams({encoder: new MyHttpUrlEncoder()}).set("a", null).toString();
//"a="

[ChrisDevinePimss]

Didn't the old one allow to pass nulls/undefined and it would not put them in the query string.

I only noticed because iv recently updated to use HttpClient and found this change in functionality has broken a lot of services.

[Avien]

I agree, the set method used to ignore null/undefined values

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}