Ytukyg

My XML doc is stored like this ...

<testsuite errors="0" failures="1" skipped="1" passed="1" tests="3">

    <testcase classname=postAPI name="Validate POST API" status="tested"<PASS/>>

    <testcase classname=getAPI name="Validate GET API" status="tested"<FAIL/>>

    <testcase classname=deleteAPI name="Validate DELETE API" status="untested"<SKIP/>>

   </testcase>

</testsuite>

I need to have a HTML document which needs to read the above XML file and I need to have the log output here in the HTML format so that the browser displays like this ...

TestCaseFeature TestCaseName TestCaseSTATUS

postAPI Validate POST API PASS

getAPI Validate GET API FAIL

deleteAPI Validate DELETE API SKIP

How can I have such a result via HTML ?

Here's an answer with the XML document I added

<testsuite errors="0" failures="1" skipped="1" passed="1" tests="3"> 

    <testcase classname="postAPI" name="Validate POST API" status="tested" pass="true"></testcase>

    <testcase classname="getAPI" name="Validate GET API" status="tested" pass="skip"></testcase>

    <testcase classname="deleteAPI" name="Validate DELETE API" status="untested" pass="false"></testcase> 

</testsuite>

You require javascript to open XML Documents

let readXMLFile = (url) => {

    let xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {

        if (this.readyState == 4 && this.status == 200) {

            document.body.innerHTML += "TestCaseFeature TestCaseName TestCaseSTATUS";

            for (let i = 0; i < xhttp.responseXML.getElementsByTagName('testcase').length; i++) {

                let el = xhttp.responseXML.getElementsByTagName('testcase')[i];

                let cname = el.attributes.classname.value;

                let n = el.attributes.name.value;

                let status = el.attributes.status.value;

                let pass = el.attributes.status.value;

                if (typeof pass == 'boolean') {

                    if (pass) {

                        pass = "Pass";

                    } else {

                        pass = "Fail";

                    }

                }

                let newEl = document.createElement('p');

                newEl.innerHTML = `${cname} ${n} ${pass}`;

                document.body.appendChild(newEl);

            }

        } else if (this.readyState == 4 && this.status == 404) {

            document.body.innerHTML = "404 Page Not Found";

        } else if (this.readyState == 4) {

            document.body.innerHTML = "An unexpected error occured! Page is loaded but cannot be sent. Contact us for help.";

        } else {

            document.body.innerHTML = '404 Page NOT Found or some other error has occured';

        }

    }

    xhttp.open("GET", url, true);

    xhttp.send();

}

Hope this helps!
Here's my page that loads it
https://darkheart527.github.io/domain/XMLTestingPage/myFirstRequestWithAJAX.html
Source Code
https://github.com/DarkHeart527/domain/tree-save/gh-pages/XMLTestingPage/myFirstRequestWithAJAX.html