I'm trying to query a complex web app for some data...

A very simplified example is the below

<section class="Test newTest testTest active">
  <div>
   </div>
   <a class="classLink1 classlink2 classlink3" data-render="test">Link</a>
   </div>
  </div>
</section>

<section class="Test newTest testTest">
  <div>
   </div>
   <a class="classLink1 classlink2 classlink3" data-render="test">Link</a>
   </div>
  </div>
</section>

Problem

• There are a few <a> tags with very similasr class names and some dataset with unique values which I don't want to query
• I'm trying to only target the <a> tag where the parent <section> has an .active class. But it may not be the immediate parent if that makes sense

I am trying something like this

document.querySelectorAll('section.Test.newTest.testTest.active a.classLink1.classlink2.classlink3 [data-render="test"]')

But it seems to return an empty nodelist.