element.getAttribute('value') returns null in Protractor - protractor

Question

element.getAttribute('value') returns null in Protractor, although in source code the value details are present.
Below is my code,
console.log(await this.textArea.getAttribute('value'));
Source code image
I read other posts around the same issue, but those are old and no solution is working for me. I also tried for entering input with browser.actions().click(element).sendKeys('input').perform(); thinking of it could be sendKeys() API issue but still no luck.
And the same code "element.getAttribute('value')" was working perfectly fine till 1st June 2021 and suddenly returning null value, not sure if there are any code changes or compiler version needs to be updated?

Answer 1

This is not an answer to the question but found the root cause that the latest Chrome version 91.0.4472.77 is having an issue with the element.getAttribute('value') method. It is also giving an issue with Full calendar angular component https://github.com/fullcalendar/fullcalendar/issues/6343
I'm able to run my tests on Microsoft Edge Version 91.0.864.37 browser

Answer 2

Solved
I found a temp workaround that just worked with chrome 91.0.4472.114 on mac
The problem described here is actually a bug in chromedriver https://bugs.chromium.org/p/chromium/issues/detail?id=1205107 so it is not Protractor problem only
While it's being worked on, you can use chromedriver version 90. Works like a charm. The latest version available is here https://chromedriver.storage.googleapis.com/LATEST_RELEASE_90.0.4430
You can downgrade chromedriver by running this command
webdriver-manager update --gecko=false --versions.chrome 90.0.4430.24
Note sometimes you have global, project local and Protractor specific installations of webdriver-manager. The command I gave will install chromedriver globally. In order to install locally you need to find the path to your webdriver-manager and run command like this
node ./node_modules/protractor/node_modules/webdriver-manager update --gecko=false --versions.chrome 90.0.4430.24
And some of you may need to run command in sudo mode. Keep it in mind

Answer 3

What is the ETA on this fix? By the way the below solution works:
Step1: Uninstall the current chrome version 91.0.4472.101
Step2: Download the chrome version 90.0.4430.72 & Install it
Step2a: Download chrome from here >> https://www.filepuma.com/download/google_chrome_64bit_90.0.4430.72-28425/
Step2b: Disable chrome auto update by delete the file (GoogleUpdate.exe) from this path: C:\Program Files (x86)\Google\Update
Step3: Delete the current all chrome driver package
a. Delete all chrome files from this path: C:\Users\admin\AppData\Roaming\npm\node_modules\protractor\node_modules\webdriver-manager\selenium
Step4: Downgrade the chrome driver package by running below command in cmd
webdriver-manager update --versions.chrome 90.0.4430.24

Answer 4

It is happening from today for us. element.getAttribute is working for attribute "type" but not for "value" and a few other attributes like "outerHTML" etc. Ours is also a stable code (frozen around Feb 2021).
We were able to resolve this by adding w3c:false in chromeoptions.

Answer 5

I followed another workaround.
Go to google chrome and open developer tool
Identify element using CSS and get value of element in your developer console as below.
$("input[data-bind *='selectedParentKpi']")[0].value
3.Get data from your protractor using javascript
browser.executeScript("return $(\"input[data-bind *='selectedParentKpi']\")[0].value").then(function (data1){
cb();
})

Answer 6

You don't need to downgrade. Some answers are close but you can just pass in a protractor element like this.
const value = await browser.executeScript("return arguments[0].value", myElement);