cypress-cucumber-preprocessor Datatables - javascript

I saw some similar post to mine but I didn't find it helpful at all since none of them are using the cypress preprocessor.
I have a Scenario:
Scenario: Some scenario
Given ...
When ...
Then I should see "<task_field>" field as "<field_value>"
Examples:
| task_field | field_value |
| some_field1 | some_value1 |
| some_field2 | some_value2 |
| some_field3 | some_value3 |
The .js file has:
Then('I should see {string} field as {string}', (field, value ) => {
switch (field) {
case 'some_field1':
cy.get('.someClass1').contains(value)
break
case 'some_field2':
cy.get('.someClass2').contains(value)
break
case 'some_field3':
cy.get('.someClass3').contains(value)
break
default:
throw new Error(`Invalid field: ${field}`)
}
})
My goal is to check each some_field if it equals to some_value, but currently cypress throws me an error and it's not even giving me the option to execute the test:
Any help would be appreciated
Cheers!

After 2 hours of debugging I find out that I have forgotten to include Outline world in the Scenario definition in order the test to be able to iterate through the data table.
So for future reference the fix from:
Scenario: Some scenario
Given ...
When ...
Then I should see "<task_field>" field as "<field_value>"
Examples:
| task_field | field_value |
| some_field1 | some_value1 |
| some_field2 | some_value2 |
| some_field3 | some_value3 |
Is to include in the first line Outline:
Scenario Outline: Some scenario
Given ...
When ...
Then I should see "<task_field>" field as "<field_value>"
Examples:
| task_field | field_value |
| some_field1 | some_value1 |
| some_field2 | some_value2 |
| some_field3 | some_value3 |
I think is been a long day for me.
Hope this helps to someone with a similar issue!

Related

ASCII Table does not format as I want it to be

I'm making a discord bot using MySQL, the database stores some usernames and passwords. I fetch the data from the table in MySQL to format it in an ASCII table. The expected output was to be like the image below. (edited it to look better)
.------------------------------------------------.
| Username | Password |
|----------------------|-------------------------|
| amonggers | no |
| no username for u | no |
| not even this one | no |
| no | no |
'------------------------------------------------'
But the bot forms the table like this.
.------------------------------------------------.
| Username | Password |
|----------------------|-------------------------|
| amonggers | no
|
| no username for u | no
|
| not even this one | no
|
| no | no |
'------------------------------------------------'
Edit: I also console logged it and the output is a bit better than the discord bot one.
.------------------------------------------------.
| Username | Password |
|----------------------|-------------------------|
|amonggers | no
|no username for u | no
|not even this one | no
| no | no |
'------------------------------------------------'
[![Console Log created][3]][3]
Heres the command code
client.on("messageCreate", async (message) => {
if (message.content.toLowerCase().startsWith("=list")) {
connection.query("SELECT * FROM rbinfo", (err, results) => {
if (err) {
console.log(err)
}
const ascii = require('ascii-table');
var table = new ascii()
table.setHeading('Username', 'Password')
results.forEach(ok => table.addRow(ok.Username, ok.Password))
});
}
});
Any help at all is appreciated, thanks.

JavaScript Locale Number Manipulation

