teleren/devto huggingface dataset:
Selenium WebDriver and Dynamic Locators
Tags: testing, webdev, python
Published: 2018-11-07 15:57:11

---
title: Selenium WebDriver and Dynamic Locators
published: true
description: Dealing with Dynamic Locators in Selenium WebDriver
tags: testing, webdev, python
---

As we all know, functional testing scripts that run through the UI need stable locators in order to locate the elements.

Selenium uses the following locator strategies:
• ID
• Name
• Class Name
• XPath
• CSS Selector
• Tag Name
• Link Text
• Partial Link Text

But what happens if none of those locators are stable? 
What happens if even the ID is dynamic and changes with each rendering of the page? 

Let's say you want to click on the Register button, which has the **register_312312312** ID.

![Selenium dynamic ID](https://i.imgur.com/6SyB3KR.png)

The classic way to write the Selenium code would be something like this:

{% gist https://gist.github.com/razgandeanu/6fd69b28470ab40421a2bf1a37a9319f %}

But that won't work, because the next time when you run your test and the page is rendered, it will have a different ID.

We could also write a custom CSS Selector, but our purpose here is to find the ID of that element and use it in our test.

We need to grab on to something that makes that element unique, perhaps an attribute. 

But we will need to use JavaScript in order to achieve that. 

Luckily, Selenium has the execute_script() method for such cases.

As we can see, the Register button has an attribute named **title** which has the value **Register**. This is what makes this element unique on that page.

This is the JavaScript code that you would have to execute in order to find that element and get the ID:
{% gist https://gist.github.com/razgandeanu/abfcf473adc4d9806a6ca87ed1c129ef %}

We just have to add that JavaScript code into a variable and execute it in our Selenium code:
{% gist https://gist.github.com/razgandeanu/e5b2cc5f2946d1a94d93bf12cebefc87 %}

Notice how I'm returning that variable which contains the ID to a Python variable. After that, I'm clicking on the element by locating it with the ID from that Python variable.

And voilà, we did it! 
We are now handling dynamic locators with Selenium WebDriver.

This can also be executed in [Endtest](https://endtest.io):
![Endtest dynamic ID](https://i.imgur.com/8C8Nim2.png)
{% youtube 4DIVKcs--TA %}
Javascript object literal syntax I had never seen
Tags: javascript
Published: 2018-11-07 15:20:24

---
title: Javascript object literal syntax I had never seen
published: true
description: 
tags: javascript
---

I encountered the following code when I was working through [meteor tutorial](https://www.meteor.com/tutorials/blaze/forms-and-events).

```javascript
{
  'submit .new-task'(event) {
    // some code here
  },
}
```

I was very confused because I had never seen an object literal that contains some string followed by an anonymous function. After I read the [MDN web docs about object initializer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#Method_definitions), I know that the code above is equivalent to the following:

```javascript
{
  'submit .new-task': function(event) {
    // some code here
  },
}
```

The syntax looks very odd to me maybe because I am simply not got used to it.
Should you have a staging server for testing?
Tags: discuss, testing
Published: 2018-11-07 15:18:08

---
title: Should you have a staging server for testing?
published: true
description: Is it worth having a staging server for testing?
tags: discuss, testing
---

I read this article about [staging servers](https://launchdarkly.com/blog/staging-servers-are-dead-long-live-a-staging-server/) not being considered a good practice. What do you think? Are they worth keeping around? Should everything just be feature flagged or is it worth building out separate environments? Have you experienced working with or without a staging server to test your code?
Most Popular Development Posts Of The Week (07 November 2018)
Tags: ionic, react, webdev, javascript
Published: 2018-11-12 14:04:24

---
title: Most Popular Development Posts Of The Week (07 November 2018)
published: true
tags: ionic,react,webdev,javascript
canonical_url: https://medium.com/daily-now/most-popular-development-posts-of-the-week-07-november-2018-e277adbbe20f
cover_image: https://cdn-images-1.medium.com/max/1024/1*q2ocOKqwVCSYXUY4142tZg.jpeg
---

<figcaption>Diligence is the mother of good luck</figcaption>

- [Five Must-Have Tools for Developers in 2019](https://app.dailynow.co/r/8d9ca95c1a9c6d9d4d135b1c1bafa194) by [Shachar Shamir](https://medium.com/u/216c37287e57)
- [Why Object.is() is better than ‘==’ and ‘===’ ?](https://app.dailynow.co/r/066fe0697ba3cae4cb42bd9c9cf6e205) by [Maciej Trzciński](https://medium.com/u/8bd8c5fe74ea)
- [Someone made the ocean waves in .js as real as possible](https://app.dailynow.co/r/a1f2fd33b9e881a089b779c66c8fd2aa)
- [The Complete JavaScript Handbook](https://app.dailynow.co/r/2df59f328cc564e106de6f721e48de8f) by [Flavio Copes](https://medium.com/u/fe1c14f6cde)
- [Flashcards for Web Developers](https://app.dailynow.co/r/145052fc7cb4ffedc7898ee5ffd723a8)
- [Why JWT shouldn’t be stored in Local Storage](https://app.dailynow.co/r/a9509f9daaa815ea127d1893924b9227) by [Vikranth Kanumuru](https://medium.com/u/ccb56257fa61)
- [Ionic Vs React Native](https://app.dailynow.co/r/5d989e76004d430e58e44148231d4aaa)
- [Challenge yourself this #codevember!](https://app.dailynow.co/r/7e80758a4c0da1f6499fb5b4a0d9495e)
- [350 Free Online Programming Courses You Should Start Today](https://app.dailynow.co/r/f5d9eb15b6ae152f08756742dcf0ea61) by [Keyul](https://medium.com/u/b238bb512df4)
- [Design Patterns in Web Development](https://app.dailynow.co/r/af98eb4d615424a16a09eaae7a13fbc1)

* * *

[_Thanks to Daily_](https://www.dailynow.co/) _developers can focus on code instead of searching for news. Get immediate access to all these posts and much more just by opening a new tab._

![](https://cdn-images-1.medium.com/max/1024/1*m8Uf-6F4Q5AOp_wW6tbKSQ.jpeg)
Episode 5: Building a JSON API - Read and Update
Tags: node, mongodb, javascript, docker
Published: 2018-11-07 15:04:14

---
title: Episode 5: Building a JSON API - Read and Update
published: true
description: Episode 5 covers reading document lists and updating individual documents
tags: nodejs, mongodb, javascript, docker
series: building-a-json-api-with-express
cover_image: https://thepracticaldev.s3.amazonaws.com/i/3tib0h3qd7ls8hlmc0o0.png
---

{% youtube dQr-YJ3ighc %}

Continuing the series on building a JSON API with express, this episode covers basic reads, and updating documents by ID.
Ask me to review your Go code
Tags: go, discuss
Published: 2018-11-07 14:53:56

---
title: Ask me to review your Go code
published: true
description: Go code review
tags: go, discuss
---

Hi Gophers!

On my [package main](https://www.youtube.com/packagemain) Youtube channel I am doing code reviews of Go packages, CLIs, servers, tests, etc. If you just wrote a small-medium sized Go project and don't afraid to share it, you can send it to me for review.

If it becomes an interesting review I will make a video about it.

Thank you!
Alex.
OpenBSD ftpd 6.4: FTP server
Tags: openbsd, ftp, ftpd, server
Published: 2018-11-07 14:35:59

---
title: OpenBSD ftpd 6.4: FTP server
published: true
description: OpenBSD has its own FTP server named ftpd. It's sufficient to transfer files among hosts in a simple and secure way. This post shows how to use it.
series: OpenBSD FTP server
tags: openbsd, ftp, ftpd, server
canonical_url: https://obsd.solutions/en/blog/2018/11/07/openbsd-ftpd-64-ftp-server/index.html
cover_image: https://thepracticaldev.s3.amazonaws.com/i/woy7inb8lspw6jeviu21.jpg
---

## Summary

[OpenBSD](https://www.openbsd.org/) has its own FTP server called [ftpd](https://man.openbsd.org/ftpd).
It's sufficient to transfer files among hosts in a simple and secure way.

## How To Use

`ftpd` is installed as a daemon in OpenBSD as the OS is installed.
In order to use it, run `rcctl enable` and `rcctl start`, and it's almost done.

### Step 0: Before Configuration

The daemon is disabled by default:

```console
$ doas rcctl check ftpd
ftpd(failed)
```

### Step 1: Enable Daemon

```console
$ doas rcctl enable ftpd
```

*\* Note: Here, `/etc/rc.conf.local` is updated:*

```console
$ cat /etc/rc.conf.local
ftpd_flags=
```

### Step 2: Start Daemon

```console
$ doas rcctl start ftpd
ftpd(ok)
```

FTP server is now running.
As long as there is no network issues, you can establish ftp connection to the server 😉
*\* Note: Accessing as `root` is forbidden.*

## Reference: Additional Configuration

OpenBSD provides us [several files](https://man.openbsd.org/ftpd#FILES), that is several ways, to add more configuration about such as `chroot` and authentication.
Two the most fun sitcoms for a younger generation.
Tags: sitcoms, fun, life
Published: 2018-11-07 09:37:30

---
title: Two the most fun sitcoms for a younger generation.
published: true
description: 
tags: sitcoms, fun, life
---

I've heard that in US there are reruns of these shows on television. But I don't have TV and you maybe as well. I don't want you to miss such treasures.

While I wouldn't say I'm old, I'm still a little bit older than someone. I was born in 1989.

In this little article I want to address young folks who are 10 years younger than me.

You may feel boring at time and you maybe looking for something to read or watch. Here's what I recommend you to watch:

The first sitcom is [Friends](https://www.imdb.com/title/tt0108778/?ref_=nv_sr_1).

It's about friendship, craziness, fun, humor, and not taking it too seriously.

The second one is [Seinfeld](https://www.imdb.com/title/tt0098904/?ref_=nv_sr_1).

This one is very meta like. What do I mean is that the sitcom is about Seinfeld himself. He's a stand up comic. In every episode there is an opening or closing with his stand up. I wouldn't say he is the best in terms of stand up. It's a question of taste. But he is the best comedian for sure. Or should I say actor comedian?

But this is not all. There are episodes where Seinfeld and his friend George decided to write a TV series about themselves and their lives. Seinfeld in Seinfeld.

At first I neglected watching Seinfeld because I watched a couple of episodes from first season and just wasn't hooked. But at some I'd see people rave about it and I thought why? I pushed myself to watch more episodes and didn't regret it.

I want to show you one of my favorites scenes which is humorous and educational:

The opposite George

{% youtube u3k7lykTWTk %}
How To Create Custom Triangle Shape View In React Native
Tags: react, reactnative, javascript, android
Published: 2018-11-07 13:05:19

---
title: How To Create Custom Triangle Shape View In React Native
published: true
description: How To Create Custom Triangle Shape View In React Native
tags: #react #reactnative #javascript #android
---

Post Link : <a href="https://www.skptricks.com/2018/11/how-to-create-custom-triangle-shape-in-react-native.html" > How To Create Custom Triangle Shape View In React Native</a>

In this tutorial we are going to discuss how to create custom triangle design in react native application. Design & implementation of triangle shape is very easy and here we are going to use css stylesheet design for this. Lets follow the below steps and build more understanding.

<img src="https://2.bp.blogspot.com/-flpahLnCMsE/W-LgQVKNFsI/AAAAAAAACGo/Qs7o-UJXCXcQ48FnFsk8Jtbeg_rt3lMWgCLcBGAs/s640/tri.png" />

<a href="https://www.skptricks.com/2018/11/how-to-create-custom-triangle-shape-in-react-native.html" > Read More...</a>
How do /you/ write tests for React components?
Tags: discuss, react, tdd
Published: 2018-11-07 11:34:17

---
title: How do /you/ write tests for React components?
published: true
description: 
tags: discuss,react,tdd
---

I have tried many strategies to go about this. I did snapshot tests for most of the simpler components; but when there is redux and other libraries involved, doing a snapshot test for even a small component turns out to be too much work; unless you shallow render. Then, the only thing you accomplish from the test is whether or not the components render.

The best way to write unit tests is to write the tests first, that way you are only considering what output you need for different conditions and not worried about the implementation. In case of testing functionality of a component, I see tests that simulate button clicks and what not. Do you write the tests after the component is complete? Doesn't it make it harder to write tests for all the cases (your tests tend to get biased by the implementation)? Or do you write them as you are writing the component?

What is your approach to writing tests for the UI? I feel like I am missing something important.
A Detailed Tutorial: Shopify’s Storefront API + React + Redux
Tags: react, redux, shopify, tutorial
Published: 2018-11-07 09:31:01

---
title: A Detailed Tutorial: Shopify’s Storefront API + React + Redux
published: true
description: 
tags: react, redux, shopify, tutorial
---

This is a tutorial I wrote over the summer, and while the steps and changes were implemented on my _own_ e-commerce site, I finally finished (just yesterday!) the [boilerplate code repository](https://github.com/frewinchristopher/react-redux-shopify-storefront-api-example) that includes all the steps in the tutorial. 

This tutorial is about leveraging Redux so that you can put checkout and product components from the Shopify storefront API anywhere, on any page of an e-commerce site easily, without having to pass event handlers and parts of state all around to children components and so on.

The tutorial can be found on our Medium publication, [the Siren Apparel Press.](https://medium.com/siren-apparel-press/adding-shopifys-storefront-api-to-an-existing-react-app-with-react-redux-ea442bd7543)
use conditional breakpoints to call console.log
Tags: javascript, debugger, browser
Published: 2018-11-07 11:19:58

---
title: use conditional breakpoints to call console.log
published: true
description: chrome inspector debugger can break conditionally and can log too
tags: javascript, debugger, browser
---

This is something so simple i wonder why i did not think of it before:

![Just like that](https://thepracticaldev.s3.amazonaws.com/i/65deckmx8kvjhefqqxdn.png)
JavaScript error handling with better `dx`
Tags: javascript, errors, go, node
Published: 2018-11-07 08:23:04

---
title: JavaScript error handling with better `dx`
published: true
description: No, we're not talking about calculus derivatives!
tags: javascript, error handling, golang, nodejs
cover_image: https://user-images.githubusercontent.com/914228/48119153-5b66da00-e223-11e8-9eb5-534879825f68.jpg
---

JavaScript expects you to handle errors with `try...catch`, but the syntax is somewhat inconvenient:

#### 1. You have to declare result variables _separately_ from your function calls.

```js
const userInput = 'fail'

let json
try {
  json = JSON.parse(userInput)
} catch (err) {
  console.error(err.stack)
}

// Do something with `json`...
```

Since we declare `json` separately, we can't declare `json` as a `const` binding.

#### 2. `try...catch` promotes catch-all error handling.

```js
try {
  // A bunch of stuff happens...
  // ...
  // ...
} catch (err) {
  console.log('welp')
  console.error(err.stack)
}
```

You might want to handle errors in a more fine-grained way. But then you run into the verbosity of problem 1.

<br>

## Enter `dx`

`dx` is a micro utility (it's just a few lines) that addresses the two pain points above.

```js
import { dx } from '@nucleartide/dx'

const [res, err] = dx(JSON.parse)('invalid json')
if (err) {
  console.error(err.stack)
}
```

It allows you to place your declaration and function call on the same line. And it promotes a granular, _per-function_ error handling style.

It also works with async functions:

```js
import { dx } from '@nucleartide/dx'

function asyncHello(name) {
  return Promise.reject(`hello ${name}`)
}

;(async () => {
  const [res, err] = await dx(asyncHello)('jesse')
  if (err) {
    console.error(err.stack)
  }
})
```

<br>

## Convinced?

Try it out and lemme know what you think! Also feel free to check out the [source](https://github.com/nucleartide/dx).

```bash
npm install @nucleartide/dx
```
Linux ホームのサブディレクトリ名を英語にする
Tags: linux, install, japanese, english
Published: 2018-11-07 06:47:59

---
title: Linux ホームのサブディレクトリ名を英語にする
published: true
description: Linux ディストリビューションをデスクトップ環境付きでインストールすると、多くの場合、ホーム内にデフォルトでいくつかのディレクトリが作成されます。インストールを「日本語」設定で行った場合、これらのディレクトリの名前は日本語になります。この名前を英語（アルファベット）に変更する方法をご紹介します。
tags: linux, install, japanese, english
---

### はじめに

Linux ディストリビューションをデスクトップ環境付きでインストールすると、多くの場合、ホーム内にデフォルトでいくつかのディレクトリが作成されます。
デスクトップのファイルを格納するディレクトリ、音楽ファイルを格納するディレクトリなどです。

![](https://thepracticaldev.s3.amazonaws.com/i/xe76yimztlwbxjxpg4ku.png)
<center>Manjaro Linux の Cinnamon デスクトップの場合</center>

インストールを「日本語」設定で行った場合、これらのディレクトリの名前は日本語になります。
デスクトップは「デスクトップ」、ダウンロードファイルの保存先は「ダウンロード」と言ったような感じです。

この名前を英語（アルファベット）に変更する方法をご紹介します。
一つのコマンドを実行するだけでほぼ完了します。

### 対応方法

端末（ターミナル）を開きます。
次のように入力して Enter キーを押します:

```shell-session
$ LANG=C xdg-user-dirs-gtk-update
```

*\* 注意: 冒頭の `$ ` は一般ユーザーによる実行であることを表します。入力は不要です。*

*\* 補足: まれなケースだとは思いますが、デフォルトのシェル環境を bash 以外にしている場合は、Enter キーを押すとエラーになるはずです。`bash` と入力して Enter キーを押してください。`exit` を実行するまでの間、シェル環境を bash に切り替えられます。その状態で改めて上のコマンドを実行してください。*

以下のようなウィンドウが表示されるので、右下の「Update Names」を押します。

![](https://thepracticaldev.s3.amazonaws.com/i/sy7pk6pa842ayrcy8yo5.png)

端末に以下のように出力されて、リネームが完了します。

```shell-session
Gtk-Message: 04:58:00.258: GtkDialog mapped without a transient parent. This is discouraged.
Moving DESKTOP directory from デスクトップ to Desktop
Moving DOWNLOAD directory from ダウンロード to Downloads
Moving TEMPLATES directory from テンプレート to Templates
Moving PUBLICSHARE directory from 公開 to Public
Moving DOCUMENTS directory from ドキュメント to Documents
Moving MUSIC directory from 音楽 to Music
Moving PICTURES directory from 画像 to Pictures
Moving VIDEOS directory from ビデオ to Videos
```

*\* 補足: OS を次回起動した時に、以下のようなウィンドウが表示される場合があります。その場合は、「古い名前のままにする」を選択してください。*

![](https://thepracticaldev.s3.amazonaws.com/i/hv2qo86fhmpptfuoxgr1.png)

### 参考: 設定の保存先

`~/.config/user-dirs.dirs` に保存されています:

```shell-session
$ cat ~/.config/user-dirs.dirs 
# This file is written by xdg-user-dirs-update
# If you want to change or add directories, just edit the line you're
# interested in. All local changes will be retained on the next run.
# Format is XDG_xxx_DIR="$HOME/yyy", where yyy is a shell-escaped
# homedir-relative path, or XDG_xxx_DIR="/yyy", where /yyy is an
# absolute path. No other format is supported.
# 
XDG_DESKTOP_DIR="$HOME/Desktop"
XDG_DOWNLOAD_DIR="$HOME/Downloads"
XDG_TEMPLATES_DIR="$HOME/Templates"
XDG_PUBLICSHARE_DIR="$HOME/Public"
XDG_DOCUMENTS_DIR="$HOME/Documents"
XDG_MUSIC_DIR="$HOME/Music"
XDG_PICTURES_DIR="$HOME/Pictures"
XDG_VIDEOS_DIR="$HOME/Videos"
```

### 終わりに

アルファベット名のディレクトリのメリットとして、キータッチでジャンプできるというものがあります。
例えば「ダウンロード」は「Downloads」になるため、キーボード上で、名前の最初の文字である「d」を押すことで、ディレクトリにフォーカスを当てられるようになります。
（ただし、他にも「d」始まりのディレクトリがある場合は、「d」を複数回押して移動して行くか、もしくは「dow」などとユニークな文字列になるまで入力を続ける必要があります。）
GUI ベースでマウスを操作するよりも、直接的です。

端末（ターミナル）でコマンド操作を行う上でも、非常に便利になります:

```shell-session
$ cd ダウンロード # 半角入力と全角入力を切り替える必要があります
$ cd Downloads  # 半角入力だけで入力を完了できます
```
c# Task Runner Or cron job?
Tags: c
Published: 2018-11-07 06:38:32

---
title: c# Task Runner Or cron job?
published: true
description: Hello, I have c# web project i need to run in background in task scheduler or how i can switch my project to servservice 
tags: c# 
---

Hello, I have c# web project i need to run in background in task scheduler or how i can switch my project to webservice
AnyChart JS Charts Extension for Qlik Sense Gets Gantt Chart and Tag Cloud in V 2.5.0
Tags: qlik, datavisualization, webdev, qliksense
Published: 2018-11-07 05:52:02

---
title: AnyChart JS Charts Extension for Qlik Sense Gets Gantt Chart and Tag Cloud in V 2.5.0
published: true
description: AnyChart JS Charts released the 2.5.0 version of the data visualization extension for Qlik Sense, now with Gantt charts and Tag clouds, planning to add Sankey diagrams in the next major update.
tags: #qlik, #datavisualization, #webdev, #qliksense
canonical_url: https://www.anychart.com/blog/2018/11/06/qlik-gantt-chart-tag-cloud-extension/
cover_image: https://i.imgur.com/5LIJ9VO.png
---

A few weeks after [release 8.4.0 of AnyChart JS Charts](https://dev.to/andreykh1985/anychart-840-released-with-js-sankey-diagram-and-other-improvements-3jc5), major [update 2.5.0 for AnyChart's data visualization extension for Qlik Sense](https://www.anychart.com/blog/2018/11/06/qlik-gantt-chart-tag-cloud-extension/) has been launched, adding Gantt Chart and Tag Cloud to the list of supported chart types. Sankey Diagram is expected to be delivered in version 2.6.0 in late 2018.
Daylight Savings is stupid.
Tags: discuss
Published: 2018-11-07 04:42:29

I hate daylight savings. As someone who lives in Arizona i don't celebrate your ancient pagan time sacrifice.

Because of this silly ritual I have had a hell of a time scheduling all my students since Sunday. In the words of Filthy Frank... 
![](https://thepracticaldev.s3.amazonaws.com/i/qvg8skahyvxdg9owj06d.gif)
Object detection Part 1 - Create custom dataset [Tensorflow]
Tags: objectdetection, tensorflow, java, training
Published: 2018-11-07 04:41:18

---
title: Object detection Part 1 - Create custom dataset [Tensorflow]
published: true
description: We build TFRecord file using java and talking about how to easily label your images for object detection.
tags: object detection, tensorflow, java, training
---

{% youtube G_Ey8-cZJJo %}
Please Explain me 😅 How does the mongoose virtual() work?
Tags: mongoose, mongodb, discuss, explainlikeimfive
Published: 2018-11-07 04:13:01

---
title: Please Explain me 😅 How does the mongoose virtual() work? 
published: true
description: Explain me like I'm five
tags: mongoose, mongodb, discuss, #explainlikeimfive
---

Just spoted mongoose had virtual() option on it. Can it be the way of combining other document by reference? And how to use it? I found many article explain how to use it but just by simple example links.
[futurestudio blog](https://futurestud.io/tutorials/understanding-virtuals-in-mongoose)
[the doc itself](https://mongoosejs.com/docs/2.7.x/docs/virtuals.html)

```javascript
UserSchema.virtual('companies', {
    ref: 'Company',
    localField: '_id',
    foreignField: 'users.user',
    justOne: false,
});
```

found that code on github but still doesn't understand what it means... and how to use it.

[the code in github](https://github.com/brianalois/node_rest_api_mongo/blob/master/models/user.model.js)

Thanks ! ☺️