ivue 0.0.32 → 0.1.0

package/src/tests/auth.spec.ts

@@ -0,0 +1,48 @@
+import { describe, it, beforeEach, expect, vi } from 'vitest'
+import { BlackBox } from '../App/BlackBox'
+import type { App } from '@/App/App';
+
+let box: BlackBox
+let app: App
+
+function wait () {
+  return setTimeout(() => {})
+}
+
+describe('--- auth test ----', () => {
+
+  beforeEach(() => {
+    box = new BlackBox().init()
+    app = box.app
+  })
+
+  it('root route redirects to login', async () => {
+    await app.router.push({ name: 'root' })
+    expect(app.router.active.name).toBe('login')
+  })
+
+  it('successful login redirects to homepage', async () => {
+    await app.router.push({ name: 'root' })
+
+    app.auth.email = 'ekalashnikov@gmail.com' 
+    app.auth.password = 'test1234'
+
+    const spy = vi.spyOn(app.router, 'push')
+
+    await app.auth.login()
+
+    expect(spy).toHaveBeenCalledTimes(1)
+    expect(spy).toHaveBeenCalledWith({ name: 'home' })
+    
+    expect(app.message.appMessages).toEqual(['User logged in'])
+
+    expect(app.user.email).toBe('ekalashnikov@gmail.com')
+    expect(app.user.token).toBe('1234ekalashnikov@gmail.com')
+    
+    await app.router.isLoaded()
+    
+    expect(app.router.currentRoute.name).toBe('home')
+  })
+
+})
+

package/src/traits/UseCapsule.ts

@@ -0,0 +1,28 @@
+import { get, make, use, init } from '../kernel';
+import type { AnyClass } from '../types/core';
+import { markRaw } from 'vue';
+
+export class UseCapsule {
+
+  $!: InstanceType<this['capsule']>
+
+  capsule: AnyClass | any
+
+  useCapsule (args: any = []) {
+    this.$ = use(this.capsule, this, ...args)
+    markRaw(this.$)
+  }
+
+  initCapsule (args: any = []) {
+    this.$ = init(this.capsule, this, ...args)
+    markRaw(this.$)
+  }
+
+  getCapsule (args: any = []) {
+    this.$ = get(this.capsule, this, ...args)
+  }
+
+  makeCapsule (args: any = []) {
+    this.$ = make(this.capsule, this, ...args)
+  }
+}

package/src/traits/UseEmit.ts

@@ -0,0 +1,3 @@
+export class UseEmit {
+  $emit: Function = (...args:any) => {}
+}

package/src/traits/UseInstance.ts

@@ -0,0 +1,17 @@
+import type { Class } from '../types/core'
+import { IVUE } from '../behavior';
+import { extend } from '../utils/extend'
+import { getCurrentInstance } from 'vue';
+
+export function useInstance (mainClass: Class, self: UseInstance | any) {
+  mainClass.behavior = extend(mainClass.behavior ?? {}, { $instance: IVUE.OFF })
+}
+
+export class UseInstance {
+  get $instance () {
+    return getCurrentInstance()
+  }
+  constructor (mainClass: Class) {
+    useInstance(mainClass, this)
+  }
+}

package/src/traits/UseMounting.ts

@@ -0,0 +1,23 @@
+import { type Class } from '../types/core';
+import { after } from '../behavior'
+import { onMounted, onUnmounted, onBeforeMount, onBeforeUnmount } from 'vue'
+
+export function useMounting (mainClass: Class, obj: UseMounting | any) {
+  after(mainClass, ({ self }) => {
+    if ('beforeMount' in self) onBeforeMount(() => self.beforeMount())
+    if ('mounted' in self) onMounted(() => self.mounted())
+    if ('beforeUnmount' in self) onBeforeUnmount(() => self.beforeUnmount())
+    if ('unmounted' in self) onUnmounted(() => self.unmounted())
+  })
+}
+
+/** Make a class useMounting to a Vue component */
+export class UseMounting {
+  constructor (mainClass: Class) {
+    useMounting(mainClass, this)
+  }
+  beforeMount?: ReturnType<typeof onBeforeMount> = function () {}
+  mounted?: ReturnType<typeof onMounted> = function () {}
+  beforeUnmount?: ReturnType<typeof onBeforeUnmount> = function () {}
+  unmounted?: ReturnType<typeof onUnmounted> = function () {}
+}

