I have implemented some cucumber after hooks. But without the priority order, I can not control which After hooks should run first. Sample code as follows
defineSupportCode(({ After, Before }) => {
After({ tags: '#dismiss_alert_after' }, () => {
ActionUtil.click(element(by.partialButtonText('Okay')));
});
After(function (testCase: TestCase) {
const signout: Signout = new Signout();
return !(testCase.result.status === 'failed') ?
signout.signoutApplication() : Promise.resolve();
});
});
The ends of the test steps execution, first it's should execute the hook '#dismiss_alert_after' for scenarios which tagged as '#dismiss_alert_after' and after that, it should run the signout hook. But it's doesn't. How can I control the order of the hooks? Help much appreciated. Thanks
After hooks are executed in the reverse order that they are defined.
https://github.com/cucumber/cucumber-js/blob/master/docs/support_files/api_reference.md
In Java is possible to configure the step order passing it as argument in the hook annotation, but I've not found docs about it in js, so I suppose it is not supported
Related
I was wondering if it was possible to use DOMPurify to sanitize user input on a form before it is saved to database. Here's what I've got in my routes.js folder for my form post:
.post('/questionForm', (req, res, next) =>{
console.log(req.body);
/*console.log(req.headers);*/
const questions = new QuestionForm({
_id: mongoose.Types.ObjectId(),
price: req.body.price,
seats: req.body.seats,
body_style: req.body.body_style,
personality: req.body.personality,
activity: req.body.activity,
driving: req.body.driving,
priority: req.body.priority
});
var qClean = DOMPurify.sanitize(questions);
//res.redirect(200, path)({
// res: "Message recieved. Check for a response later."
//});
qClean.save()
.then(result => {
//res.redirect(200, '/path')({
// //res: "Message recieved. Check for a response later."
//});
res.status(200).json({
docs:[questions]
});
})
.catch(err => {
console.log(err);
});
});
I also imported the package at the top of the page with
import DOMPurify from 'dompurify';
When I run the server and submit a post request, it throws a 500 error and claims that dompurify.sanitize is not a function. Am I using it in the wrong place, and/or is it even correct to use it in the back end at all?
This might be a bit late, but for others like me happening to run into this use case I found an npm package that seems well suited so far. It's called isomorphic-dompurify.
isomorphic-dompurify
DOMPurify needs a DOM to interact with; usually supplied by the browser. Isomorphic-dompurify feeds DOMPurify another package, "jsdom", as a dependency that acts like a supplementary virtual DOM so DOMPurify knows how to sanitize your input server-side.
In the packages' own words "DOMPurify needs a DOM tree to base on, which is not available in Node by default. To work on the server side, we need a fake DOM to be created and supplied to DOMPurify. It means that DOMPurify initialization logic on server is not the same as on client".
Building on #Seth Lyness's excellent answer --
If you'd rather not add another dependency, you can just use this code before you require DOMPurify. Basically what isometric-dompurify is doing is just creating a jsdom object and putting it in global.window.
const jsdom = require('jsdom');
const {JSDOM} = jsdom;
const {window} = new JSDOM('<!DOCTYPE html>');
global.window = window;
For some context: I am collecting data from my API using axios and adding it to the Vuex store in my Nuxt application using nuxtServerInit. I am using name-spaced modules as recommended in the docs to dispatch requests from my index.js file.
The problem is that while this technically works (everything is set in the store correctly), I end up with a long list of await dispatch(...) expressions in my index.js file. This does not seem to be a very efficient approach (or what the intended use is as I can't find a similar configuration in any of the docs) and I am wondering if I have misunderstood either the axios or nuxt documentation in my implementation. I have been looking into Promise.all() but cannot see how I would implement it here. Hopefully someone has some advice!
This is an example of the configuration I have arrived at with this approach:
app/store/index.js
export const actions = {
async nuxtServerInit ({ commit, dispatch }) {
await dispatch('endpointOne/storeDispatchInit')
await dispatch('endpointTwo/storeDispatchInit')
await dispatch('endpointThree/storeDispatchInit')
...
...
}
}
app/store/endpointOne.js
export const actions = {
async storeDispatchInit ({ commit }) {
const { data } = await axios.get(`${this.$axios.defaults.baseURL}/endpoint-1`)
commit('SET_ALL', data)
}
}
I would also be quite happy to hear that this is the correct configuration after all...!
Starting to use Vue + Rethink, love the concepts of both of them and am starting to create a simple todo list.
I've got a skeleton app done with Vue + Express + RethinkDB working properly with CRD (no update yet) operations. Everything is dandy, but of course the data is not real time. When I insert a task/todo item, I need to refresh the page to see it appear,etc.
I've looked into RethinkDB's change feeds, which looks interesting, but I'm not 100% sure how to implement them into my current Express API setup.
I found a few examples playing around with Socket.io and now I am trying to implement that into my setup as well (is this necessary??).
My codebase is all up here : https://github.com/patrickbolle/vue-todo
Here's an example of my TaskList.vue component where I will display all the items -
import TaskNew from './TaskNew'
var socket = io.connect('http://localhost:8099');
export default {
components: {
TaskNew
},
data () {
return {
tasks: []
}
},
created () {
this.$http.get('http://localhost:8090/api/tasks').then(response => {
this.tasks = response.data
})
var vm = this
socket.on('tasksSocket', function (task) {
vm.tasks.push(task)
})
},
This sort of works, when I create a new task by posting to my API, a (blank) task appears, but none of my pre-existing tasks are shown.
Here is my GET route for /tasks:
//GET - All Tasks
router.get('/tasks', (req, res) => {
r.table("tasks").changes().run().then(function(cursor) {
cursor.each(function(err, task) {
io.sockets.emit("tasksSocket", task);
})
})
})
Honestly I'm just confusing myself more and more, I come from a Meteor background so doing this web socket/API stuff is confusing for me.
If anyone could just give me a pointer in the right direction I would be very grateful.
Essentially I need to :
- Retrieve tasks from my GET /api/tasks route
- Grab NEW tasks from the socket... which is also on the GET /api/tasks route?
- Display them in Vue JS
I'm trying to learn a little bite of Meteor. This is my event on the client side:
Template.todos_list.events({
'click .todo-done': function () {
console.log(this);
Meteor.call('updateToDo', this._id, !this.completed);
},
'click .single-delete': function () {
Meteor.call('singleDelete');
//Todos.remove(this._id); **<-- this works when insecure is activated**
console.log('clicked the ' + this._id)
}
});
Server Side:
Meteor.methods({
addTodo: function (title) {
Todos.insert({
title: title,
completed: false
})
},
singleDelete: function() {
Todos.remove({_id: this._id});
}
});
I also tried just to use Todos.remove(this._id) at the server side but it doesn't work, either. It somehow only works on the client side.
What am I missing?
Thanks to all of you,
Amir
I think yo have to pass the _id of your object to your singleDelete function.
Changes on client Side:
Meteor.call('singleDelete', this._id);
and the changes on server Side:
singleDelete: function(todoId) {
Todos.remove({_id: todoId});
}
// Edit: I've added a short link to the Javascript this behavior:
https://www.discovermeteor.com/blog/javascript-for-meteor search for 'This'
Basically, the this keyword lets you access the object on which you’re currently working: just like a chameleon, this keeps changing based on its surroundings.
// Edit2: Another great reference: http://bonsaiden.github.io/JavaScript-Garden/#function.this
How this Works
JavaScript has a different concept of what the special name this refers to than most other programming languages. There are exactly five different ways in which the value of this can be bound in the language.
I have a Kendo UI autocomplete bound to a remote transport that I need to tweak how it works and am coming up blank.
Currently, I perform a bunch of searches on the server and integrate the results into a JSON response and then return this to the datasource for the autocomplete. The problem is that this can take a long time and our application is time sensitive.
We have identified which searches are most important and found that 1 search accounts for 95% of the chosen results. However, I still need to provide the data from the other searches. I was thinking of kicking off separate requests for data on the server and adding them the autocomplete as they return. Our main search returns extremely fast and would be the first items added to the list. Then as the other searches return, I would like them to add dynamically to the list.
Our application uses knockout.js and I thought about making the datasource part of our view model, but from looking around, Kendo doesn't update based on changes to your observables.
I am currently stumped and any advice would be welcomed.
Edit:
I have been experimenting and have had some success simulating what I want with the following datasource:
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: window.performLookupUrl,
data: function () {
return {
param1: $("#Input").val()
};
}
},
parameterMap: function (options) {
return {
param1: options.param1
};
}
},
serverFiltering: true,
serverPaging: true,
requestEnd: function (e) {
if (e.type == "read") {
window.setTimeout(function() {
dataSource.add({ Name: "testin1234", Id: "X1234" })
}, 2000);
}
}
});
If the first search returns results, then after 2 seconds, a new item pops into the list. However, if the first search fails, then nothing happens. Is it proper to use (abuse??) the requestEnd like this? My eventual goal is to kick off the rest of the searches from this function.
I contacted Telerik and they gave me the following jsbin that I was able to modify to suit my needs.
http://jsbin.com/ezucuk/5/edit