Behat tests broken in v1.4.0 #318

Activity

1. stof commented on Mar 20, 2020

   

   stof

   on Mar 20, 2020

   Member

   More actions

   Can you share a reproducing case ?
2. athanro commented on Mar 20, 2020

   

   athanro

   on Mar 20, 2020

   Author

   More actions

   Can't share url, but can this html

   <div class="ant-input-wrapper ant-input-affix-wrapper open-select arrow">
       <input id="product" class="ant-input" placeholder="Product" type="text" name="" autocomplete="off" readonly="">
       <label class="placeholder-label placeholder-label--select" for="product">Product</label>
       <div class="select-dropdown">
           <li class="select-list-item">
               <label class="ant-checkbox-wrapper">
                   <span class="ant-checkbox">
                       <input name="search[product][0]" type="checkbox" value="New" class="ant-checkbox-input">
                       <span class="ant-checkbox-inner"></span>
                   </span>
                   <span class="select-one">New</span>
               </label>
           </li>
           <li class="select-list-item">
               <label class="ant-checkbox-wrapper"> 
                   <span class="ant-checkbox">
                       <input name="search[product][1]" type="checkbox" value="Old" class="ant-checkbox-input">
                       <span class="ant-checkbox-inner"></span>
                   </span>
                   <span class="select-one">Old</span>
               </label>
           </li>
       </div>
   </div>

   

   It's select with checkboxes (https://ant.design/components/select/)
3. oleg-andreyev commented on Mar 20, 2020

   

   oleg-andreyev

   on Mar 20, 2020

   Contributor

   More actions

   From provided exception and HTML it seems that label is covering element, try adding z-index to input element
4. athanro commented on Mar 23, 2020

   

   athanro

   on Mar 23, 2020

   Author

   More actions

   Adding z-index fixed this problem.

   But another test is broken, this time relates to this commit
   d8adafd

   I have input with autocomplete. (ant dropdown)
   

   You click input, start typing and then you can choose localization.
   Problem is that input immediately looses focus after setValue(), div with autocomplete options won't appear and you can't choose localization.
   There is no behat error, just scenario fails.

   $page = $this->getSession()->getPage();
   
   $el = $page->find('css', 'input#localization');
   $el->click();
   $el->setValue($localization); /* Here focus is lost */
   
   $page->waitFor(15, static function () use ($page) {
       $elements = $page->findAll('css', '.localization-option');
       return ($elements && $elements[0]->isVisible());
   });
   
   $el->keyPress(13);

   <div id="select-localization" class="ant-select">
      <div class="ant-select-selection">
         <div class="ant-select-selection__rendered">
            <div class="ant-select-selection-selected-value" style="display: block; opacity: 1;">Fra</div>
            <div class="ant-select-search ant-select-search--inline" style="display: none;">
               <div><input id="localization" class="ant-select-search__field" value=""></div>
            </div>
         </div>
      </div>
      <div style="position: absolute; top: 0px; left: 0px; width: 100%;">
         <div>
            <div class="ant-select-dropdown" >
               <div style="overflow: auto;">
                  <ul role="listbox" class="ant-select-dropdown-menu  ant-select-dropdown-menu-root ant-select-dropdown-menu-vertical" tabindex="0">
                     <li style="user-select: none;" class="ant-select-dropdown-menu-item localization-option ant-select-dropdown-menu-item-selected" unselectable="on" aria-selected="true">France</li>
                     <li style="user-select: none;" class="ant-select-dropdown-menu-item localization-option" unselectable="on" aria-selected="false">Frankfurt</li>
                  </ul>
               </div>
            </div>
         </div>
      </div>
   </div>

   What fixes it is removing code added in this commit or adding long sleep(); after
   $element->postValue(array('value' => array($value)));
   so there is enough time to get localizations from db.
5. oleg-andreyev commented on Mar 24, 2020

   

   oleg-andreyev

   on Mar 24, 2020

   Contributor

   More actions

   What fixes it is removing code added in this commit or adding long sleep(); after
   $element->postValue(array('value' => array($value)));
   so there is enough time to get localizations from db.

   If you have dynamically loaded element then you need to wait for it to load before trying, same behavior may have your customers.
6. athanro commented on Mar 24, 2020

   

   athanro

   on Mar 24, 2020

   Last edited by athanro

   Author

   More actions

   Check this example https://ant.design/components/auto-complete/
   When selenium finishes typing in input it looses focus, so it can't click in option in dynamic div because div won't appear.
7. stof commented on Mar 24, 2020

   

   stof

   on Mar 24, 2020

   Member

   More actions

   Well, setValue is about setting the value of a field, not about typing in a field while keeping focus (which was already not working in 1.3.0). The Mink expectation is that after you set the value of a field, the change event is triggered, and that won't happen if we only write in it without moving focus away.

   There is an in-progress discussion about adding a separate API in Mink to be able to type in an element without moving focus away, to allow testing autocomplete elements, but that's not what setValue is about.