package/src/traits/UseRefs.ts

@@ -0,0 +1,17 @@
+import type { Class } from '../types/core';
+import { IVUE } from '../behavior';
+import { extend } from '../utils/extend'
+import { getCurrentInstance } from 'vue';
+
+export function useRefs (mainClass: Class, obj: any) {
+  mainClass.behavior = extend(mainClass.behavior ?? {}, { $refs: IVUE.OFF })
+}
+
+export class UseRefs {
+  get $refs () {
+    return getCurrentInstance()?.refs;
+  }
+  constructor (mainClass: Class) {
+    useRefs(mainClass, this)
+  }
+}

package/src/traits/UseRoute.ts

@@ -0,0 +1,6 @@
+import { toValue } from 'vue';
+import { config } from '../config';
+
+export class UseRoute {
+   get route () { return toValue(config.router?.currentRoute) }
+}

package/src/traits/UseRouter.ts

@@ -0,0 +1,5 @@
+import { config } from '../config';
+
+export class UseRouter {
+  get router () { return config.router }
+}

package/src/traits/UseRouting.ts

@@ -0,0 +1,7 @@
+import { Traits } from '../utils/traits';
+import { UseRouter } from './UseRouter';
+import { UseRoute } from './UseRoute';
+
+export class UseRouting {}
+Traits(UseRouting, [UseRouter, UseRoute])
+export interface UseRouting extends UseRouter, UseRoute {}

package/src/traits/UseTick.ts

@@ -0,0 +1,5 @@
+import { nextTick } from 'vue';
+
+export class UseTick {
+  $nextTick = nextTick
+}

package/src/traits/UseVue.ts

@@ -0,0 +1,38 @@
+import type { Class } from '../types/core'
+import { Traits } from '../utils/traits';
+import { useMounting, UseMounting } from './UseMounting';
+import { UseRouting } from './UseRouting';
+import { useRefs, UseRefs } from './UseRefs';
+import { UseEmit } from './UseEmit';
+import { UseTick } from './UseTick';
+import { UseInstance, useInstance } from './UseInstance';
+
+export function useVue (mainClass: Class, obj: UseVue | any) {
+  useInstance(mainClass, obj)
+  useRefs(mainClass, obj)
+  useMounting(mainClass, obj)
+}
+
+export class UseVue {
+  constructor (mainClass: Class) {
+    useVue(mainClass, this)
+  }
+}
+
+Traits(UseVue, [
+  UseRouting, 
+  UseMounting, 
+  UseEmit, 
+  UseTick, 
+  UseRefs,
+  UseInstance
+])
+
+export interface UseVue
+  extends
+  UseRouting,
+  UseMounting,
+  UseEmit,
+  UseTick,
+  UseRefs,
+  UseInstance {}

package/src/types/core.ts

@@ -0,0 +1,64 @@
+import type { Mapping } from '../kernel'
+import type { ComputedRef } from 'vue';
+
+export type AnyClass = abstract new (...args: any) => any;
+
+export type Class = {
+  behavior?: any;
+  new(...args: any[]): any;
+  [x: string | symbol]: any
+}
+
+export type IVue<T extends AnyClass> = InstanceType<T> & IVueToRefs<T>
+
+/**
+ * @see ivueTransform
+ */
+export interface IVueToRefs<T extends AnyClass> {
+  toRefs: (...args: any) => InstanceType<T>
+}
+
+export interface IVueToRefsObj<T extends object> {
+  toRefs: (...args: any) => T
+}
+
+export type MappingScope = 'singleton' | 'transient'
+
+export type MappingType = 'generic' | 'ivue' | any
+
+export type InferredArgs<T> = T extends { new(...args: infer P): any } ? P : never[]
+
+export type Getters = Map<string | symbol | number, PropertyDescriptor>
+
+export interface Intercept {
+  return: any,
+  mapping: Mapping,
+  name?: string,
+  self: any,
+  args: any
+}
+
+export type InterceptOptions = {
+  top: boolean,
+  scoped: boolean
+}
+
+export type InterceptFn = (intercept: Intercept, self: Object, prop: string) => void | true
+
+export type InterceptsMap = {
+  before: Map<Function | Class, InterceptFn[]>,
+  after: Map<Function | Class, InterceptFn[]>
+}
+
+export type InterceptAttachTo = Function | [Class, Function]
+
+export type InterceptsFns = InterceptFn[] | undefined | any
+
+export type Null<T> = T | null
+
+export type AnyObj = Record<string | number | symbol, any>
+
+export type Params<T extends (...args: any) => any> = Parameters<T>
+
+
+export type Computeds = Record<string | symbol | number, ComputedRef>

