How to click on dynamic button using selenium Python?-CodePudding

I am using Selenium Python and trying to access one of the dynamic created buttons which have same names and no ID.

By.XPATH and By.CLASS_NAME not working here. Any suggestions how can I click on this.This is the button I want to click

This is how I am trying

btn=WebDriverWait(driver, 5).until(EC.element_to_be_clickable((By.XPATH, '//*[@id="BsGnbProv"]/div[1]/div[13]/div[2]/div[3]/div[3]/button[2]')))

This is xPath

//*[@id="BsGnbProv"]/div[1]/div[13]/div[2]/div[3]/div[3]/button[2]

This is Button element details

    <button  data-bind="disable: 
          false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" 
        style="white-space: normal;">
        <span >
        </span>
        <span>View Configuration</span>
        </button>

This is the html of this div containing all buttons

<div data-bind="visible: GeneralProperties.NfCount() > 0, css: { 'bs-inactive': $root.IsInactive }" data-csv-category="Network Function Properties" ><div ><label>Network Function Properties</label></div>
        <div >
            <div >
                <div >
                    <label  data-placement="top" data-toggle="tooltip" style="text-decoration: underline;" title="" data-original-title="Function Type">Function Type</label>
                </div>
                <div >
                    <label  data-placement="top" data-toggle="tooltip" style="text-decoration: underline;" title="" data-original-title="Managed Element ID">Managed Element ID</label>
                </div>
            </div>
            <!-- ko with: GeneralProperties.PuProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" >
        <div >
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="xPU">xPU</label>
        </div>
        <div >
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="EAB8620065F0">EAB8620065F0</label>
        </div>
        <div >
            <button  data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span ></span>
            <span>Edit Configuration</span></button>
            <button  data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span ></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.CuCpProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" >
        <div >
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CU-CP">CU-CP</label>
        </div>
        <div >
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CUCP-at2200-eab8620065f0-1">CUCP-at2200-eab8620065f0-1</label>
        </div>
        <div >
            <button  data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span ></span>
            <span>Edit Configuration</span></button>
            <button  data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span ></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.CuUpProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" >
        <div >
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CU-UP">CU-UP</label>
        </div>
        <div >
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CUUP-at2200-eab8620065f0-1">CUUP-at2200-eab8620065f0-1</label>
        </div>
        <div >
            <button  data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span ></span>
            <span>Edit Configuration</span></button>
            <button  data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span ></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.DuProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" >
        <div >
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="DU">DU</label>
        </div>
        <div >
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="DU-at2200-eab8620065f0-1">DU-at2200-eab8620065f0-1</label>
        </div>
        <div >
            <button  data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span ></span>
            <span>Edit Configuration</span></button>
            <button  data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span ></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.RuProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" >
        <div >
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="RU">RU</label>
        </div>
        <div >
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="RU-at2200-eab8620065f0-1">RU-at2200-eab8620065f0-1</label>
        </div>
        <div >
            <button  data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span ></span>
            <span>Edit Configuration</span></button>
            <button  data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span ></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
        </div>
    </div>

CodePudding user response：

@Atif, thanks for the detail HTML. Can you try the following XPath:

//button/span[text()='View Configuration']

This will give you the five buttons and then you can take action accordingly. I tried this and it is working fine.