Csharp/C#教程:如何拖动hover元素分享


如何拖动hover元素

我运行此网站的网站是在内部服务器上,所以我无法提供链接,但我可以发布一些单击“显示元素”时显示的相关代码

有5个元素与此相关:

此页面显示学生组,并允许用户在组之间拖动学生。 每个组都有一个移动元素。 棘手的部分是,任何给定组的移动按钮仅在用户拖动该组上的学生元素时显示,而该学生不是来自该组。

目标是将学生移至新组,然后返回原始组。

注意:学生XPath在更改组时会发生变化我无法确认,但我相信移动按钮的XPath在隐藏时不同于可见时

我目前的代码:

IWebDriver driver = (IWebDriver)FeatureContext.Current["Driver"]; Actions builder = new Actions(driver); IWebElement originalstudent = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[2]/div[2]/div[2]/div/div[3]/a[1]/div[1]/div")); IWebElement originalClass = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[2]/div[2]/div[2]/div/div[1]")); IWebElement newClass = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[2]/div[2]/div[3]/div[1]/div[1]")); IWebElement originalMove = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[2]/div[2]/div[2]/div/div[2]/div[1]/div")); IWebElement newMove = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[2]/div[2]/div[3]/div[1]/div[2]/div[1]/div")); builder.ClickAndHold(originalstudent); builder.MoveToElement(newClass); builder.Release(newMove); builder.Build().Perform(); IWebElement save = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[1]/div/div/button[2]")); builder.Click(save); builder.Build().Perform(); //assert group2 has 1 student and group 1 has 3 students IWebElement newstudent = driver.FindElement(By.XPath("//*[@id="AMTeacherApp"]/div/div/div[1]/div/div[3]/div/div/div[2]/div[2]/div[3]/div/div[3]/a/div[1]/div")); builder.ClickAndHold(newstudent); builder.MoveToElement(originalClass); builder.Release(originalMove); builder.Click(save); builder.Build().Perform(); 

此代码不会移动任何元素,并且在尝试查找保存时失败,因为没有任何更改(假设没有任何动作,这是预期的)。

页面中的相关代码:

  
******
Group 1 | 4 Students Student
**********
Move
Copy
******
Remove from Group 1
******
Group 2 | 0 Students Student
************
Move
Copy
Remove from Group 2
Drag student icons into this Group Delete this group

星标记相关元素。 如果您有其他信息需要上下文,请与我们联系。

Selenium的拖放操作对HTML5不起作用,所以我使用jquery来拖动元素。

我用这些作为参考: https : //gist.github.com/rcorreia/2362544 https://elementalselenium.com/tips/39-drag-and-drop

这就是结果:

上述就是C#学习教程:如何拖动hover元素分享的全部内容,如果对大家有所用处且需要了解更多关于C#学习教程,希望大家多多关注—计算机技术网(www.ctvol.com)!

 public void WhenAStudentIsMovedToANewGroup(string action, string student, string group) { WaitForAngular(); IWebDriver driver = (IWebDriver)FeatureContext.Current["Driver"]; /* * Load a version of jQuery that we can access */ driver.Manage().Timeouts().SetScriptTimeout(TimeSpan.FromSeconds(10)); IJavaScriptExecutor js = (IJavaScriptExecutor)driver; js.ExecuteAsyncScript(loadJQuery, jQueryUrl); string dragEntity = string.Format("[title="{0}"]", student); string target = string.Format("[ui-on-drop="model.onMoveDrop(group)"]:contains({0}) ~ div > div .{1}", group, action); string javaScriptString = string.Format("{0}$('{1}').simulateDragDrop({{ dropTarget: '{2}'}});", dragAndDropHelper, dragEntity, target); //Execute the drag and drop against the HTML5 js.ExecuteScript(javaScriptString); } const string dragAndDropHelper = @"(function( $ ) { $.fn.simulateDragDrop = function(options) { return this.each(function() { new $.simulateDragDrop(this, options); }); }; $.simulateDragDrop = function(elem, options) { this.options = options; this.simulateEvent(elem, options); }; $.extend($.simulateDragDrop.prototype, { simulateEvent: function(elem, options) { /*Simulating drag start*/ var type = 'dragstart'; var event = this.createEvent(type); this.dispatchEvent(elem, type, event); /*Simulating drop*/ type = 'drop'; var dropEvent = this.createEvent(type, {}); dropEvent.dataTransfer = event.dataTransfer; this.dispatchEvent($(options.dropTarget)[0], type, dropEvent); /*Simulating drag end*/ type = 'dragend'; var dragEndEvent = this.createEvent(type, {}); dragEndEvent.dataTransfer = event.dataTransfer; this.dispatchEvent(elem, type, dragEndEvent); }, createEvent: function(type) { var event = document.createEvent(""CustomEvent""); event.initCustomEvent(type, true, true, null); event.dataTransfer = { data: { }, setData: function(type, val){ this.data[type] = val; }, getData: function(type){ return this.data[type]; } }; return event; }, dispatchEvent: function(elem, type, event) { if(elem.dispatchEvent) { elem.dispatchEvent(event); }else if( elem.fireEvent ) { elem.fireEvent(""on""+type, event); } } }); })(jQuery);"; const string loadJQuery = @"(function(jqueryUrl, callback) { if (typeof jqueryUrl != 'string') { jqueryUrl = 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'; } if (typeof jQuery == 'undefined') { var script = document.createElement('script'); var head = document.getElementsByTagName('head')[0]; var done = false; script.onload = script.onreadystatechange = (function() { if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) { done = true; script.onload = script.onreadystatechange = null; head.removeChild(script); callback(); } }); script.src = jqueryUrl; head.appendChild(script); } else { callback(); } })(arguments[0], arguments[arguments.length - 1]);"; 

本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址:https://www.ctvol.com/cdevelopment/1009780.html

(0)
上一篇 2021年12月29日
下一篇 2021年12月29日

精彩推荐