package/src/utils/dispose-garbage.ts

@@ -0,0 +1,34 @@
+import { toRaw } from "vue"
+import type { AnyClass, Getters, IVue } from ".."
+const propertiesMap = new WeakMap()
+/**
+ * Advanced garbage disposal for complete memory control.
+ * Disposes an internal object that is under the vue reactive proxy.
+ * To expose the raw property, toRaw(vue) method is used 
+ * to retrieve the original object.
+ * 
+ * @param vue ivue instance
+ * @param getters @see Getters
+ * @param name string
+ */
+export const disposeGarbage = <T extends AnyClass> (vue: IVue<T> | any) => {
+  // Deep garbage collection, gives really amazing performance in Opera as well as Google Chrome.
+  // Opera seems to perform better though with cleaning up the garbage more effeciently and more.
+
+  let instance = toRaw(vue)
+  let props: any = Object.getOwnPropertyNames(instance)
+
+  for (let i = 0; i < props.length; i++) {
+    delete instance[props[i]]
+  }
+
+  // Faster but less thorough garbage collection:
+  // Will remove only enumerable properties.
+  // for (prop in vue) {
+  //   delete vue[prop]
+  // }
+
+  // Unset roots for gc engine to collect and dispose
+  instance = null
+  props = null
+}

package/src/utils/extend.ts

@@ -0,0 +1,85 @@
+import { isObject, isPromise } from "./is";
+
+/**
+ * Advanced deep merge of two or more objects.
+ * Merges sources into target iterating from left to right.
+ * Supports circular references and promises.
+ * Merges and modifies the target object.
+ * Only simple objects can extend the target, yet the
+ * target can be anything, even a class object.
+ * 
+ * @param target object
+ * @param sources array
+ */
+export function extend (target: any, ...sources: any[]) {
+  let parents: any = new WeakMap() // parents object to detect circular references
+  const result = _extend(target, [...sources], parents);
+  // parents = undefined // flush the parents map upon completion
+  return result
+}
+
+/**
+ * Deep merge two objects inner function.
+ *
+ * @param target   Target  - object to merge into.
+ * @param sources  Sources - object to merge from.
+ * @param parents  Parents - for circular reference checks.
+ * @return {*}
+ * 
+ * @internal
+ */
+function _extend<K, V> (target: any, sources: any[], parents: Map<K, V> | null | any = null) {
+
+  if (!sources.length) return target;
+  // save target object in Map as a key
+  parents.set(target, true)
+
+  const source = sources.shift();
+
+  if (isObject(target) && isObject(source)) {
+
+    for (const key in source) {
+      if (isObject(source[key]) && source[key].constructor.name === 'Object') {
+        // detect circular references using Map parents object
+        if (parents.has(source[key])) {
+          // console.log('detected circular reference key:', key,
+          // 'value:', source[key],
+          // 'parents:', [...parents])
+          target[key] = source[key]
+        } else {
+          if (isPromise(source[key])) {
+            // promise objects should not be assigned
+            // via _extend
+            target[key] = source[key]
+          } else {
+            // the following lines
+            // integrate Proxy support
+            // if the target key does not exist
+            if (typeof target[key] === 'undefined') {
+              // assign directly the proxy or any other object
+              target[key] = source[key]
+            } else {
+              // if target[key] is not an object
+              // convert it to an object to be able to extend
+              if (!isObject(target[key])) {
+                target[key] = source[key]
+              } else {
+                // Only simple objects can extend the target
+                if (target[key].constructor.name !== 'Object') {
+                  target[key] = source[key]
+                } else {
+                  _extend(target[key], [source[key]], parents)
+                }
+              }
+            }
+          }
+        }
+
+      } else {
+        target[key] = source[key]
+      }
+    }
+  } 
+
+  return _extend(target, sources, parents);
+}

package/src/utils/getters.ts

