Company logo
  • Empleos
  • Bootcamp
  • Acerca de nosotros
  • Para profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
    • Bootcamp
  • Para empresas
    • Inicio
    • Nuestro proceso
    • Planes
    • Pruebas
    • Nómina
    • Blog
    • Calculadora

0

89
Vistas
querySelector returns blank node in HTML DOM

I have a HTML document with following tags with multiple occurance

<div _ngcontent-mjy-c67="" uipath_custom_id="13">
    <div _ngcontent-mjy-c67="" class="col-xs-12 col-sm-6 col-md-4 col-lg-3" uipath_custom_id="12">
        <button _ngcontent-mjy-c67="" role="button" data-toggle="tooltip" data-placement="top" class="btn btn-default flag-item" title data-original-title="Allowed to log into the Main Tools." uipath_custom_id="11">
            <span _ngcontent-mjy-c67="" class="glyphicon glyphicon-ok">
                ::before::
            </span>
            <!---->
            "Admin" 
        </button>
        <!---->
    </div>
    <!---->
</div>

There are total 112 buttons present in the document with

class="btn btn-default flag-item"

I want to select a particular button with

data-original-title="Allowed to log into the Main Tools."

using javascript and click the button.

I have tried using querySelectorAll but couldn't find a solution to do it.

 document.querySelectorAll('button.btn.btn-default.flag-item')

The above code returns all the 112 elements but how to use selector to select only button with

data-original-title="Allowed to log into the Main Tools."

attribute?

Also I have tried using

document.getElementsByClassName('btn btn-default flag-item')

which also returns 112 elements but can not proceed further using querySelectorAll on that.

Note: I need to call this script from UiPath, so one-liner script is much appreciated.

Using the copy JS Path in Chrome I found

document.querySelector("body > app-root > app-shell > app-dashboard > div > div.dashboard-widgets > div.app-privileges-widget.col-md-6.widget-new-line > app-widget-container > div > div.collapse.in > div > app-privileges-widget > app-privileges-grid > div > div:nth-child(2) > div:nth-child(3) > div > button").click()

and it works perfectly, but I don't know whether this path is always correct as the page I'm trying to automate is a dynamic page and elements gets created dynamically. So if this path works for a certain user, may be this path will not be valid for other users.

Please help.

7 months ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

By using the attribute selector:

console.dir(document.querySelector('[data-original-title="Allowed to log into the Main Tools."]'))
<div _ngcontent-mjy-c67="" uipath_custom_id="13">
    <div _ngcontent-mjy-c67="" class="col-xs-12 col-sm-6 col-md-4 col-lg-3" uipath_custom_id="12">
        <button _ngcontent-mjy-c67="" role="button" data-toggle="tooltip" data-placement="top" class="btn btn-default flag-item" title data-original-title="Allowed to log into the Main Tools." uipath_custom_id="11">
            <span _ngcontent-mjy-c67="" class="glyphicon glyphicon-ok">
                ::before::
            </span>
            <!---->
            "Admin" 
        </button>
        <!---->
    </div>
    <!---->
</div>

7 months ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar empleo Planes Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2023 PeakU Inc. All Rights Reserved.