samedi 29 août 2020

How to set up a test in jest to check for existence of elements with specific data attributes in dom

Im testing my javascript class with jest, here's the relevant part of the class :

class ContentEditable {
  constructor(editableKind){
    this.editables =  document.querySelectorAll(`[data-editablekind='${editableKind}']`);
    this.editionStrategy = this.getStrategy(editableKind)
  }
}

In the test Id like to check that this.editables is returning the right stuff (a Nodelist of the right size). So the idea behind the test is to create a div with the right attribute then instanciate the class and check for the length of editables

test('editables of kind text', () => {
  let element = document.createElement("div");
  element.dataset.editablekind = 'text'
  console.log(element.dataset.editablekind)
  const contentEditable = new ContentEditable('text')
  expect([...contentEditable.editables].length).toEqual(1);
});

However contentEditable.editables seems to stay empty whatever I do. What am I missing here ?

Aucun commentaire:

Enregistrer un commentaire