Inserting test id for div class in a-tag

I am trying to test an application by add data-test-id to the classes. But test ids does not appear in the application when viewed in dev tools. Hence I am unable to select the figure-content class.What am I missing.

Template.hbs

<div class="gradient-overlay" data-test-id ="gradient-overlay-key"></div>

    <div class="figure-content">
        <div class="top">
        </div>
        <div class="bottom" >
            
                <h4 class="truncate" data-test-id="figures-truncate-id"></h4>
            
                <h4 class="truncate" data-test-id="figures-truncate-id">New Figure</h4>
            
            <div class="divider"></div>
            <p>Perspective</p>
        </div>
    </div>