als-layout 5.1.0 → 6.0.0

package/docs/#.md

@@ -0,0 +1,19 @@
+# als-layout Documentation
+
+`als-layout` is a JavaScript library designed to simplify and enhance the process of constructing and managing web page layouts. It provides a comprehensive API for modifying HTML documents dynamically, allowing developers to add, update, and manipulate various elements such as meta tags, styles, scripts, and more.
+
+The `als-layout` library is versatile, suitable for:
+- Building dynamic web pages that require frequent updates to their metadata, styles, or scripts.
+- Creating templating systems where multiple page layouts share similar structures but differ in content or styling.
+- Developing web applications that need to dynamically adjust their UI based on user interactions or data changes.
+
+## Installation and Adding
+To use the `als-layout` library in your project, you can install it via npm and then include it in your JavaScript files:
+
+```bash
+npm i als-layout
+```
+
+```js
+const Layout = require('als-layout')
+```

package/docs/0-change-log.md

@@ -0,0 +1,10 @@
+## Change Log for V6
+
+The code refactored.
+
+### Removed
+  * no deepclone for options, using { ...Layout.options, ...options } instead
+  * no onload method
+### Added
+  * status
+  * end(res)

package/docs/1-basic-usage.md

@@ -0,0 +1,37 @@
+## Basic Usage
+
+### Initialization
+To start using `als-layout`, you first need to create a new instance of `Layout`. This instance will serve as the foundation for building and modifying your web page.
+
+```js
+const Layout = require('als-layout');
+const layout = new Layout();
+```
+
+### Adding Different Elements
+Once you have your `Layout` instance, you can easily add or modify various elements of your web page. Here are some examples of how you can use the library to customize your layout:
+
+```js
+const layout = new Layout()
+   .viewport() // default width=device-width, initial-scale=1.0
+   .title('Test title') // adding/updating title and meta[og:title]
+   .favicon('/favicon.png') // adding/updating link[rel=icon][type=image/x-icon] with new href
+   .keywords(['some', 'keyword']) // adding/updating meta[name=keywords]. not adding existing keywords
+   .image('/main-image.png', '1.5') // adding/updating meta - og:image, twitter:image, twitter:card
+   .description('Cool site') // adding/updating meta og:description, twitter:description, and description tag
+   .url('/some', 'http://site.com') // adding/updating meta[og:url] and link[rel="canonical"]
+   .style('body {margin:0; background-color:whitesmoke;}', true) // adding css styles to existing/new style tag. Second parameter is minified (default=false).
+   .link('/styles.css') // adding link[rel=stylesheet] if such href not exists
+   .script({src:'/app.js'}, '', true) // set script with src to head if such src not exists
+   .script({}, 'console.log("hello world")', false) // set script with script code to footer
+
+// Accessors for document parts
+layout.body // getter for body element (if not exists, created)
+layout.head // getter for head element (if not exists, created)
+layout.html // getter for html Element (if not exists, created)
+
+// Outputs
+layout.rawHtml // raw HTML of the document
+layout.clone // creates a new layout object clone for current object
+```
+

package/docs/2-cloning.md

@@ -0,0 +1,19 @@
+## Cloning Functionality
+
+### What is Cloning and Why is it Necessary?
+Cloning in the `als-layout` library refers to creating a complete, independent copy of the existing `Layout` instance. This functionality is crucial when you need to generate multiple pages or versions of a page from a single base layout without affecting the original setup.
+
+### How to Use Cloning
+To clone a `Layout` instance, simply use the `clone` method. This method creates a new `Layout` instance with the same properties and settings as the original, allowing for independent modifications without interference.
+
+```js
+const newLayout = layout.clone;
+```
+
+### Benefits of Cloning
+- **Efficiency:** Cloning is highly efficient, especially for creating pages with similar structures but different content or styles. It avoids the overhead of reinitializing and reconfiguring a new `Layout` instance from scratch.
+- **Speed:** Cloning is fast, typically taking less than 20ms even for large pages. This makes it ideal for high-performance web applications that need to dynamically generate content.
+- **Isolation:** Changes made to a cloned `Layout` do not affect the original, ensuring that each instance can be modified independently based on specific requirements.
+
+Cloning is particularly useful in scenarios where templates or base layouts are used repeatedly with slight variations, providing a robust and scalable solution for web page generation.
+

package/docs/3-advanced-usage.md

@@ -0,0 +1,48 @@
+## Advanced Usage
+
+The `als-layout` library allows for sophisticated manipulation of web page layouts, providing robust tools for creating dynamic and complex web pages. Below is an advanced example demonstrating various capabilities of the library:
+
+```js
+const Layout = require('als-layout')
+
+// Starting with a basic HTML template and specifying the host for URL methods
+const raw = /*html*/`<html></html>`
+const host = 'http://example.com';
+const options = {
+   logger,
+   host, 
+   minified=false
+}
+const layout = new Layout(raw, options).lang('fr')
+console.log(layout.rawHtml)
+// <!DOCTYPE html><html lang="fr"><head></p></head><body></body></html>
+
+// Cloning the initial layout to create a specialized page
+const homePage = layout.clone
+homeAutoReload = layout.clone
+homePage.title('Home page')
+homePage.body.innerHTML = /*html*/`<h1>Home page</h1>`
+console.log(homePage.rawHtml)
+// <!DOCTYPE html><html lang="fr"><head><title>Home page</title><meta property="og:title" content="Home page"></head><body><h1>Home page</h1></body></html>
+
+// Adding script that reloads the page every minute
+homeAutoReload.script({}, 'setTimeout(function() { window.location.reload(); }, 60000);', false)
+console.log(homeAutoReload.rawHtml)
+// <!DOCTYPE html><html lang="fr"><head><title>Automatic Reload Page</title><meta property="og:title" content="Automatic Reload Page"></head><body><script>setTimeout(function() { window.location.reload(); }, 60000);</script></body></html>
+
+// Demonstrating dynamic stylesheet linkage with versioning
+homePage.link('/css/main.css')
+console.log(homePage.rawHtml)
+// Includes link to the stylesheet with version parameter to ensure fresh cache
+```
+
+In this example:
+
+- We start with a basic HTML template and use the `lang` method to set the language.
+- We use the `clone` method to create two versions of the base layout: one for the home page and another that automatically reloads every minute.
+- We manipulate the `body` of the `homePage` to include custom HTML.
+- We add a script to `homeAutoReload` that sets up an automatic page reload, showcasing how to insert JavaScript dynamically.
+- We dynamically add a versioned link to a stylesheet in the `homePage`, demonstrating control over caching and resource management.
+
+This advanced example illustrates how `als-layout` can be used to handle complex scenarios and requirements in web development, enhancing the flexibility and power at your disposal.
+

package/docs/4-res-and-status.md

@@ -0,0 +1,10 @@
+## Response with status
+
+In version 6, added two methods:
+1. `status(statusCode)` - adds the statusCode to `__status` property
+2. `end(res)` 
+   1. writes head with `__status, { 'Content-Type': 'text/html' }` 
+   2. runs `res.end(this.rawHtml)`
+
+
+The main idea, is to add quick way to response with layout. 

package/docs/5-api.md

@@ -0,0 +1,97 @@
+## API
+
+### Constructor
+
+#### `new Layout(html: string, options: object)`
+
+Creates a new `Layout` instance.
+
+- **html**: The initial HTML document string.
+- **options**: Configuration options for the layout instance.
+  - **minified**: Boolean (default: `false`). Determines if inline CSS and JavaScript should be minified.
+  - **logger**: Function (default: `console`). Function for errors in minifiying and url method.
+  - **host**:  String (defult:`undefined`). String for url method. 
+
+
+### Properties
+
+#### `layout.rawHtml`
+
+Returns the inner HTML of the document.
+
+#### `layout.clone`
+
+Creates a clone of the current layout instance, preserving `options`.
+
+
+#### `__status`
+
+Stores the statusCode for `end` method.
+
+### Methods
+
+#### `lang(lang: string): this`
+
+Sets the `lang` attribute on the `<html>` element.
+
+#### `title(title: string): this`
+
+Sets the document title and creates an Open Graph title meta tag.
+
+#### `description(description: string): this`
+
+Adds description meta tags for SEO and social platforms.
+
+#### `favicon(href: string): this`
+
+Sets or updates the favicon URL.
+
+#### `meta(props: object): this`
+
+Adds or updates a `<meta>` tag with specified attributes.
+
+- **props**: An object where each key-value pair corresponds to a meta attribute.
+
+#### `keywords(keywords: array): this`
+
+Sets or appends keywords in the `content` attribute of a `<meta name="keywords">` tag.
+
+#### `viewport(viewport: string): this`
+
+Sets the viewport meta tag. Default: `width=device-width, initial-scale=1.0`.
+
+#### `image(image: string): this`
+
+Sets meta tags for Open Graph and Twitter cards for an image.
+
+#### `style(styles: string, minified: boolean = this.options.minified): this`
+
+Adds inline CSS to the document. If `minified` is true, the CSS is minified.
+
+- **styles**: CSS string.
+- **minified**: Boolean (optional).
+
+#### `url(url: string, host: string = this.URL): this`
+
+Sets the canonical URL and Open Graph URL meta tags.
+
+#### `script(attrs: object = {}, innerHTML: string = '', head: boolean = true, minified: boolean = this.options.minified): this`
+
+Adds a `<script>` tag to the document.
+
+- **attrs**: Attributes for the `<script>` tag.
+- **innerHTML**: Inline JavaScript (optional).
+- **head**: Boolean (default: `true`). If `false`, the script is added to `<body>`.
+- **minified**: Boolean. If true, inline JavaScript is minified.
+
+#### `link(href: string, attributes: object = { rel: "stylesheet", type: "text/css" }): this`
+
+Adds a `<link>` tag for external stylesheets.
+
+#### `status(statusCode:number): this`
+
+Adds the statusCode to `__status` property
+
+#### `end(res):undefined`
+
+Response with res(rawHtml)

