Extract the non-tagged contents of HTML in browser

Yes, you can use the RegularExpression of cource. But, there is cool idea, how to extract tagged content in browser:

JS String padding

Sometimes we want the string to have a specific length. We can use the padStart and padEnd methods.

Removing Event Listeners with AbortController()

With the AbortControler you can cancel fetch request but remove Event Listeners too.

Let's look at an example:

You can use one signal to remove multiple listeners:

Promise with timeout

When you use await, it will wait until the Promise is either resolved or rejected. But sometimes API requests we make don’t get any response from the server.

You can use AbortController to abort one or more Web requests. The second way to solve this is to create a promise with a timeout.

Pipes and error handling

When using pipe(), the error events are not propagated automatically through the pipeline:

We will catch only the errors coming from stream2. 

If we want to catch any error generated from stream1 , we have to attach another error listener directly to it:

---

pipeline() helper function

You can use the pipeline() from the core stream package.

This pipes every stream passed in the arguments list to the next one. For each stream, it will also register a proper error and close listeners.

Vue3 - Attribute Inheritance

The child component by default inherit the declared attributes. Vue3 calls it the Fallthrough Attributes.

A "fallthrough attribute" is an attribute or v-on event listener that is passed to a component, but is not explicitly declared in the receiving component's props or emits. Common examples of this include class, style, and id attributes.

If you do not want a component to automatically inherit attributes, you can set inheritAttrs: false in the component's options. These fallthrough attributes can be accessed directly in template expressions as $attrs.

Example:

Optional object property with spread operator

I saw cool magic in my previous project. The optional object property.

Let see example: