html-element-attribute-missing

Try in Playground

javascript-templates

Julien DelangeBest PracticeInformational

No tags

No CWE or CVE

Simple template to check HTML elements.

More information:

Ast Rule: html element

html-element-attribute-missing

How to write a rule

// See https://doc.codiga.io/docs/rosie/ast/javascript/rosie-ast-javascript-htmlelement/
function visit(node, filename, code) {
  // Check only <ul> elements
  if(node.tag && node.tag.value === "ul") {
    // check that we have attributes
    if(node.attributes && node.attributes.length > 0){
      if(node.attributes && node.attributes.filter(a => a.name && a.name.value && a.name.value === "aria-label").length === 0) {
        const error = buildError(node.tag.start.line, node.tag.start.col, node.tag.end.line, node.tag.end.col, "should have aria-label", "CRITICAL", "SAFETY");
        addError(error);
      }

    }
  }
}

mycomponent.jsx

Expected test result: has error

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <ul 
        id="my-awsome-stuff"
        className="myclass"
        data-object-type="object-type"
        data-object-id="object-id"
        role="group">
      </ul>
    );
  }
}

Add comment

Be the first one to leave a comment!