On my site I have a table with numerous numbers, and I'm doing simple math on them to find the best method for the user. The table looks something like this:
US locale
+-------+-------+------------+---------+----------------------------------------+
| Gain | Price | Price/Gain | Amount | Outcome (round(Price * Amount)) |
+-------+-------+------------+---------+----------------------------------------+
| 15.75 | 47 | 2.98 | 827,583 | 38,896,401 |
| 52.5 | 240 | 4.57 | 248,275 | 59,586,000 |
| 297.5 | 4,106 | 13.80 | 43,814 | 179,900,284 |
+-------+-------+------------+---------+----------------------------------------+
Here's how the table SHOULD look with the de-DE locale (notice the switching of the . and , characters)
+-------+-------+------------+---------+----------------------------------------+
| Gain | Price | Price/Gain | Amount | Outcome (round(Price * Amount)) |
+-------+-------+------------+---------+----------------------------------------+
| 15,75 | 47 | 2,98 | 827.583 | 38.896.401 |
| 52,5 | 240 | 4,57 | 248.275 | 59.586.000 |
| 297,5 | 4.106 | 13,80 | 43.814 | 179.900.284 |
+-------+-------+------------+---------+----------------------------------------+
The way my code works, each column is populated separately. So first, the Gain column is populated for all rows, formatted, and using jQuery, I changed the value of row n to the Gain. Then Price is calculated, and again the values are populated.
The issue arises when Price/Gain is calculated. For the US locale, everything is fine. But with the de-DE locale, the table actually ends up looking like this:
+-------+-------+------------+---------+----------------------------------------+
| Gain | Price | Price/Gain | Amount | Outcome (round(Price * Amount)) |
+-------+-------+------------+---------+----------------------------------------+
| 15,75 | 47 | 0,03 | 827.583 | 38.896.401 |
| 52,5 | 240 | 0,46 | 248.275 | 59.586.000 |
| 297,5 | 4.106 | 0,00 | 43.814 | 179.900 |
+-------+-------+------------+---------+----------------------------------------+
When the Price/Gain is being calculated, the , and . are being ignored from the Gain and Price columns. As you can see in the third row,
4.106 / 2975 = 0.0014 (rounded to 0.00, or 0,00)
This is also causing an issue with the Outcome, as the Price, again, is being parsed literally, rather than converted from de-DE to US first. So in the third row, again, we can see
4.106 * 43814 (this is parsed correctly for some reason) = 179,900 or 179.900
Here's how my code is publishing these values and reading them in when needed:
// This code populates the Gain field
var gain = grabPresetGain(); // grabs a hardcoded value from a JSON object
gain = addCommasToNumber(new Intl.NumberFormat("de-DE", {}).format(gain .toFixed(2)));
row += "<div class='col-lg-1 col-md-1 col-sm-1 col-xs-1 row-gain text-center'>" + gain + "</div>";
// This code populates the price field
outcome = addCommasToNumber(new Intl.NumberFormat("de-DE", {}).format(outcome));
$(this).children(".row-price").text(outcome);
// And finally this code populates the Price/Gain field
// for loop going through each row of the table
var gain = convertToNumber($(this).children(".row-gain").text());
var price = convertToNumber($(this).children(".row-price").text());
var pricePerGain = (price / gain);
pricePerGain = addCommasToNumber(new Intl.NumberFormat("de-DE", {minimumFractionDigits: 2, maximumFractionDigits: 2 }).format(pricePerGain .toFixed(2)));
$(this).children(".row-pricegain").text(pricePerGain );
And here's two of the helper functions being used:
function convertToNumber(x) {
if (typeof x == "string") {
x = x.replace(/\,/g,'');
}
return Number(x);
}
function addCommasToNumber(n) {
return n.toLocaleString();
}
All in all - is there a consistent way to parse, manipulate, and output numbers of different locales?
Any insight would be great as I'm pretty stuck as to what to do at the moment.
Thanks
Give formatJS a try. From the site:
FormatJS is a modular collection of JavaScript libraries for internationalization that are focused on formatting numbers, dates, and strings for displaying to people.
If you're just dealing with numbers, you might even be able to get away without using a library at all, and just directly accessing the window.Intl object.
See some examples here, on MDN.

Perform multiple ajax requests in background in Chrome extension