package/lib/elements/index.js

@@ -0,0 +1,38 @@
+const meta = require('./meta')
+const script =  require('./script')
+const style =  require('./style')
+const addKeywords =  require('./keywords')
+const addLink =  require('./link')
+const addUrl = require('./url')
+
+const { SingleNode } = require('als-document');
+
+function getDescription(description,layout) {
+   meta({ name: 'description', content: description },layout)
+   meta({ property: 'og:description', content: description },layout)
+   meta({ property: 'twitter:description', content: description },layout)
+   return layout
+}
+
+function getFavicon(href,layout) {
+   const faviconElement = layout.root.$('link[rel=icon][type=image/x-icon]')
+   if (faviconElement) faviconElement.setAttribute('href', href)
+   else layout.head.insert(2, new SingleNode('link', { rel: 'icon', href, type: 'image/x-icon' }))
+   return layout
+}
+
+function getViewport(viewport = 'width=device-width, initial-scale=1.0',layout) {
+   const element = layout.root.$('meta[name="viewport"]')
+   if (element) element.setAttribute('content', viewport)
+   else layout.head.insert(2, new SingleNode('meta', { name: 'viewport', content: viewport }))
+   return layout
+}
+
+function getImage(image,layout) {
+   meta({ property: 'og:image', content: image },layout)
+   meta({ name: 'twitter:image', content: image },layout)
+   meta({ name: 'twitter:card', content: 'summary_large_image' },layout)
+   return layout
+}
+
+module.exports = { meta, getDescription, getFavicon, getViewport, getImage, script, style, addKeywords, addLink, addUrl }

package/lib/elements/keywords.js

@@ -0,0 +1,19 @@
+const { SingleNode } = require('als-document');
+
+function keywords(keywords = [],layout) {
+   let keywordsElement = layout.root.$('meta[name=keywords]')
+   if (!keywordsElement) keywordsElement = new SingleNode('meta', { name: 'keywords' })
+   const content = keywordsElement.getAttribute('content')
+   const existingKeywords = content ? content.split(',') : []
+   keywords.forEach(keyword => {
+      keyword = keyword.trim()
+      if (!existingKeywords.includes(keyword)) existingKeywords.push(keyword)
+   });
+   if (existingKeywords.length) {
+      keywordsElement.setAttribute('content', existingKeywords.join())
+      layout.head.insert(2, keywordsElement)
+   }
+   return layout
+}
+
+module.exports = keywords

package/lib/elements/link.js

@@ -0,0 +1,13 @@
+const { SingleNode } = require('als-document');
+
+function link(href, attributes = { rel: "stylesheet", type: "text/css" },layout) {
+   if (!href || typeof href !== 'string') return layout
+   const selector = `link[rel=stylesheet][href^="${href}"]`
+   let linkElement = layout.root.$(selector)
+   if (linkElement) return
+   linkElement = new SingleNode('link', { href, ...attributes })
+   layout.head.insert(2, linkElement)
+   return layout
+}
+
+module.exports = link

package/lib/elements/meta.js

