javascript - Protractor custom locator fails to locate the element -

i have added custom data attribute elements need identify , interact using protractor. attribute data-test-id. created custom locator in onprepare callback in conf.js detect element. below:

onprepare: function () {     by.addlocator('testid', function(value, parentelement) {       parentelement = parentelement || document;       var nodes = parentelement.queryselectorall('[data-test-id]');       return array.prototype.filter.call(nodes, function(node) {         return (node.getattribute('[data-test-id]') === value);       });     });   } 

my angular app has h1 text home inside it. added data-test-id attribute it:

<h1 data-test-id="test-element">home</h1> 

here protractor test:

test.js:

describe('navigate website.', function() {     it('should have heading home', function() {         browser.get('http://localhost:8888/#/');         browser.waitforangular();          var textvalue = 'home';         var heading = element(by.testid('test-element'));          expect(heading.gettext()).toequal(textvalue);     }); }); 

conf.js:

exports.config = {   //directconnect: true,   seleniumaddress: 'http://localhost:4444/wd/hub',   // capabilities passed webdriver instance.   capabilities: {     'browsername': 'chrome'   },    // spec patterns relative current working directly when   // protractor called.   specs: ['test.js'],    // options passed jasmine-node.   jasminenodeopts: {     showcolors: true,     defaulttimeoutinterval: 30000   },    onprepare: function () {     by.addlocator('testid', function(value, parentelement) {       parentelement = parentelement || document;       var nodes = parentelement.queryselectorall('[data-test-id]');       return array.prototype.filter.call(nodes, function(node) {         return (node.getattribute('[data-test-id]') === value);       });     });   } }; 

when run sample test, following error:

1) navigate website. should have heading home
message: nosuchelementerror: no element found using locator: by.testid("test-element")

what doing wrong? how can fix issue , work?

when getting attribute, should ask data-test-id instead of [data-test-id]. looks copy-paste error.

replace:

return (node.getattribute('[data-test-id]') === value); 

with:

return (node.getattribute('data-test-id') === value);