https://docs-production-katalon.netlify.app/assets/js/431ce9a6.812a092c.js

1"use strict";(self.webpackChunkKatalon_Docs=self.webpackChunkKatalon_Docs||[]).push([[11255],{28453:(e,t,b)=>{b.d(t,{R:()=>i,x:()=>s});var n=b(96540);const r={},o=n.createContext(r);function i(e){const t=n.useContext(o);return n.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}function s(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:i(e.components),n.createElement(o.Provider,{value:t},e.children)}},72045:(e,t,b)=>{b.r(t),b.d(t,{assets:()=>a,contentTitle:()=>s,default:()=>l,frontMatter:()=>i,metadata:()=>n,toc:()=>_});const n=JSON.parse('{"id":"keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-upload-file-by-drag-and-drop","title":"[WebUI] Upload File by Drag-and-Drop","description":"Description","source":"@site/docs/katalon-studio/keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-upload-file-by-drag-and-drop.md","sourceDirName":"keywords/keyword-description-in-katalon-studio/web-ui-keywords","slug":"/keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-upload-file-by-drag-and-drop","permalink":"/katalon-studio/keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-upload-file-by-drag-and-drop","draft":false,"unlisted":false,"tags":[],"version":"current","lastUpdatedAt":1758935351000,"frontMatter":{"title":"[WebUI] Upload File by Drag-and-Drop"},"sidebar":"katalon-studio","previous":{"title":"[WebUI] Uncheck","permalink":"/katalon-studio/keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-uncheck_1"},"next":{"title":"[WebUI] Verify Alert Not Present","permalink":"/katalon-studio/keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-verify-alert-not-present"}}');var r=b(74848),o=b(28453);const i={title:"[WebUI] Upload File by Drag-and-Drop"},s=void 0,a={},_=[{value:'<a class="anchor_top_offset"></a>Description',id:"description",level:2},{value:'<a class="anchor_top_offset"></a>Parameters',id:"parameters",level:2},{value:"Example",id:"example",level:2},{value:'<a class="anchor_top_offset"></a>Variations of the keyword usage',id:"variations-of-the-keyword-usage",level:2},{value:'<a class="anchor_top_offset"></a>Known limitation',id:"known-limitation",level:2}];function d(e){const t={a:"a",code:"code",h2:"h2",p:"p",pre:"pre",...(0,o.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(t.h2,{id:"description",children:[(0,r.jsx)("a",{id:"id_0__id",class:"anchor_top_offset"}),"Description"]}),"\n",(0,r.jsx)("p",{xmlns:"http://www.w3.org/1999/xhtml",className:"p",children:"Upload files to a website by drag-and-drop."}),"\n",(0,r.jsxs)("p",{xmlns:"http://www.w3.org/1999/xhtml",className:"p",children:["Keyword name: ",(0,r.jsx)("code",{className:"ph codeph",children:"uploadFileWithDragAndDrop"})]}),"\n",(0,r.jsxs)("div",{xmlns:"http://www.w3.org/1999/xhtml",className:"note note note_note",children:[(0,r.jsx)("span",{className:"note__title",children:"Note:"})," ",(0,r.jsxs)("p",{className:"p",children:["Your Katalon Studio version must be ",(0,r.jsx)("strong",{className:"ph b",children:"7.5.0+"}),"."]})]}),"\n",(0,r.jsxs)("p",{xmlns:"http://www.w3.org/1999/xhtml",className:"p",children:[" ",(0,r.jsx)("strong",{className:"ph b",children:"Precondition"}),": For the keyword to work, the drop zone must be visible before it is used."]}),"\n",(0,r.jsxs)(t.h2,{id:"parameters",children:[(0,r.jsx)("a",{id:"id_0__id_1",class:"anchor_top_offset"}),"Parameters"]}),"\n",(0,r.jsxs)("table",{xmlns:"http://www.w3.org/1999/xhtml",className:"table anchor_top_offset",id:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd",children:[(0,r.jsx)("caption",{}),(0,r.jsxs)("colgroup",{children:[(0,r.jsx)("col",{style:{width:"20%"}}),(0,r.jsx)("col",{style:{width:"20%"}}),(0,r.jsx)("col",{style:{width:"20%"}}),(0,r.jsx)("col",{style:{width:"40%"}})]}),(0,r.jsx)("thead",{className:"thead",children:(0,r.jsxs)("tr",{className:!0,children:[(0,r.jsx)("th",{className:"entry anchor_top_offset",id:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1",children:"Parameter"}),(0,r.jsx)("th",{className:"entry anchor_top_offset",id:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2",children:"Parameter Type"}),(0,r.jsx)("th",{className:"entry anchor_top_offset",id:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3",children:"Required"}),(0,r.jsx)("th",{className:"entry anchor_top_offset",id:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4",children:"Description"})]})}),(0,r.jsxs)("tbody",{className:"tbody",children:[(0,r.jsxs)("tr",{className:!0,children:[(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"to"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"TestObject"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"Optional"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"An object representing the drop zone. If unspecified, the drop zone is the website's body element by default."})]}),(0,r.jsxs)("tr",{className:!0,children:[(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"filePath"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"String"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"Yes"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"The absolute path to the file to be uploaded."})]}),(0,r.jsxs)("tr",{className:!0,children:[(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"flowControl"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"FailureHandling"}),(0,r.jsx)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:"Optional"}),(0,r.jsxs)("td",{className:"entry",headers:"id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__1 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__2 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__3 id_0__eb467905-7093-4b13-b826-bbbf866b82cd__entry__4 ",children:["Specify ",(0,r.jsx)("a",{className:"xref",href:"/katalon-studio/maintain-tests/configure-failure-handling-settings-in-katalon-studio",children:"failure handling"})," schema to determine whether the execution should be allowed to continue or stop."]})]})]})]}),"\n",(0,r.jsx)(t.h2,{id:"example",children:"Example"}),"\n",(0,r.jsxs)(t.p,{children:["Given there is a file named ",(0,r.jsx)(t.code,{children:"yourImage.jpg"})," in our project folder that needs uploading on ",(0,r.jsx)(t.code,{children:"https://imgur.com/upload?beta"}),", the snippet below uses ",(0,r.jsx)(t.code,{children:"WebUI.uploadFileWithDragAndDrop"})," to perform the operation. Since the website supports drag and drop on the entire webpage, we don\u2019t have to specify a drop zone:"]}

1),"\n",(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-jsx",children:"import com.kms.katalon.core.configuration.RunConfiguration as RunConfiguration\nimport com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI\nimport static com.kms.katalon.core.testobject.ObjectRepository.findTestObject\n\nWebUI.openBrowser('')\nWebUI.navigateToUrl('https://imgur.com/upload?beta')\ndef filePath = RunConfiguration.getProjectDir() + '/yourImage.jpg'\nWebUI.uploadFileWithDragAndDrop(filePath)\nWebUI.delay(5)\nWebUI.closeBrowser()\n"})}),"\n",(0,r.jsxs)(t.p,{children:["If uploading multiple files at once by drag-and-drop, for the value of the parameter named ",(0,r.jsx)("code",{className:"ph codeph",children:"filePath"}),", please provide a string with the following format: ",(0,r.jsx)("pre",{className:"pre codeblock",children:(0,r.jsx)("code",{children:'pathToFile 1 + "\\n" + pathToFile2 + "\\n" + pathToFile3'})}),"For example:"]}),"\n",(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-jsx",children:"import com.kms.katalon.core.configuration.RunConfiguration as RunConfiguration\nimport com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI\nimport static com.kms.katalon.core.testobject.ObjectRepository.findTestObject\nWebUI.openBrowser('')\nWebUI.navigateToUrl('https://imgur.com/upload?beta')\ndef filePath = RunConfiguration.getProjectDir() + '/Katalon-Devices.JPG'\ndef filePath1 = RunConfiguration.getProjectDir() + '/Katalon-Devices 1.JPG'\ndef filePath2 = RunConfiguration.getProjectDir() + '/Katalon-Devices 2.JPG'\ndef concatenatedFilePath = (((filePath + '\\n') + filePath1) + '\\n') + filePath2\nWebUI.uploadFileWithDragAndDrop(concatenatedFilePath)\nWebUI.verifyElementPresent(findTestObject('Object Repository/Imgur/Page_Imgur The magic of the Internet/span_3 images saved'), 10)\nWebUI.delay(5)\nWebUI.closeBrowser()\n"})}),"\n",(0,r.jsxs)(t.p,{children:["A sample project is available ",(0,r.jsx)(t.a,{href:"https://github.com/katalon-studio/Upload-File-with-Drag-and-Drop-Sample-Project",children:"here"}),"."]}),"\n",(0,r.jsxs)(t.h2,{id:"variations-of-the-keyword-usage",children:[(0,r.jsx)("a",{id:"id_0__id_2",class:"anchor_top_offset"}),"Variations of the keyword usage"]}),"\n",(0,r.jsxs)("p",{xmlns:"http://www.w3.org/1999/xhtml",className:"p",children:["Some websites support uploading a file by drag-and-drop it anywhere on the page, while others only support that in a limited area. Hence, you can omit or keep the ",(0,r.jsx)("code",{className:"ph codeph",children:"TestObject to"})," parameter in corresponding use cases."]}),"\n",(0,r.jsxs)(t.h2,{id:"known-limitation",children:[(0,r.jsx)("a",{id:"id_0__id_4",class:"anchor_top_offset"}),"Known limitation"]}),"\n",(0,r.jsxs)("p",{xmlns:"http://www.w3.org/1999/xhtml",className:"p",children:["Some website (e.g., ",(0,r.jsx)("a",{className:"xref j-external-link",href:"https://www.imageupload.net/",target:"_blank",children:"Mobile Photo Upload"}),") only shows the drop zone when users drag and drop a file, which means the drop zone is not visible before this keyword is used. In this case, the keyword will not work."]})]})}function l(e={}){const{wrapper:t}={...(0,o.R)(),...e.components};return t?(0,r.jsx)(t,{...e,children:(0,r.jsx)(d,{...e})}):d(e)}}}]);