@@ -0,0 +1,12 @@
+const { SingleNode } = require('als-document');
+
+function meta(props,layout) {
+   const entries = Object.entries(props)
+   const [name, value] = entries[0]
+   const selector = `meta[${name}="${value}"]`
+   const metaElement = layout.root.$(selector)
+   if (metaElement) entries.forEach(([name, v]) => metaElement.setAttribute(name, props[name]))
+   else layout.head.insert(2, new SingleNode('meta', props))
+}
+
+module.exports = meta

package/lib/elements/url.js

@@ -0,0 +1,18 @@
+const meta = require('./meta');
+const { SingleNode } = require('als-document');
+
+function addUrl(url, host,layout) {
+   try {
+      url = (host ? new URL(url, host) : new URL(url)).href.replace(/\/$/, '')
+      meta({ property: 'og:url', content: url },layout)
+      const canonicalElement = layout.root.$('link[rel="canonical"]')
+      if (canonicalElement) canonicalElement.setAttribute('href', url)
+      else layout.head.insert(2, new SingleNode('link', { rel: 'canonical', href: url }))
+} catch (error) {
+      console.log(error)
+      layout.logger.log(`url "${url}" with host "${host}" is not valid url`)
+   }
+   return layout
+}
+
+module.exports = addUrl

package/lib/layout.js

