1"use strict";(self.webpackChunktestplane_docs=self.webpackChunktestplane_docs||[]).push([["3232"],{42575(e,n,t){t.r(n),t.d(n,{metadata:()=>i,default:()=>m,frontMatter:()=>o,contentTitle:()=>a,toc:()=>d,assets:()=>c});var i=JSON.parse('{"id":"commands/element/$","title":"$","description":"Overview {/ #overview /}","source":"@site/docs/commands/element/$.mdx","sourceDirName":"commands/element","slug":"/commands/element/_dollar","permalink":"/docs/commands/element/_dollar","draft":false,"unlisted":false,"editUrl":"https://github.com/gemini-testing/testplane-docs/tree/master/docs/commands/element/$.mdx","tags":[],"version":"current","sidebarPosition":1,"frontMatter":{"slug":"_dollar","sidebar_position":1},"sidebar":"mainSidebar","previous":{"title":"waitUntil","permalink":"/docs/commands/browser/waitUntil"},"next":{"title":"$$","permalink":"/docs/commands/element/_dollardollar"}}'),r=t(74848),s=t(28453),l=t(77444);let o={slug:"_dollar",sidebar_position:1},a="$",c={},d=[{value:"Overview",id:"overview",level:2},{value:"Usage",id:"usage",level:2},{value:"Command Parameters",id:"parameters",level:2},{value:"Usage Examples",id:"examples",level:2},{value:"Related Commands",id:"related",level:2},{value:"References",id:"references",level:2}];function h(e){let n={a:"a",code:"code",h1:"h1",h2:"h2",header:"header",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,s.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.header,{children:(0,r.jsx)(n.h1,{id:"",children:"$"})}),"\n",(0,r.jsx)(n.h2,{id:"overview",children:"Overview"}),"\n",(0,r.jsxs)(n.p,{children:["Use the ",(0,r.jsx)(n.code,{children:"$"})," command instead of ",(0,r.jsx)(n.a,{href:"https://webdriver.io/docs/api/webdriver/#findelement",children:"findElement"})," as a shorter command to get a single element on the page."]}),"\n",(0,r.jsxs)(n.p,{children:["The ",(0,r.jsx)(n.code,{children:"$"})," command returns an object describing the element, on which you can call action commands without passing the selector. However, if you do pass a selector, it will first find the corresponding element and then call the action for that element. You can also pass an object as the selector, where the object contains the property ",(0,r.jsx)(n.code,{children:"element-6066-11e4-a52e-4f735466cecf"})," with the value of the element reference. The command then converts the reference into an extended WebdriverIO element. Note: Use these element objects only if you are certain they exist on the page. This can be verified, for example, using the ",(0,r.jsx)(n.a,{href:"../isExisting",children:"isExisting"})," command."]}),"\n",(0,r.jsxs)(n.p,{children:["You can chain ",(0,r.jsx)(n.code,{children:"$"})," or ",(0,r.jsx)(n.code,{children:"$$"})," together to navigate down the DOM tree. But note that chaining ",(0,r.jsx)(n.code,{children:"$"})," and ",(0,r.jsx)(n.code,{children:"$$"})," commands makes sense only when using multiple selector strategies. Otherwise, you will be making unnecessary requests that will slow down the test (e.g., ",(0,r.jsx)(n.code,{children:"$('body').$('div')"})," creates two requests, whereas ",(0,r.jsx)(n.code,{children:"$('body div')"})," does the same in one request)."]}),"\n",(0,r.jsx)(l.A,{type:"info",children:(0,r.jsxs)(n.p,{children:['Read more about how to select specific elements in the recipe "',(0,r.jsx)(n.a,{href:"https://webdriver.io/docs/selectors",children:"How to use\nselectors"}),'".']})}),"\n",(0,r.jsx)(n.h2,{id:"usage",children:"Usage"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:"await browser.$(selector);\n"})}),"\n",(0,r.jsx)(n.h2,{id:"parameters",children:"Command Parameters"}),"\n",(0,r.jsxs)("table",{children:[(0,r.jsx)("thead",{children:(0,r.jsxs)("tr",{children:[(0,r.jsx)("td",{children:(0,r.jsx)(n.strong,{children:"Name"})}),(0,r.jsx)("td",{children:(0,r.jsx)(n.strong,{children:"Type"})}),(0,r.jsx)("td",{children:(0,r.jsx)(n.strong,{children:"Description"})})]})}),(0,r.jsx)("tbody",{children:(0,r.jsxs)("tr",{children:[(0,r.jsx)("td",{children:"selector"}),(0,r.jsx)("td",{children:"String or Function or Matcher"}),(0,r.jsx)("td",{children:"Selector, JS function, or Matcher object to get a specific element."})]})})]}),"\n",(0,r.jsx)(n.h2,{id:"examples",children:"Usage Examples"}),"\n",(0,r.jsx)(n.p,{children:(0,r.jsx)(n.strong,{children:"index.html"})}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-html",children:'<ul id="menu">\n <li>\n <a href="/">Home</a>\n </li>\n <li>\n <a href="/">Developer Guide</a>\n </li>\n <li>\n <a href="/">API</a>\n </li>\n <li>\n <a href="/">
1Contribute</a>\n </li>\n</ul>\n'})}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-javascript",children:'it("should get text of a menu link - JS Function", async ({ browser }) => {\n const text = await browser.$("#menu");\n\n console.log(\n await text\n .$$("li")[2]\n .$(function () {\n // Arrow function cannot be used here.\n // This is Element \u2013 https://developer.mozilla.org/en-US/docs/Web/API/Element\n // in this specific example \u2013 this is HTMLLIElement\n //\n // TypeScript users can do something like:\n // return (this as Element).querySelector(\'a\')\n return this.querySelector("a"); // Element\n })\n .getText(),\n ); // outputs: "API"\n});\n\nit("should get text of a menu link", async ({ browser }) => {\n const text = await browser.$("#menu");\n\n console.log(await text.$$("li")[2].$("a").getText()); // outputs: "API"\n});\n\nit("should allow to convert protocol result of an element into a WebdriverIO element", async ({\n browser,\n}) => {\n const activeElement = await browser.getActiveElement();\n\n console.log(await browser.$(activeElement).getTagName()); // outputs the active element\n});\n\nit("should use Android\'s DataMatcher or ViewMatcher selector", async ({ browser }) => {\n const menuItem = await browser.$({\n name: "hasEntry",\n args: ["title", "ViewTitle"],\n class: "androidx.test.espresso.matcher.ViewMatchers",\n });\n await menuItem.click();\n\n const menuItem = await browser.$({\n name: "hasEntry",\n args: ["title", "ViewTitle"],\n });\n await menuItem.click();\n});\n'})}),"\n",(0,r.jsx)(n.h2,{id:"related",children:"Related Commands"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:(0,r.jsx)(n.a,{href:"../_dollardollar",children:"element.$$"})}),"\n",(0,r.jsx)(n.li,{children:(0,r.jsx)(n.a,{href:"../../browser/_dollar",children:"browser.$"})}),"\n",(0,r.jsx)(n.li,{children:(0,r.jsx)(n.a,{href:"../../browser/_dollardollar",children:"browser.$$"})}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"references",children:"References"}),"\n",(0,r.jsxs)(n.p,{children:["We'd like to give credit to the original WebdriverIO docs ",(0,r.jsx)(n.a,{href:"https://webdriver.io/docs/api/element/$",children:"article"}),", from which we drew some information while writing our version."]})]})}function m(e={}){let{wrapper:n}={...(0,s.R)(),...e.components};return n?(0,r.jsx)(n,{...e,children:(0,r.jsx)(h,{...e})}):h(e)}},77444(e,n,t){t.d(n,{A:()=>y});var i=t(74848),r=t(96540),s=t(34164),l=t(30568),o=t(88287);function a({type:e,className:n,children:t,id:r}){return(0,i.jsx)("div",{className:(0,s.A)(o.G.common.admonition,o.G.common.admonitionType(e),"admonition_xJq3",n),id:r,children:t})}function c({icon:e,title:n}){return(0,i.jsxs)("div",{className:"admonitionHeading_Gvgb",children:[(0,i.jsx)("span",{className:"admonitionIcon_Rf37",children:e}),n]})}function d({children:e}){return e?(0,i.jsx)("div",{className:"admonitionContent_BuS1",children:e}):null}function h(e){let{type:n,icon:t,title:r,children:s,className:l,id:o}=e;return(0,i.jsxs)(a,{type:n,className:l,id:o,children:[r||t?(0,i.jsx)(c,{title:r,icon:t}):null,(0,i.jsx)(d,{children:s})]})}let m={icon:(0,i.jsx)(function(e){return(0,i.jsx)("svg",{viewBox:"0 0 14 16",...e,children:(0,i.jsx)("path",{fillRule:"evenodd",d:"M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"})})},{}),title:(0,i.jsx)(l.A,{id:"theme.admonition.note",description:"The default label used for the Note admonition (:::note)",children:"note"})};function u(e){return(0,i.jsx)(h,{...m,...e,className:(0,s.A)("alert alert--secondary",e.className),children:e.children})}let x={icon:(0,i.jsx)(function(e){return(0,i.jsx)("svg",{viewBox:"0 0 12 16",...e,children:(0,i.jsx)("path",{fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"})})},{}),title:(0,i.jsx)(l.A,{id:"theme.admonition.tip",description:"The default label used for the Tip admonition (:::tip)",children:"tip"})};function f(e){return(0,i.jsx)(h,{...x,...e,className:(0,s.A)("alert alert--success",e.className),children:e.children})}let j={icon:(0,i.jsx)(function(e){return(0,i.jsx)("svg",{viewBox:"0 0 14 16",...e,children:(0,i.jsx)("path",{fillRule:"evenodd",d:"M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"})})},{}),title:(0,i.jsx)(l.A,{id:"theme.admonition.info",description:"The default label used for the Info admonition (:::info)",children:"info"})};function p(e){return(0,i.jsx)(h,{...j,...e,className:(0,s.A)("alert alert--info",e.className),children:e.children})}function v(e){return(0,i.jsx)("svg",{viewBox:"0 0 16 16",...e,children:(0,i.jsx)("path",{fillRule:"evenodd",d:"M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"})})}let g={icon:(0,i.jsx)(v,{}),title:(0,i.jsx)(l.A,{id:"theme.admonition.warning",description:"The default label used for the Warning admonition (:::warning)",children:"warning"})},w={icon:(0,i.jsx)(function(e){return(0,i.jsx)("svg",{viewBox:"0 0 12 16",...e,children:(0,i.jsx)("path",{fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"})})},{}),title:(0,i.jsx)(l.A,{id:"theme.admonition.danger",description:"The default label used for the Danger admonition (:::danger)",children:"danger"})},b={icon:(0,i.jsx)(v,{}),title:(0,i.jsx)(l.A,{id:"theme.admonition.caution",description:"The default label used for the Caution admonition (:::caution)",children:"caution"})},$={note:u,tip:f,info:p,warning:function(e){return(0,i.jsx)(h,{...g,...e,className:(0,s.A)("alert alert--warning",e.className),children:e.children})},danger:function(e){return(0,i.jsx)(h,{...w,...e,className:(0,s.A)("alert alert--danger",e.className),children:e.children})},secondary:e=>(0,i.jsx)(u,{title:"secondary",...e}),important:e=>(0,i.jsx)(p,{title:"important",...e}),success:e=>(0,i.jsx)(f,{title:"success",...e}),caution:function(e){return(0,i.jsx)(h,{...b,...e,className:(0,s.A)("alert alert--warning",e.className),children:e.children})}};function y(e){var n;let t,s=function(e){var n;let t,s,l,{mdxAdmonitionTitle:o,rest:a}=(n=e.children,s=(t=r.Children.toArray(n)).find(e=>r.isValidElement(e)&&"mdxAdmonitionTitle"===e.type),l=t.filter(e=>e!==s),{mdxAdmonitionTitle:s?.props.children,rest:l.length>0?(0,i.jsx)(i.Fragment,{children:l}):null}),c=e.title??o;return{...e,...c&&{title:c},children:a}}(e),l=(t=$[n=s.type])||(console.warn(`No admonition component found for admonition type "${n}". Using Info as fallback.`),$.info);return(0,i.jsx)(l,{...s})}},28453(e,n,t){t.d(n,{R:()=>l,x:()=>o});var i=t(96540);let r={},s=i.createContext(r);function l(e){let n=i.useContext(s);return i.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function o(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:l(e.components),i.createElement(s.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.