matomo/tests/javascript/content-fixtures/findContentNodesTest.html

<div>
    <img id="ex1" src="img-en.jpg" data-track-content/>
    <img id="ex2" src="img-en.jpg" class="piwikTrackContent"/>
    <!-- used for testing detection of content elements via attribute -->
    <div id="ex3" data-track-content>
        <img src="http://www.example.com/path/xyz.jpg" data-content-piece />
        <a href="/anylink" data-content-target>Add to shopping cart</a>
    </div>
    <!-- used for testing detection of content elements via class -->
    <div id="ex4" data-track-content>
        <img src="http://www.example.com/path/xyz.jpg" class="matomoContentPiece" />
        <a href="/anylink" class="matomoContentTarget">Add to shopping cart</a>
    </div>
    <!-- used for testing detection of attribute takes precendency over CSS-->
    <div id="ex5" data-track-content>
        <span src="http://www.example.com/path/xyz.jpg" class="piwikContentPiece">Piece with class</span>
        <span src="http://www.example.com/path/xyz.jpg" data-content-piece>Piece with attribute</span>
        <a href="/anylink" class="piwikContentTarget">Target with class</a>
        <a href="/anylink" data-content-target>Target with attribute</a>
    </div>
    <!-- used for testing always the first matching one will be picked if many have same class -->
    <div id="ex6" data-track-content>
        <span src="http://www.example.com/path/xyz.jpg" class="matomoContentPiece">Piece with class1</span>
        <span src="http://www.example.com/path/xyz.jpg" class="matomoContentPiece">Piece with class2</span>
        <a href="/anylink" class="matomoContentTarget">Target with class1</a>
        <a href="/anylink" class="matomoContentTarget">Target with class2</a>
    </div>
    <!-- used for testing always the first matching one will be picked if many have same attribute -->
    <div id="ex7" data-track-content>
        <span src="http://www.example.com/path/xyz.jpg" data-content-piece>Piece with attribute1</span>
        <span src="http://www.example.com/path/xyz.jpg" data-content-piece>Piece with attribute2</span>
        <a href="/anylink" data-content-target>Target with attribute1</a>
        <a href="/anylink" data-content-target>Target with attribute2</a>
    </div>
</div>