@@ -1,10 +1,12 @@
-const { Document, SingleNode } = require('als-document');
-const script = require('./script');
-const style = require('./style');
-const onloadScript = require('./onload');
+const { Document } = require('als-document');
+const { meta, getDescription, getFavicon, getViewport, getImage, script, style, addKeywords, addLink, addUrl } = require('./elements/index')
 
 class Layout extends Document {
+   static propsToClone = []; 
+   static options = { logger: console, host: '', minified: false }
+
    constructor(html, options = {}) {
+      options = { ...Layout.options, ...options }
       super(html, options.host);
       this.options = options
       this.logger = options.logger || console
@@ -13,13 +15,26 @@ class Layout extends Document {
 
    get rawHtml() { return this.innerHTML }
    get clone() { return new this.constructor(new Document(this, this.URL), this.options) }
-   lang(lang) { this.html.setAttribute('lang', lang); return this }
 
-   onload() {
-      const id = 'onload-script'
-      if(this.$('#'+id)) return
-      this.script({id}, onloadScript);
-      return this
+   __status = 200;
+   status(status) { this.__status = status; return this }
+   end(res) {
+      res.writeHead(this.__status, { 'Content-Type': 'text/html' })
+      res.end(this.rawHtml)
+   }
+
+   lang(lang) { this.html.setAttribute('lang', lang); return this }
+   link(href, attributes) { return addLink(href, attributes, this) }
+   keywords(keywords = []) { return addKeywords(keywords, this) }
+   style(styles, minified = this.options.minified) { return style(styles, minified, this) }
+   url(url, host = this.URL) { return addUrl(url, host, this) }
+   meta(props) { return meta(props, this) }
+   description(description) { return getDescription(description,this) }
+   favicon(href) { return getFavicon(href,this) }
+   viewport(viewport) { return getViewport(viewport,this) }
+   image(image) { return getImage(image,this) }
+   script(attrs = {}, innerHTML = '', head = true, minified = this.options.minified) {
+      return script(attrs, innerHTML, head, minified, this)
    }
 
    title(title) {
@@ -28,90 +43,6 @@ class Layout extends Document {
       this.meta({ property: 'og:title', content: title })
       return this
    }
-
-   description(description) {
-      this.meta({ name: 'description', content: description })
-      this.meta({ property: 'og:description', content: description })
-      this.meta({ property: 'twitter:description', content: description })
-      return this
-   }
-
-   favicon(href) {
-      const faviconElement = this.root.$('link[rel=icon][type=image/x-icon]')
-      if (faviconElement) faviconElement.setAttribute('href', href)
-      else this.head.insert(2, new SingleNode('link', { rel: 'icon', href, type: 'image/x-icon' }))
-      return this
-   }
-
-   meta(props) {
-      const entries = Object.entries(props)
-      const [name, value] = entries[0]
-      const selector = `meta[${name}="${value}"]`
-      const metaElement = this.root.$(selector)
-      if (metaElement) entries.forEach(([name, v]) => metaElement.setAttribute(name, props[name]))
-      else this.head.insert(2, new SingleNode('meta', props))
-   }
-
-   keywords(keywords = []) {
-      let keywordsElement = this.root.$('meta[name=keywords]')
-      if (!keywordsElement) keywordsElement = new SingleNode('meta', { name: 'keywords' })
-      const content = keywordsElement.getAttribute('content')
-      const existingKeywords = content ? content.split(',') : []
-      keywords.forEach(keyword => {
-         keyword = keyword.trim()
-         if (!existingKeywords.includes(keyword)) existingKeywords.push(keyword)
-      });
-      if (existingKeywords.length) {
-         keywordsElement.setAttribute('content', existingKeywords.join())
-         this.head.insert(2, keywordsElement)
-      }
-      return this
-   }
-
-   viewport(viewport = 'width=device-width, initial-scale=1.0') {
-      const element = this.root.$('meta[name="viewport"]')
-      if (element) element.setAttribute('content', viewport)
-      else this.head.insert(2, new SingleNode('meta', { name: 'viewport', content: viewport }))
-      return this
-   }
-
-   image(image) {
-      this.meta({ property: 'og:image', content: image })
-      this.meta({ name: 'twitter:image', content: image })
-      this.meta({ name: 'twitter:card', content: 'summary_large_image' })
-      return this
-   }
-
-   style(styles, minified = this.options.minified) {
-      return style(styles,minified,this)
-   }
-
-   url(url, host = this.URL) {
-      try {
-         url = new URL(url, host).href.replace(/\/$/, '')
-         this.meta({ property: 'og:url', content: url })
-         const canonicalElement = this.root.$('link[rel="canonical"]')
-         if (canonicalElement) canonicalElement.setAttribute('href', url)
-         else this.head.insert(2, new SingleNode('link', { rel: 'canonical', href: url }))
-      } catch (error) {
-         this.logger.log(`url ${url} with host ${host} is not valid url`)
-      }
-      return this
-   }
-
-   script(attrs = {}, innerHTML = '', head = true, minified = this.options.minified) {
-      return script(attrs,innerHTML,head,minified,this)
-   }
-
-   link(href, attributes = { rel: "stylesheet", type: "text/css" }) {
-      if (!href || typeof href !== 'string') return this
-      const selector = `link[rel=stylesheet][href^="${href}"]`
-      let linkElement = this.root.$(selector)
-      if (linkElement) return
-      linkElement = new SingleNode('link', { href, ...attributes })
-      this.head.insert(2, linkElement)
-      return this
-   }
 }
 
 module.exports = Layout

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "als-layout",
-  "version": "5.1.0",
+  "version": "6.0.0",
   "main": "index.js",
   "scripts": {
-    "test": "node --test --experimental-test-coverage",
-    "report": "node --test --experimental-test-coverage --test-reporter=lcov --test-reporter-destination=lcov.info"
+    "test": "node --test --experimental-test-coverage ./tests/**.*",
+    "report": "node --test --experimental-test-coverage --test-reporter=lcov --test-reporter-destination=lcov.info",
+    "docs":"node ./scripts/build-readme.js"
   },
   "keywords": [],
   "author": "Alex Sorkin",

package/readme.md

@@ -17,43 +17,18 @@ npm i als-layout
 ```js
 const Layout = require('als-layout')
 ```
-
-## Change Log
-* V5.1.0
-  * status and end methods removed
-  * status and end methods added to als-view
-* V5.0.0
-  * constructor changed
-    * options object parameter instead separated parameters
-    * options.logger
-  * bugs fixed
-  * some refactoring
-  * minifiying error catching
-  * status and end methods added
-* V4.2.0
-  * link method changed
-    * `link(href, attributes = { rel: "stylesheet", type: "text/css" })`
-  * no version method
-    * no version parameter in image, link,script
-  * script
-    * script in footer added one after other in right order
-
-* V4.1.0
-  * Render removed
-
-* V4.0.0
-  * All code rebuilded and refactored
-  * No als-simple-css for style
-  * No charset method
-  * minifying for style and inner scripts
-  * updated render version
-  * render as element's method instead layout's method
-
-* V3.0.0
-  * render switched to als-render
-  * updated bug with meta tags after body
-
-
+
+## Change Log for V6
+
+The code refactored.
+
+### Removed
+  * no deepclone for options, using { ...Layout.options, ...options } instead
+  * no onload method
+### Added
+  * status
+  * end(res)
+
 ## Basic Usage
 
 ### Initialization
@@ -91,15 +66,7 @@ layout.rawHtml // raw HTML of the document
 layout.clone // creates a new layout object clone for current object
 ```
 
-### onload
-
-By adding onload attribute, you can run scripts for each element after dom content has loaded. 
-
-Example how it works:
-```js
-const layout = new Layout().viewport().title('On load').onload()
-layout.body.innerHTML = /*html*/`<div onload="this.innerHTML = 'new content'">original content</div>`
-```
+
 ## Cloning Functionality
 
 ### What is Cloning and Why is it Necessary?
@@ -119,7 +86,7 @@ const newLayout = layout.clone;
 
 Cloning is particularly useful in scenarios where templates or base layouts are used repeatedly with slight variations, providing a robust and scalable solution for web page generation.
 
-
+
 ## Advanced Usage
 
 The `als-layout` library allows for sophisticated manipulation of web page layouts, providing robust tools for creating dynamic and complex web pages. Below is an advanced example demonstrating various capabilities of the library:
@@ -168,6 +135,17 @@ In this example:
 
 This advanced example illustrates how `als-layout` can be used to handle complex scenarios and requirements in web development, enhancing the flexibility and power at your disposal.
 
+
+## Response with status
+
+In version 6, added two methods:
+1. `status(statusCode)` - adds the statusCode to `__status` property
+2. `end(res)` 
+   1. writes head with `__status, { 'Content-Type': 'text/html' }` 
+   2. runs `res.end(this.rawHtml)`
+
+
+The main idea, is to add quick way to response with layout. 
 ## API
 
 ### Constructor
@@ -193,16 +171,17 @@ Returns the inner HTML of the document.
 
 Creates a clone of the current layout instance, preserving `options`.
 
+
+#### `__status`
+
+Stores the statusCode for `end` method.
+
 ### Methods
 
 #### `lang(lang: string): this`
 
 Sets the `lang` attribute on the `<html>` element.
 
-#### `onload(): this`
-
-Adds an `onload` script to the document. If called multiple times, the script is only added once.
-
 #### `title(title: string): this`
 
 Sets the document title and creates an Open Graph title meta tag.
@@ -256,3 +235,11 @@ Adds a `<script>` tag to the document.
 #### `link(href: string, attributes: object = { rel: "stylesheet", type: "text/css" }): this`
 
 Adds a `<link>` tag for external stylesheets.
+
+#### `status(statusCode:number): this`
+
+Adds the statusCode to `__status` property
+
+#### `end(res):undefined`
+
+Response with res(rawHtml)

package/{build-readme.js → scripts/build-readme.js}

@@ -1,8 +1,8 @@
 const { readFileSync, writeFileSync, readdirSync } = require('fs')
 const { join } = require('path')
 
-const docsDir = join(__dirname, 'docs')
+const docsDir = join(__dirname, '..','docs')
 const files = readdirSync(docsDir)
 const content = files.map(file => readFileSync(join(docsDir, file), 'utf-8')).join('\n');
-writeFileSync(join(__dirname, 'readme.md'), content, 'utf-8')
+writeFileSync(join(__dirname, '..','readme.md'), content, 'utf-8')
 

package/tests/integrative.test.js

@@ -30,12 +30,6 @@ describe('Layout Integrative tests', () => {
       assert(layout.root.$('title') === null, 'Title element was not removed correctly');
    });
 
-   it('onload', () => {
-      layout.onload()
-      const script = layout.root.$('script')
-      assert(script.innerHTML.includes(`document.addEventListener('DOMContentLoaded'`))
-   })
-
 });
 
 describe('HTML Structure Initialization', () => {
@@ -81,7 +75,7 @@ describe('Clone Testing', () => {
 
    it('should clone the layout correctly', () => {
       const clone = layout.clone;
-      console.log(clone.constructor.name)
+      // console.log(clone.constructor.name)
       assert(clone instanceof Layout, 'Clone should be an instance of Layout');
       assert.notStrictEqual(clone, layout, 'Clone should not be the same instance as the original');
    });

package/lib/onload.js

@@ -1,11 +0,0 @@
-const onloadScript = /*js*/`document.addEventListener('DOMContentLoaded', function() {
-   const elements = document.querySelectorAll('[onload]');
-   elements.forEach(element => {
-       const onloadCode = element.getAttribute('onload');
-       const func = Function('"use strict"; return function() { ' + onloadCode + ' }');
-       func().call(element);
-       element.removeAttribute('onload');
-   });
-});`;
-
-module.exports = onloadScript