I have a situation where i need to hit multiple ajax requests via chrome extension and show the success as result in popup html of chrome extension.
I will loop the list of url(s) in array and perform in ajax requests. This works well until my chrome extension is open. But as soon as i click outside or change the tab, the extension gets closed and the script is terminated.
I have a button in my extension. When i click on it, i need to hit all the ajax in background and when i will open the extension(no matter how many times), it has to show how many requests are completed(basically the success result from ajax).
Can some one help me out with it.
Popup window, by design, is destroyed (and not hidden) every time it loses focus, which leads to script termination.
On the other hand, background pages (and to some extent, event pages) are designed to be "always there" and do lengthy processing or always-on event handling.
So, you need both: a background page to do the processing and the popup to display the UI.
The idea is as follows:
The background page has a message listener that can:
Initiate AJAX processing
Return the current progress by request
The background page emits a message every time the progress changes
The popup page, when opened, requests current progress from the background
After that, as long as it's opened, it listens to progress messages from the background.
Something like this:
+--------------+ message: request +--------------+ time
| Background | progress | Popup | |
| page | <------------------- | window | \|/
| | respond: stopped | |
| | -------------------> | ( display ) |
| | | ( start ) |
| | | ( button ) |
| | | |
| | message: | |
| | start AJAX | ( user ) |
| ( starts ) | <------------------- | ( clicks ) |
| ( AJAX ) | | |
| | | |
... ...
| | | |
| ( some ) | message: | |
| ( AJAX ) | progress N/M | ( update ) |
| ( done ) | -------------------> | ( progress ) |
| | | ( N/M ) |
| | +--------------+
| | ( popup )
| ( some ) | message: ( closes )
| ( AJAX ) | progress N+1/M
| ( done ) | ------ ??? (nothing listens)
| |
| | message: request +--------------+
| Background | progress | Popup |
| page | <------------------- | window |
| | respond: N+1/M | |
| | -------------------> | ( display ) |
| | | ( progress) |
| | | ( N+1/M ) |
| ( some ) | message: | |
| ( AJAX ) | progress N+2/M | ( update ) |
| ( done ) | -------------------> | ( progress ) |
| | | ( N+2/M ) |
... ...
Example implementation of the background page:
var done = 0;
var total = 0;
var processing = false;
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
switch (message.type) {
case "queryProgress":
sendResponse({
processing: processing,
total: total,
done: done
});
break;
case "startProcessing": // Assumes the list of AJAX to process
doAllAJAX(message.list); // is passed in the message
break;
}
});
function doAllAJAX(list) {
total = list.length;
done = 0;
processing = true;
/* Initiate AJAX processing here for the list with onAJAXSuccess as a callback */
}
function onAJAXSuccess() {
done++;
if (done == total) { processing = false; }
chrome.runtime.sendMessage({
type: "progressReport",
processing: processing,
total: total,
done: done
});
}
Implementation of the AJAX, error handling and the popup left as an exercise for the reader.

preserve spaces in string java, javascript

I am sending data from java code to browser via http request.
data is something like this.
JAVA CODE OUTPUT
| Id | Operation | Name | Rows | Bytes | Cost (%CPU)| Time |
| 0 | SELECT STATEMENT | | | | 3 (100)| |
| 1 | FOR UPDATE | | | | | |
| 2 | BUFFER SORT | | | | | |
| 3 | TABLE ACCESS FULL| DD | 4 | 160 | 3 (0)| 00:00:01 |
But when I display it in browser it looks very bad.
Basically I have array of string which I am displaying in browser by using ng-repeat.
when I display it in java code it looks fine, but in browser not so good.
I did tried preserve white spaces but it did not help.
All i need to do is preserve all spaces in string.
{
white-space: pre;
}
Any idea help?
BROWSER OUTPUT.
The easiest way is to wrap it in pre tags, but the best way is to use HTML table cells.
<pre>
| Id | Operation | Name | Rows | Bytes | Cost (%CPU)| Time |
| 0 | SELECT STATEMENT | | | | 3 (100)| |
| 1 | FOR UPDATE | | | | | |
| 2 | BUFFER SORT | | | | | |
| 3 | TABLE ACCESS FULL| DD | 4 | 160 | 3 (0)| 00:00:01 |
</pre>
You need to use a monospace font (so that every letter has the same width).
You can do this using css:
{
font-family: "Courier New", Courier, monospace;
}

How to auto-update date field on firebase using ng-grid

I have a date field (called: lastUpdate) on a firebase db.
How could I update that field using ng-grid on change from another field (say a separte field called: notes)?
Im using the following code to update my records on edit:
var cellEditableTemplate = "<input ng-class=\"'colt' + col.index\"
ng-input=\"COL_FIELD\" ng-model=\"COL_FIELD\"
ng-change=\"updateEntity(col,row)\"/>"
$scope.updateEntity = function (col, row) {
$scope.dblogs.$save(row.entity.$id);
};
Posted Below is my sample db being used:
uniqueIDajsdljfasdjfajsdf;jasdj
|
|
--->ticket
| |
| -->completed: true
| |
| -->dateUpdated: "(last activity date/time)"
| |
| -->notes: "need to update logger code today!"
|
---->username: "vr"

Categories