0

I am trying to implement simple drag an drop operation on this site with Selenium examples: https://demoqa.com/droppable. How it looks like: enter image description here

And seems, my implementation of drag and drop with Atata doesn't work. I got no error, but nothing actually happens.

My implementation:

Page Object:

{
    using _ = DemoQAInteractionsPage;

    [Url("interaction")]
    [WaitForDocumentReadyState]
    public class DemoQAInteractionsPage : Page<_>
    {
        [FindById("item-3")]
        [ScrollsUsingScript]
        public Control<_> DroppableMenu { get; private set; }

        [FindById]
        [DragsAndDropsUsingActions]
        [WaitUntilEnabled]
        public Control<_> Draggable { get; private set; }

        [FindById]
        [DragsAndDropsUsingActions]
        [WaitUntilEnabled]
        public Control<_> Droppable { get; private set; }

        [FindByContent("Dropped!")]
        [WaitUntilEnabled]
        public Control<_> DroppedMessage { get; private set; }
    }
}

Test:

        [Test]
        public void DemoQADragAndDropTest()
        {
            Go.To<DemoQAMainPage>()
                .GoToInteractions();

            Go.To<DemoQAInteractionsPage>(navigate: false)
                .DroppableMenu.ScrollTo()
                .DroppableMenu.Click()
                .Draggable.DragAndDropTo(x => x.Droppable);
        }

I know about plain Selenium implementation, but would prefer Atata API for this. Could you, please, suggest something?

Update: For some reason, this approach is working:

        public _ PerformDragAndDrop()
        {
            IWebElement target = Droppable.GetScope();
            IWebElement source = Draggable.GetScope();
            Actions actions = new Actions(Driver);
            actions.ClickAndHold(source);
            actions.MoveToElement(target);
            actions.Perform();
            actions.Release(target);
            actions.Perform();
            return this;
        }

I've read about this issue, maybe, it's related to chromedriver. Anyway, this could be used as a workaround, using Atata API still would be preferable. Maybe, there is some well-known bug in chromedriver related to this issue?

IvanMikhalka
  • 184
  • 10
  • In what browser do you test that? And what is the version of Atata? The test works for me (drags and drops) in latest Chrome and Firefox. – Yevgeniy Shunevych Feb 18 '22 at 09:38
  • @YevgeniyShunevych I am using Chrome 96, and also latest of Atata, I believe. Btw, plain Selenium Actions works only in such combination, as above. Actions.DragAndDrop also was not working. I found people with such issue, for example, https://gitter.im/atata-framework/atata?at=5e837943c345c9758c03a9b9. Seems rather Selenium issue, than Atata itself – IvanMikhalka Feb 18 '22 at 09:57
  • @YevgeniyShunevych forgot to mention, OS is Windows 11 – IvanMikhalka Feb 18 '22 at 10:06
  • Right, that was some kind of WebDriver bug that `Actions.DragAndDrop` doesn't work, I believe. – Yevgeniy Shunevych Feb 18 '22 at 10:40

1 Answers1

1

Although the test works for me, you can create your drag & drop behavior class:

public class DragsAndDropsUsingActionsStepByStepAttribute : DragAndDropBehaviorAttribute
{
    public override void Execute<TOwner>(IControl<TOwner> component, IControl<TOwner> target)
    {
        IWebElement sourceElement = component.Scope;
        IWebElement targetElement = component.Scope;

        Actions actions = new Actions(component.Context.Driver);
        actions.ClickAndHold(sourceElement);
        actions.MoveToElement(targetElement);
        actions.Perform();
        actions.Release(targetElement);
        actions.Perform();
    }
}

And apply it to Draggable property:

[FindById]
[DragsAndDropsUsingActionsStepByStep]
public Control<_> Draggable { get; private set; }
Yevgeniy Shunevych
  • 1,136
  • 6
  • 11