@@ -0,0 +1,62 @@
+import type { Getters } from '../types/core'
+
+/**
+ * Store all getters for each class prototype processed by getPrototypeGetters.
+ * @see getPrototypeGetters
+ */
+export const gettersMap = new Map()
+
+/**
+ * Get getters of a class prototype as a map.
+ *
+ * @param proto
+ * @return Getters
+ */
+export function getPrototypeGetters (proto: object | null) {
+
+  if (gettersMap.has(proto)) return gettersMap.get(proto)
+
+  const initialProto = proto
+
+  const props: any[] = []
+
+  while (proto && proto.constructor.name !== 'Object') {
+    props.push.apply(props, Object.entries(
+      Object.getOwnPropertyDescriptors(proto)
+    ))
+    proto = Object.getPrototypeOf(proto.constructor.prototype)
+  }
+
+  const getters: Getters = new Map()
+
+  for (let i = 0; i < props.length; i++) {
+    if (props[i][0] !== '__proto__' && typeof props[i][1].get === 'function') {
+      getters.set(props[i][0], props[i][1])
+    }
+  }
+  /**
+   * Save getters in the getters map.
+   */
+  gettersMap.set(initialProto, getters)
+
+  return getters
+}
+
+/**
+ * Get getters of a class instance and the total number of them.
+ * @param instance Object instance
+ * @returns Getter descriptors
+ */
+export function getInstanceGetters (instance: { [x: string]: any; }) {
+
+  const getters: Getters = new Map()
+  const props = Object.entries(Object.getOwnPropertyDescriptors(instance))
+
+  for (let i = 0; i < props.length; i++) {
+    if (typeof props[i][1].get === 'function' && props[i][0] !== '__proto__') {
+      getters.set(props[i][0], props[i][1])
+    }
+  }
+
+  return getters
+}

package/src/utils/index.ts

@@ -0,0 +1,16 @@
+import { raw, unraw } from './raw'
+import { extend } from './extend'
+import { Traits } from './traits'
+import { getPrototypeGetters, getInstanceGetters } from './getters'
+import { safeClassName } from './safe-class-name';
+import { pre } from './pre';
+export {
+  raw,
+  unraw,
+  extend,
+  Traits,
+  getPrototypeGetters,
+  getInstanceGetters,
+  safeClassName,
+  pre
+}

package/src/utils/is.ts

@@ -0,0 +1,22 @@
+/**
+ * Determine if the value is a true Object.
+ * 
+ * @param v any value
+ * @returns boolean
+ */
+export function isObject (v: any) {
+  return (v && typeof v === 'object' && !Array.isArray(v));
+}
+
+/**
+ * Determine if the value is a Promise.
+ * 
+ * @param v any value
+ * @returns boolean
+ */
+export function isPromise (v: any) {
+  return v !== null &&
+    typeof v === 'object' &&
+    typeof v.then === 'function' &&
+    typeof v.catch === 'function';
+}

package/src/utils/pre.ts

@@ -0,0 +1,29 @@
+/**
+ * Pretty print an object that can contain circular references.
+ * 
+ * @param v      object to print
+ * @param spaces number of spaces for tabs
+ * @returns      pretty string
+ * @source       https://stackoverflow.com/a/48254637
+ */
+export function pre (v: any, spaces = 2) {
+  const cache = new Set();
+  return JSON.stringify(v, function (key, value) {
+    if (typeof value === 'object' && value !== null) {
+      if (cache.has(value)) {
+        // Circular reference found
+        try {
+          // If this value does not reference a parent it can be deduped
+         return JSON.parse(JSON.stringify(value))
+        }
+        catch (err) {
+          // discard key if value cannot be deduped
+         return '[**circular**]';
+        }
+      }
+      // Store value in our set
+      cache.add(value)
+    }
+    return value;
+  }, spaces)
+}

package/src/utils/raw.ts

@@ -0,0 +1,19 @@
+import { markRaw } from 'vue';
+
+/**
+ * Convert object back to Vue reactive.
+ *
+ * @param obj
+ */
+export function unraw (obj: any) {
+  delete obj.__v_skip
+}
+
+/**
+ * Alias for Vue markRaw() function.
+ *
+ * @param obj
+ */
+export function raw (obj: any) {
+  return markRaw(obj)
+}

package/src/utils/safe-class-name.ts

