Handle Hidden Drop Down Values / Auto Suggestions using DOM Trick | EventListener

Поділитися
Вставка
  • Опубліковано 6 вер 2024
  • In this video, I have explained a DOM trick to Handle Hidden Drop Down Values / Auto Suggestions using DOM Trick with EventListener
    Schedule a meeting in case of any queries/guidance/counselling:
    calendly.com/n...
    ~~~Subscribe to this channel, and press bell icon to get some interesting videos on Selenium and Automation:
    www.youtube.co...
    Follow me on my Facebook Page:
    / naveenqtpexpert
    Let's join our Automation community for some amazing knowledge sharing and group discussion on Telegram:
    t.me/joinchat/...
    Naveen AutomationLabs Paid Courses:
    GIT Hub Course:
    naveenautomati...
    Java & Selenium:
    naveenautomati...
    Java & API +POSTMAN + RestAssured + HttpClient:
    naveenautomati...

КОМЕНТАРІ • 189

  • @bektazhibaev4479
    @bektazhibaev4479 Рік тому +46

    For those who cannot find ‘blur’ event, alternatively you can remove ones in ‘focusout’

    • @relaxsleep5148
      @relaxsleep5148 Рік тому +2

      Thanks Bek, most useful comment. I was confused as I don't have blur in my Event Listerners. I removed it from 'focusout'

    • @josephjibin4402
      @josephjibin4402 Рік тому

      Thanks....😊

    • @Irina-cw4lw
      @Irina-cw4lw Рік тому

      You really saved me, dear! I've tried so many options, but they didn't work in my case.

    • @kavyag3370
      @kavyag3370 Рік тому

      Thanks a lot, saved my day

    • @vedantraut7345
      @vedantraut7345 10 місяців тому

      Thanks bek, very useful for me as well

  • @shriniwasalle911
    @shriniwasalle911 2 роки тому +11

    This is very very useful for angular or react applications. I faced this issue lot of times, I used to do it with f8 key but now this is the coolest way you taught us. Thanks a lot man!

  • @nethajiraj8081
    @nethajiraj8081 2 роки тому +1

    Great!! But did not work for my application. Still I am not able to inspect

  • @SameerKumar-yu1xi
    @SameerKumar-yu1xi 2 роки тому +8

    You are a great boss... Whenever I face issue I feel you knew in advance and you made on exactly same topic... Respect 🤜🤛

  • @anjalijha1598
    @anjalijha1598 2 роки тому +2

    I was actually facing this issue and that too yesterday and today ur solution made my day....thank you so much sir

  • @carln22
    @carln22 Рік тому +3

    Alternative if blur is not present: focusout - same trick, remove all, worked on a react dropdown I was looking into.

  • @nayanagopinath669
    @nayanagopinath669 2 роки тому +3

    Thanks a lot Naveen for sharing this.
    These are components which goes off when focus is lost. so when we switch to developer tools , the focus is lost and the component goes off.
    In developer tools , inspect tab
    click cmd+shift+p(short cut will be different in windows OS)
    Run command focused
    Select emulate a focused page option
    now you will see the dropdown and can inspect the elements

    • @swapnilpatil2189
      @swapnilpatil2189 2 роки тому

      This helps ..removing blur is not working for me.

    • @nayanagopinath669
      @nayanagopinath669 2 роки тому

      @@swapnilpatil2189 can you pls eloborate the use case

    • @swapnilpatil2189
      @swapnilpatil2189 2 роки тому

      @@nayanagopinath669 there is dropdown in my application to select country and titles which get disappears while trying to get xpath, so as per the video i tried removing blur property from event listener but still i was not able to inspect. I tried your approach and it worked. Thanks!

    • @nayanagopinath669
      @nayanagopinath669 2 роки тому +1

      Ok understood..glad that this tip helped and worked for you.

    • @herojagadesh
      @herojagadesh 2 роки тому +1

      Thanks for the trick it worked

  • @sugumarraja550
    @sugumarraja550 10 місяців тому +2

    You have made solution for every automation issue Thanks @naveen

  • @SMSM-gd5dt
    @SMSM-gd5dt 2 роки тому +2

    One of my interview question. Thanks for the useful video .Thanks a ton from USA

  • @PJ-ev5xd
    @PJ-ev5xd Рік тому +2

    Thank you ! very useful. As a self-study, I really appreciate

  • @varunkumarreddyp5767
    @varunkumarreddyp5767 2 роки тому +1

    Your brain is like an alien Naveen. This will help a lot

  • @raghavpothineni6843
    @raghavpothineni6843 2 роки тому +2

    You are really god gift for all the QA people who is already in industry and people who are looking for job, I donot think we need to apply our brains while desgining framework or designing the scripts :) , simply coming to your channel and refer the videos and getting knowledge.
    My Request , can you please do a video on Common/reusable methods in selenium webdriver which can be accessed across the frame work, I found Common methods for Webdriverwait, type, click . Can you please do a common methods for Calender , Bootstrap dropdowns, webtables, Search functionalitys , Auto Suggestions, Take screenshots ...I hope you can do it for your students :) because it is cakewalk for you :)

  • @rakeshkumarpanda1693
    @rakeshkumarpanda1693 2 роки тому +6

    Thanks a lot Naveen for sharing this.
    We can use the below script from browser dev tool console as an alternative for the same concept
    setTimeout(function(){debugger;}, 5000)

    • @tissosweet....8638
      @tissosweet....8638 2 роки тому

      Can you elaborate on it bro? Like how to use this?

    • @rakeshkumarpanda1693
      @rakeshkumarpanda1693 2 роки тому +4

      Please open your browser dev console paste the script and hit enter. After 5 seconds the ui will freeze so that with the help of the inspector tool you can start inspecting the desired elements

    • @pimpomfossils
      @pimpomfossils 2 роки тому

      this code is a savior! even blur sometime doesn't work in salesforce , like setup dropdown.. this code works. thanks very much.

    • @adityaphadnis1551
      @adityaphadnis1551 Рік тому

      @@rakeshkumarpanda1693 Can you please tell me after opening dev tool where I have to paste this script.

    • @rakeshkumarpanda1693
      @rakeshkumarpanda1693 Рік тому

      @@adityaphadnis1551 please follow below steps
      1. Open your browser dev tool
      2. Select the console tab
      3. Paste the above code and hit enter to execute. The browser will freeze after the mentioned time period

  • @ajay_mauryaa
    @ajay_mauryaa 2 роки тому +8

    This is not working for lightning or Salesforce application.

  • @SarangHoley
    @SarangHoley 2 роки тому +3

    Thank you Naveen for this Quick video for this issue most of us face while automation 👍😊

  • @dineshkarthik5732
    @dineshkarthik5732 2 роки тому +3

    It may be small thing and this willl very useful tips to automation community..thanks naveen
    It will really helpful if you share videos on all or major expected conditions(Webdriverwait) like staleness etc. in selenium when to use

  • @automationwithwasi
    @automationwithwasi Рік тому +1

    Thanks a lot, Naveen I have been facing this issue for a long time and you gave me a solution. Hats off to you👒👒.

  • @nazimabanu4376
    @nazimabanu4376 5 місяців тому +1

    Thank you so much for sharing this helpful knowledge with us. Continue the same ❤

  • @priyankadawane4156
    @priyankadawane4156 2 роки тому +1

    it's like magic to know this trick👏👏👏 really helpful... thank you Naveen😊

  • @TEBS2006
    @TEBS2006 2 місяці тому

    Thanks Naveen. I was able to use this in my project with Angular JS drop downlist. Thank you again.

  • @SantoshShinde-vu9oo
    @SantoshShinde-vu9oo 2 роки тому +2

    we can use "Paused in debugger " In Console Run cmd : setTimeout(()=>{debugger},5000) and handle the hidden values.

  • @dhanamprakash6092
    @dhanamprakash6092 3 місяці тому

    Thank you. After struggling with this issue, your solution worked.

  • @sonalirathod9950
    @sonalirathod9950 6 місяців тому

    Hello sir, your videos are really very helpful thank you for posting such an useful content. And I really want you create one video on, when user Zoom on image at that time cursor symbol gets change and capture the element.
    is that possible to do???

  • @balajibalaji7626
    @balajibalaji7626 2 місяці тому

    Thank you so much it is very clear and easy process

  • @Maverism
    @Maverism Рік тому +1

    Thank you so much Naveen sir your trick is working wonders for me forever grateful to you...

  • @vishaldeshpa
    @vishaldeshpa 17 днів тому

    Thanks Naveen sir it’s worked for me

  • @ravi_pualasa
    @ravi_pualasa Рік тому +1

    1st collapse all the elements inside the body block and keep the body tag expanded
    2nd click on you element where the disappearing elements is enabling
    3rd while 2nd step note which is the parent tag of your web element
    4th after that, right click on parent tag and click on Break on > subtree modification
    5th again try to access element that opens the disappearing value. And access the elements

  • @sanketdeshpande9242
    @sanketdeshpande9242 9 місяців тому +1

    Thank you very much sir!
    This is very useful and informative tip.

  • @yerrasaimanojkumar6529
    @yerrasaimanojkumar6529 2 роки тому

    Thank You Naveen....It is quite difficult to go with DOM BreakPoints...Now It is easy with this trick...😊

  • @madhuribramhe3248
    @madhuribramhe3248 2 роки тому +1

    Thank yo so much ..i was so stuck bcz of this issue... completely helpful!

  • @tanunjoyroy799
    @tanunjoyroy799 Рік тому +1

    In my case, I had to also remove the focusout property along with blur in order to inspect the suggestive list.

  • @ujjalsaha2899
    @ujjalsaha2899 2 роки тому

    Thanks Naveen … these simple automation tricks makes life easier… previously i used to open debugger for it…now this will help a lot!

  • @shivapolaki2024
    @shivapolaki2024 9 місяців тому

    You are the best in explaining testing topics. Very helpful

  • @amitturkar7144
    @amitturkar7144 2 роки тому

    Thank you so much Naveen for this trick. I was struggling for such drop down since last 1 week. I will try like this and will let you know.

  • @semcodynamics7299
    @semcodynamics7299 9 місяців тому +1

    Thank you this has been extremely helpful!

  • @abhishekvats6519
    @abhishekvats6519 2 роки тому +1

    Hi Naveen, thanks for sharing this. But it is not working in my case, I deleted the blur property as well but the moment I tried to inspect the element, the same has been selected. Please let me know if you know some other way

  • @ABAutomationHub
    @ABAutomationHub 2 роки тому +1

    Thanks for creating video on this.. It’s very useful and will make the life easier.. Great Job 👏👏

  • @81sinnombre
    @81sinnombre 2 роки тому +1

    What I regularly do is in console ... setTimeout(()=>{debugger},8000) and quickly click the dropdown and wait 8 seconds

  • @lightbluesquarejelly3806
    @lightbluesquarejelly3806 Рік тому +1

    Awesome!!

  • @shoshKid
    @shoshKid 2 роки тому +1

    Thanks a lot Naveen, we appreciate you buddy.

  • @andadana799
    @andadana799 2 роки тому +1

    very good. congratulations.

  • @siramnymisha3873
    @siramnymisha3873 2 роки тому +2

    Hey Naveen, Hope you are doing good☺️. After watching your videos I am greatly interested towards testing now a days. Actually I am working in SAP ABAP area. I want a small suggestion from you, if I want to take a swap to automation can you recommend me which one I can start learning with... which have good scope and offer a good package... because I am greatly confused as I am not having any experience towards this area...
    Your videos are really interesting☺️ Thank you for all your efforts for sharing your knowledge with us without cost which is greatly appreciable🤩 new subscriber🤙🥳
    Looking forward for your suggestion. Thank you in advance🙂

  • @Irina-cw4lw
    @Irina-cw4lw 2 роки тому +1

    Amazing! Thanks for sharing 🙏

  • @anuragmishra7243
    @anuragmishra7243 2 роки тому

    Hi Naveen,
    Thank you so much for the awesome help.
    Can you please suggest something to Automate Mobile App Drop Down?

  • @shwetabhsrivastava5398
    @shwetabhsrivastava5398 2 роки тому +1

    Awesome trick ...hats off

  • @ashishsahu8065
    @ashishsahu8065 Рік тому

    This is very useful video. Thank you so much for such amazing videos.

  • @sun4os
    @sun4os Рік тому +1

    very useful explanation

  • @sarashaikh6729
    @sarashaikh6729 11 днів тому

    Hi sir ,how to select option(e.g.Ahmedabad) from a list without using select method? Thanks.

  • @mnandarao
    @mnandarao 2 роки тому

    Hi Naveen, Hope you are doing good, This trike is very useful and I tried to use it but it's not working in my application can you please share any workaround it

  • @user-nj1by5oo4z
    @user-nj1by5oo4z 9 місяців тому

    Thankyou So much sir it was very helpful to me..

  • @mrindian7422
    @mrindian7422 11 місяців тому +1

    Thank you so much ❤

  • @mohammedshahab6095
    @mohammedshahab6095 2 роки тому

    You solved my problem. Thank you very much.

  • @madhvikumari3279
    @madhvikumari3279 4 місяці тому

    Thank you for amazing information.

  • @vishalavishala1883
    @vishalavishala1883 Рік тому

    You are Awesome ....Thanks for all Gyan

  • @kdm3587
    @kdm3587 6 місяців тому

    You're the best, thanks a lot, man!

  • @ansonsaverdsouza8165
    @ansonsaverdsouza8165 11 місяців тому +1

    Thank you so much

  • @nazarmocherniuk3249
    @nazarmocherniuk3249 Рік тому +1

    Thank you!

  • @madhvikumari3279
    @madhvikumari3279 Рік тому

    This video is very helpful...
    Thanks!

  • @mohamedilyas8610
    @mohamedilyas8610 2 роки тому

    That's why you are awesome naveen!..

  • @indiatouronbicycle8252
    @indiatouronbicycle8252 Рік тому

    Thanks for videro make more such type of video.

  • @mohammedakheeb7724
    @mohammedakheeb7724 2 роки тому

    Thank you Naveen this was very helpful...

  • @PraveenKumar-bw5fo
    @PraveenKumar-bw5fo 2 роки тому +1

    Thank you for info

  • @sidharthkumar1833
    @sidharthkumar1833 6 місяців тому

    Sir pls tell, how to inspect "camera & accerlaries " under Electrons dropdown??????????

  • @shajeeprajeeth9544
    @shajeeprajeeth9544 7 місяців тому

    🎉🎉 Tnk u so much buddy 😎

  • @amankumarsrivastava5227
    @amankumarsrivastava5227 2 роки тому

    Thanks a lot sir, it is very easy, have one more way, will share i.e. something we can do through console

  • @hardikguliani2482
    @hardikguliani2482 Рік тому

    Thankyou Very Much

  • @rajukiran5290
    @rajukiran5290 2 роки тому

    Thank you Naveen for this video

  • @namratasingh3464
    @namratasingh3464 Рік тому

    Hi Naveen, thanks your videos are really helpful!
    I have a query, in which when I am clicking on a button it is giving me one id, then have to wait overnight, and then next day login on the other URL where this id will have few account numbers and other data which I have to verfiy. but waiting overnight is must for data to generate , How this can be managed using Selenium ?

  • @KiddoTrekAdventures
    @KiddoTrekAdventures 10 місяців тому

    Nice trick thanks

  • @aniruddhanaik4671
    @aniruddhanaik4671 Рік тому

    Hi I am also facing the same issue of hidden value i cant identify the element .Like you said in the video delete 3 items from blur if it is not then focusout that too is not present can you suggest something else

  • @muzak_nat
    @muzak_nat Місяць тому

    Can someone explain how he captured that xpath - Contains?

  • @amitk6463
    @amitk6463 2 роки тому

    @Naveen AutomationLabs Another trick is when the list appeared, press tab key manually to reach inspect button and hit enter key. You will find element source code without disabling blur property for those objects....

    • @naveenautomationlabs
      @naveenautomationlabs  2 роки тому

      This won't work if you have many elements on the page like Flipkart or Amazon. In fact if you try the same on Flipkart and moving manually to inspect icon and press enter. List is getting disappeared.

    • @amitk6463
      @amitk6463 2 роки тому

      @@naveenautomationlabsTrue, for multiple elements it becomes difficult..

  • @douglasfugazi
    @douglasfugazi 2 роки тому

    Awesome tip, thanks for sharing 👏

  • @bushrachowdhury278
    @bushrachowdhury278 2 роки тому

    Thank you a lot Naveen.

  • @ashishsaxena5587
    @ashishsaxena5587 2 роки тому +1

    Great

  • @bhaveshchiplunkar8437
    @bhaveshchiplunkar8437 2 роки тому

    Thank you.. very helpful!!

  • @Rohan269503
    @Rohan269503 Рік тому

    Helpful THanks a lot

  • @pulkitsachdevashorts8770
    @pulkitsachdevashorts8770 2 роки тому

    Thank You Naveen.

  • @rajdakash
    @rajdakash 2 роки тому

    quick and crisp 👍🏻

  • @savinashab8935
    @savinashab8935 Рік тому

    Thank you. It worked

  • @bharatheBha0526
    @bharatheBha0526 2 роки тому

    Perfect Naveen..

  • @vipan16
    @vipan16 2 роки тому

    Can you make videos on Linux . I believe Linux becoming more powerful to automate in USA . I believe you should start making videos on LINUX which will help many people .

  • @sahani7015
    @sahani7015 2 роки тому

    I thought Ctrl+shift+C shortcut will work here but it didn't. Thank for the video sir.

  • @Indian-hq4ts
    @Indian-hq4ts Рік тому

    Hi Naveen what if no blur is not available?

  • @Anup_x
    @Anup_x 2 місяці тому

    He, I'm trying this on my test site but it's not working. Is there any other ways to do this?

  • @deepakverma-dc4ex
    @deepakverma-dc4ex 2 роки тому

    Thanks Naveen. I use to do driver.pagesource() or debugger() in browser's console to perform the same

  • @harshalgoswami5294
    @harshalgoswami5294 11 місяців тому

    Too good. 😇

  • @CuriousVivek
    @CuriousVivek Рік тому

    Nice

  • @anilkumaryadav106
    @anilkumaryadav106 2 роки тому

    Hi Naveen, Selenium is not able to automate the pages having intermediate redirection pages.
    Page 1> Page2> Page 3
    Selenium is able to go up to page 2 URL only.
    What to do, please help.

  • @JohnnyBikerOfficial
    @JohnnyBikerOfficial 2 роки тому

    Hi Naveen can you help to select from that more dropdown in flipkart I am giving the xpath right but elements list is not getting any entry size is still 0.

  • @rajia3455
    @rajia3455 Рік тому

    I need same question for Appium. I need to get data from drop-down of 10 values. I used Select class. But, it get the text of only visible text, it is not getting last 2 values because of hidden by scrolling. Please give me solution for Appium

  • @anurajms
    @anurajms 8 місяців тому

    thanks you

  • @madhusudhanreddy5320
    @madhusudhanreddy5320 2 роки тому

    Excellent man

  • @TrustTheTimingOfYourLife
    @TrustTheTimingOfYourLife Рік тому

    In my case, i could not able to find BLUR property itself in the Event Listener and its not at all visible. Please suggest alternative solution for this.

  • @sureshgarine
    @sureshgarine 2 роки тому

    thank you Naveen

  • @naveenkumar-yd3ln
    @naveenkumar-yd3ln 2 роки тому

    Excellent

  • @ParasJoshiPj
    @ParasJoshiPj 2 роки тому

    Thank you nvin..

  • @ParasJoshiPj
    @ParasJoshiPj 2 роки тому

    Hi navin..i have only one property in blur.I have removed that still it is not working pls help

  • @venkataashok5968
    @venkataashok5968 Рік тому

    It is not working with under electronics dropdown list, can u pls tell me how to handle those

  • @bhavyagowda8116
    @bhavyagowda8116 Рік тому

    how to send json data for json editor text box using webdriverio, I have tried with many methods , not working anything... In ui there is json editor text box, save button so i need to send some json data in editor text box