html5lib dart. Query by class-selector throw exception

Question 1

Full CSS selector matching has not been implemented yet.

Depending on your use case, you may be able to match on the type (tag name), and then filter the results using the Element's class attribute.

Here is an example of how to do that:

  var el = doc.queryAll('div').where((el) => 
      el.attributes.keys.contains('class') &&
        el.attributes['class'].split(' ').contains('nav')).first;

Hopefully someone will implement the query selector matching support soon - because this work around is very inefficient for documents with a lot of div tags.

Another solution is to do your own traversal - something like this:

queryClass(Node element, String className) {
  for (var node in element.nodes) {
    if (node is! Element) continue;
    if (node.attributes.keys.contains('class') 
        && node.attributes['class'].split(' ').contains(className)) {
      return node;
    }
    var result = queryClass(node, className);
    if (result != null) return result;
  }
  return null;
}

main() {
   var doc = parse(...);
   var el = queryClass(doc, 'nav');
   print(el);
}

Question 2

Looking through the code of the html5lib parser, you can see that the query function is working only for type selector (such as: div, head, etc). There is a comment in the source code stating that and, also, the exception thrown is quite explicit.

Probably a solution for your case would be to use queryAll method to return all divs and iterate through them until you find the one (or the ones) that have the respective class. I know it's by far not the ideal solution, but it might work.

Hope it helps!