Trim is not a function in Protractor

Question

I am having trouble trimming a result in Protractor to then pass into an array. The field in question contains a string that will form a JSON object.

I pass into the field element(by.id(fieldName2)).sendKeys('{"Name":"JoeNew"}');.

This is then pushed into an array with browser.params.newValues.push(element(by.id(fieldName2)).getAttribute('value'));. Resulting in // {"Name":"JoeNew"} being stored in the array.

I then reload the page and check that the content of that field is indeed what I wanted to store, but because it is JSONified it will come back as:

{
    "Name":"JoeNew"
}

To compare the two I need to trim() this so that it reverts back to {"Name":"JoeNew"} for the purposes of comparison.

browser.params.updatedValues.push(trimResult(element(by.id(fieldName2)).getAttribute('value')));

function trimResult(toTrim) {
    return toTrim = toTrim.trim();
};

Is sadly returning Failed: toTrim.trim is not a function. I am however able to perform similar tasks to other field types like Date.parse(date) etc without issue.

Can anyone help?

EDIT:

The promises are resolved to compare the two arrays with the following:

protractor.promise.all(browser.params.updatedValues).then(function (resolvedValues) {
    console.log(resolvedValues);
    browser.params.updatedValues = resolvedValues;

    expect(browser.params.updatedValues).toEqual(browser.params.newValues);
});

Answer 1

getAttribute() function in protractor returns the value in the form of promise, so in order to use trim(), you should get the value first and then perform the operation. Here's how -

browser.params.updatedValues.push(trimResult(element(by.id(fieldName2)).getAttribute('value')));

function trimResult(toTrim) {
    return toTrim.then(function(val){
        return val.trim();
    });
};

---

EDIT: However the push() function doesn't wait for the promise from trimResult() function to be returned. Here's a sample on how you can push the values -

element(by.id(fieldName2)).getAttribute('value').then(function(val){
    browser.params.updatedValues.push(val.trim());
});

OR

trimResult(element(by.id(fieldName2)).getAttribute('value'));

function trimResult(toTrim) {
    toTrim.then(function(val){
        browser.params.updatedValues.push(val.trim());
    });
};

Hope it helps.