Skip to content

Commit

Permalink
Merge pull request #7 from ortoniKC/feat/v2.0.1
Browse files Browse the repository at this point in the history 
Feat/v2.0.1
  • Loading branch information
@ortoniKC
ortoniKC committed Jan 2, 2023
2 parents 60e5a9b + 589c5b4 commit 4213203
Show file tree
Hide file tree
Showing 7 changed files with 394 additions and 199 deletions.
12 changes: 9 additions & 3 deletions app/src/textXPath.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,13 @@ function getTextBasedXPath(element, tagName) {
let c = getNumberOfXPath(t);
if (c == 1) {
XPATHDATA.push([0, 'Link Text', link.trim()]);
XPATHDATA.push([0, 'Link Text as XPath', t]);
} else {
let t = `//a[contains(.,'${link.trim()}')]`;
let c = getNumberOfXPath(t);
if (c == 1) {
XPATHDATA.push([0, 'Link XPath', t]);
XPATHDATA.push([0, 'Link Text as XPath', t]);
}
}
}
Expand All @@ -38,6 +40,7 @@ function getTextBasedXPath(element, tagName) {
let partialLink = `//a[contains(text(),'${link.trim()}')]`;
if (getNumberOfXPath(partialLink) == 1) {
XPATHDATA.push([0, 'Partial Link Text', link.trim()])
XPATHDATA.push([0, 'Link Text as XPath', partialLink]);
gotPartial = true;
} else {
link = element.textContent;
Expand All @@ -53,12 +56,15 @@ function getTextBasedXPath(element, tagName) {
hasSpace = link.match(/\s/g);
if (hasSpace) {
link = link.replace(/\s+/g, " ");
XPATHDATA.push([0, 'Link Text', link.trim()])
XPATHDATA.push([0, 'Link Text', link.trim()]);
XPATHDATA.push([0, 'Link Text as XPath', temp]);
}
} else if (gotPartial == false && getNumberOfXPath(temp) == 1) {
XPATHDATA.push([0, 'Link Text', link.trim()])
XPATHDATA.push([0, 'Link Text', link.trim()]);
XPATHDATA.push([0, 'Link Text as XPath', temp]);
} else if (gotPartial == false && getNumberOfXPath(`//a[text()='${link.trim()}']`) == 1) {
XPATHDATA.push([0, 'Link Text', link.trim()])
XPATHDATA.push([0, 'Link Text', link.trim()]);
XPATHDATA.push([0, 'Link Text as XPath', `//a[text()='${link.trim()}']`]);
}
}
if (hasSpace) {
Expand Down
2 changes: 1 addition & 1 deletion manifest.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"short_name": "XPath finder",
"description": "XPath Finder, simple and useful, open-source project",
"author": "Koushik Chatterjee",
"version": "2.0.0",
"version": "2.0.1",
"manifest_version": 2,
"icons": {
"16": "assets/16.png",
Expand Down
212 changes: 52 additions & 160 deletions option/option.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,171 +2,63 @@
<html lang="en">

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>LetXPath Setting</title>
<script src="../app/utils/jquery.js"></script>
<script src="option.js"></script>
<link rel="stylesheet" href="../app/styles/main.css">
<style>
</style>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>LetXPath Setting</title>
<script src="../app/utils/jquery.js"></script>
<script src="option.js"></script>
<link rel="stylesheet" href="../app/styles/main.css">
<style>
</style>
</head>

<body class="bg-dark">
<main>
<div class="container">
<div class="card bg-dark">
<div class="card-header">
<div class="card-title h5">Snippet Configuration</div>
<div class="card-subtitle text-gray">Please select the default snippet to generate</div>
</div>
<div class="card-body">
<div class="input-group">
<div class="form-group">
<label class="form-switch">
<input type="radio" name="snippetLanguage" value="Selenium - Java" id="javas">
<i class="form-icon"></i>Selenium Java
</label>
<label class="form-switch">
<input type="radio" name="snippetLanguage" value="Python" id="py">
<i class="form-icon"></i>Selenium Python
</label>
<label class="form-switch">
<input type="radio" name="snippetLanguage" value="C#" id="csharp">
<i class="form-icon"></i>Selenium C#
</label>
<label class="form-switch">
<input type="radio" name="snippetLanguage" value="Protractor - JS" id="protractorjs">
<i class="form-icon"></i>Protractor
</label>
<label class="form-switch">
<input type="radio" name="snippetLanguage" value="WebDriver IO" id="io" disabled>
<i class="form-icon"></i>WebDriver IO
</label>
<label class="form-switch">
<input type="radio" name="snippetLanguage" value="custom" id="custom">
<i class=" form-icon"></i>Custom Framework
</label>
</div>
</div>
<div class="toast toast-success d-hide">Default Snippet has been changed to </div>
</div>
</div>
<div class="columns csfw">
<div class="column col">
<div class="card bg-dark">
<div class="card-header">Custom framework configuration</div>
<div class="card-body">
<form>
<div class="form-group">
<label class="form-label" for="lang">Select the framework type</label>
<div class="input-group">
<div class="form-group">
<label class="form-switch">
<input type="radio" name="cssnippetLanguage" value="JavaScript Custom Framework" id="jscs"
required>
<i class="form-icon"></i>Protractor JS/TS
</label>
<label class="form-switch">
<input type="radio" name="cssnippetLanguage" value="Java Custom Framework" id="javacs" required>
<i class="form-icon"></i>Selenium Java/POM
</label>
<body>
<main>
<section class="container">
<div class="columns">
<div class="column col-3"></div>
<div class="column col-6">
<div class="hero bg-primary">
<div class="hero-body">
<h1>Code snippet</h1>
<p>Configuration</p>
</div>
</div>
<br>
<div class="container p-centered">
<div class="form-group">
<select class="form-select" id="snippets">
<option>Choose an option</option>
<option value="playwrightJava">Playwright - Java</option>
<option value="playwrightJS">Playwright - Node</option>
<option value="javas">Selenium Java</option>
<option value="py">Selenium Python</option>
<option value="csharp">Selenium C#</option>
<option value="protractorjs">Protractor</option>
<option value="custom" disabled>Custom Framework</option>
</select>
</div>
</div>
<br>
<div class="container">
<div class="card">
<div class="card-header">
<div class="card-title h5">Code sample</div>
</div>
<div class="card-body">
<pre class="code">
<code id="samplecode" class="code bg-success">
<p>hi am code</p>
</code>
</pre>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="form-label" for="click">Click</label>
<textarea class="form-input" type="text" id="click-s" required
placeholder="Enter snippet template for click action"></textarea>
</div>
<div class="form-group">
<label class="form-label" for="click">sendKeys</label>
<textarea class="form-input" type="text" id="send-s" required
placeholder="Enter snippet template for sendKeys action"></textarea>
</div>
<div class="form-group">
<label class="form-label" for="click">getText</label>
<textarea class="form-input" type="text" id="text-s" required
placeholder="Enter snippet template for getText action"></textarea>
</div>
<div class="form-group">
<label class="form-label" for="click">getAttribute</label>
<textarea class="form-input" type="text" id="attr-s" required
placeholder="Enter snippet template for getAttribute action"></textarea>
</div>
<div class="form-group text-center">
<button class="btn btn-success" id="save">Save</button>
</div>
</form>
</div>
</div>
</div>
<div class="divider-vert" data-content="Config"></div>
<div class="column col">
<div class="card bg-dark">
<div class="card-body">
<p class="title">
LetXPath gives you the following meta-data
</p>
<span class="chip text-primary">1. Locator Value - ${lc}</span>
<span class="chip text-primary">2. Variable Name - ${vn}</span>
<span class="chip text-primary">3. Method Name - ${mn}</span>
<p class="title">
Customize as per your requirements
</p>
<h4>Example:</h4>
<details class="accordion" open>
<summary class="accordion-header">
<i class="icon icon-arrow-right mr-1"></i>
<span class="chip text-primary">
Protractor JS/TS
</span>
</summary>
<div class="accordion-body">
<div class="text-left">
<pre class="code" data-lang="JS"><code>private ${vn} = ${lc};
async clickOn${mn}(){
await this.click(this.${vn})
}</code></pre>
</div>
<span>Protractor JS/TS - Result</span>
<div class=" text-left">
<pre class="code" data-lang="JS"><code>private login = element(by.id('loginId'));
async clickOnLogin(){
await this.click(this.login)
}</code></pre>
</div>
</div>
</details>
<details class="accordion" open>
<summary class="accordion-header">
<i class="icon icon-arrow-right mr-1"></i>
<span class="chip text-primary">
Selenium JAVA/POM
</span>
</summary>
<div class="accordion-body">
<div class="text-left">
<pre class="code" data-lang="JAVA"><code>${lc} private WebElement ${vn};
public void clickOn${mn}(){
this.click(this.${vn})
}</code></pre>
</div>
<span>Selenium JAVA/POM - Result</span>
<div class="text-left">
<pre class="code" data-lang="JAVA"><code>@FindBy(id= "loginId") private WebElement login;
public void clickOnLogin(){
this.click(this.login);
}</code></pre>
</div>
</div>
</details>
<div class="column col-3"></div>
</div>
</div>
</div>
</div>

</main>
</section>
</main>
</body>

</html>
71 changes: 49 additions & 22 deletions option/option.js
View file
Original file line number Diff line number Diff line change
@@ -1,15 +1,19 @@
$(document).ready(function () {
chrome.storage.local.get(['langID', 'customLang', 'clickvalue', 'sendvalue', 'textvalue', 'attrvalue'], (result) => {
if (result.langID != undefined) {
// setStorage({ lang: radioValue, langID: radioID });
document.getElementById(result.langID).checked = true;
const codeType = result.langID;
$("select").val(codeType).change();
embedCodeSample(codeType);
setStorage({ langID: codeType });
}
if (result.customLang != undefined) {
// setStorage({ lang: radioValue, langID: radioID });
document.getElementById(result.customLang).checked = true;
const codeType = result.customLang;
$("select").val(codeType).change();
embedCodeSample(codeType);
setStorage({ langID: codeType });
} else {
setStorage({ lang: 'Selenium - Java', langID: 'javas' });
document.getElementById("javas").checked = true;
$("select").val(result.langID).change();
setStorage({ langID: 'javas' });
}
// set edited values in textarea
if (result.clickvalue != undefined) {
Expand All @@ -18,19 +22,13 @@ $(document).ready(function () {
$("#text-s").val(result.textvalue)
$("#attr-s").val(result.attrvalue)
}



});
$("input[type='radio'][name='snippetLanguage']").click(function () {
let ip = $("input[name='snippetLanguage']:checked");
let radioValue = ip.val();
let radioID = ip.attr("id");
setStorage({ lang: radioValue, langID: radioID });
let toast = document.querySelector('.toast')
toast.textContent = "Default Snippet has been changed to " + radioValue
toast.classList.remove('d-hide')
})
$("select#snippets").change(function () {
var selectedvalue = $(this).children("option:selected").val();
setStorage({ langID: selectedvalue });
embedCodeSample(selectedvalue);
});

$("form").on("submit", function () {
let ip = $("input[name='cssnippetLanguage']:checked");
let customLang = ip.attr("id");
Expand All @@ -43,14 +41,43 @@ $(document).ready(function () {
setStorage({ 'textvalue': textAct.val() });
let attrAct = $("#attr-s");
setStorage({ 'attrvalue': attrAct.val() });
alert('Success')
// document.querySelector('.toast').classList.remove('d-hide');
// document.querySelector(".toast").textContent = 'Success';
// alert(clickAct.val(), sendAct.val(), textAct.val(), attrAct.val())
})
});

function setStorage(obj) {
chrome.storage.local.set(obj, function () {
});
}

function embedCodeSample(codetype) {
jQuery("#samplecode").empty();
let code;
switch (codetype) {
case "playwrightJS":
code = `await page.locator("locator value");`;
break;
case "playwrightJava":
code = `page.locator("locator value");`;
break;
case "javas":
code = `driver.findElement(By.xpath("locator value"));`;
break;
case "py":
code = `driver.find_element(By.XPATH, "locator value")`;
break;
case "csharp":
code = `driver.FindElement(By.Xpath("locator value")); `;
break;
case "protractorjs":
code = `element(by.xpath("locator value"));`;
break;
case "custom":
code = `Custome framework`;
break;
default:
code = `driver.findElement(By.xpath("locator value"));`;
break;
}
jQuery("#samplecode").append(`${code}`);

}
Loading

0 comments on commit 4213203

Please sign in to comment.