@@ -0,0 +1,15 @@
+/**
+ * Convert class name, symbol to string.
+ * 
+ * @param className 
+ * @returns 
+ */
+export function safeClassName(className: any) {
+  let name = ''
+  try {
+    name = className?.name || String(className)
+  } catch (e) {
+    name = 'Unknown[failed to convert to string]'
+  }
+  return name
+}

package/src/utils/traits.ts

@@ -0,0 +1,121 @@
+import type { Class } from '../types/core'
+
+/**
+ * Traits architecture that supports methods, properties, getters and setters.
+ * 
+ * Traits override each other, while traits can set new props onto
+ * the main prototype, they cannot override the main prototypes' 
+ * props if the main prototype had them already initially.
+ * 
+ * Traits override each other, left most traits having higher priority, matching
+ * TypeScript's interface `interface Class extends Trait1, Trait2, Trait3 {}`
+ * architecture, enabling us to have full TypeScript & IDE support:
+ * 
+ * Example:
+ * ```ts
+ * class MainClass {}
+ * 
+ * class Trait1 {
+ *   get prop () { return 3 }
+ * }
+ * 
+ * class Trait2 {
+ *   get prop () { return 2 }
+ * }
+ * 
+ * class Trait3 {
+ *   get prop () { return 3 }
+ * }
+ * 
+ * Traits(MainClass, [Trait1, Trait2, Trait3])
+ * export interface MainClass extends Trait1, Trait2, Trait3 {}
+ * ```
+ * 
+ * Trait1 props will override Traits2 & Traits3 properties,
+ * but will not override MainClass properties if set.
+ * 
+ * Inspired by TypeScript docs: https://www.typescriptlang.org/docs/handbook/mixins.html#alternative-pattern
+ * 
+ * @param main
+ * @param traits
+ */
+export function Traits (main: Class, traits: Class[]): void {
+
+  const initialProtoSetterOnly: Record<string | number | symbol, Function> = {}
+
+  const initialProto = Object.getOwnPropertyNames(main.prototype)
+    .reduce((acc: any, prop: string) => {
+      const descriptor = Object.getOwnPropertyDescriptor(main.prototype, prop)
+      let skip = false
+      // skip setters without getters
+      if (descriptor?.set && !descriptor?.get) {
+        // collect setter only descriptors
+        initialProtoSetterOnly[prop] = descriptor?.set
+        skip = true
+      }
+      if (!skip) acc[prop] = true
+      return acc
+    }, {})
+
+  const notInInitialProto: Record<string, boolean> = {}
+
+  traits.reverse().forEach(trait => {
+
+    // Init the traits constructor to be able to perform
+    // transformations on the main class beyond 
+    // just property & method inheritance.
+    const obj = new trait(main)
+
+    // Loop initialized properties, otherwise they are undefined
+    for (const prop in obj) {
+
+      if (!(prop in initialProto)) notInInitialProto[prop] = true
+
+      // Did prop exist on the initial state of main prototype?
+      // If it did, we do not want to override it
+      if (prop in notInInitialProto) {
+        Object.defineProperty(
+          main.prototype,
+          prop,
+          {
+            value: obj[prop],
+            writable: true
+          }
+        )
+      }
+    }
+
+    // Loop through all properties to get the methods
+    Object.getOwnPropertyNames(trait.prototype).forEach(prop => {
+      if (prop !== 'constructor') {
+
+        if (!(prop in initialProto)) notInInitialProto[prop] = true
+
+        // Did prop exist on the initial state of main prototype?
+        // If it did, we do not want to override it
+        if (prop in notInInitialProto) {
+          const descriptor = Object.getOwnPropertyDescriptor(trait.prototype, prop) || Object.create(null)
+
+          // This is to ensure that setters from other traits are passed down
+          // but only if the initialProto has no setter set
+          if (descriptor?.set && !(prop in initialProtoSetterOnly)) {
+            initialProtoSetterOnly[prop] = descriptor?.set
+          }
+
+          // This is to ensure the initialProto with set only does not get overriden 
+          // with traits that do not have a setter, but only have a getter
+          if (descriptor?.get && !descriptor?.set && prop in initialProtoSetterOnly) {
+            descriptor.set = initialProtoSetterOnly[prop]
+          }
+
+          Object.defineProperty(
+            main.prototype,
+            prop,
+            descriptor
+          )
+        }
+
+      }
+    })
+  })
+}