chore: upgrade prettier to 2.3.0

.prettierrc.json

@@ -4,13 +4,5 @@
   "semi": true,
   "singleQuote": true,
   "printWidth": 100,
-  "useTabs": false,
-  "overrides": [
-    {
-      "files": "*.tsx",
-      "options": {
-        "parser": "babel-ts"
-      }
-    }
-  ]
+  "useTabs": false
 }

WORKSPACE

@@ -21,7 +21,7 @@ check_rules_nodejs_version(minimum_version_string = "2.2.0")
 
 # Setup the Node.js toolchain
 node_repositories(
-    node_version = "13.7.0",
+    node_version = "15.0.0",
     package_json = ["//:package.json"],
 )
 

client/component/component.ts

@@ -48,7 +48,7 @@ export class Component<PROPS, STATE> {
     hostElement: Element
   ): Promise<COMP> {
     // TODO: Needs tests
-    const componentConstructor = (this as any) as ComponentConstructor<COMP>;
+    const componentConstructor = this as any as ComponentConstructor<COMP>;
     const componentTemplate = hostElement.getAttribute(AttributeMarker.ComponentTemplate);
     if (!componentTemplate) {
       hostElement.setAttribute(

client/event/emit_event.ts

@@ -51,7 +51,7 @@ export function emitEvent(element: HTMLElement, event: Event, url: URL): Promise
     QError.Event_emitEventCouldNotFindListener_event_element,
     AttributeMarker.EventPrefix + fromCamelToKebabCase($type),
     (element, attrName, attrValue) => {
-      const qrl = (attrValue as unknown) as QRL<EventHandler<any, any, any>>;
+      const qrl = attrValue as unknown as QRL<EventHandler<any, any, any>>;
       return Promise.resolve(qImport(element, qrl)).then((fn: Function) => {
         const dstUrl = toUrl(toBaseURI(element), qrl);
         const event = new CustomEvent($type);

client/event/event_injector.unit.ts

@@ -16,7 +16,7 @@ describe('EventInjector', () => {
   beforeEach(() => (fixture = new ElementFixture()));
 
   it('should parse URL', async () => {
-    const event = ('EVENT' as any) as Event;
+    const event = 'EVENT' as any as Event;
     const url = new URL('http://localhost/path?a=b&c=d');
     const eventInjector = new EventInjector(fixture.host, event, url);
     const eventService = await eventInjector.getService(EventService.KEY);

client/event/inject_event_handler.ts

@@ -48,7 +48,7 @@ export function injectEventHandler<SELF, ARGS extends any[], RET>(
     (this: SELF, ...args: [...ProviderReturns<ARGS>]) => RET
   ]
 ): EventHandler<SELF, ARGS, RET> {
-  const injectedFunction = (args.pop() as any) as InjectedFunction<SELF, ARGS, [], RET>;
+  const injectedFunction = args.pop() as any as InjectedFunction<SELF, ARGS, [], RET>;
   const thisType = (injectedFunction.$thisType = args.shift() as any);
   injectedFunction.$inject = args as any;
   qDev && (injectedFunction.$debugStack = new Error());

client/event/inject_event_handler.unit.ts

@@ -20,7 +20,7 @@ describe('injectEventHandler', () => {
   beforeEach(() => (fixture = new ElementFixture()));
 
   it('should support component injection', async () => {
-    const event = ('EVENT' as any) as Event;
+    const event = 'EVENT' as any as Event;
     const url = new URL('http://localhost/path?a=b&c=d');
     fixture.host.setAttribute(AttributeMarker.ComponentTemplate, String(MyComponent.$templateQRL));
 

client/import/qrl.ts

@@ -79,7 +79,7 @@ export function QRL<T = any>(
   if (qDev) {
     verifyQrl(new Error('Invalid import: ' + url), url);
   }
-  return (url as unknown) as QRL<T>;
+  return url as unknown as QRL<T>;
 }
 
 export async function verifyQrl(error: Error, url: string): Promise<any> {

client/injector/base_injector.unit.ts

@@ -172,7 +172,7 @@ class MyClass {}
 export function template() {}
 
 class MyComponent extends Component<any, any> {
-  static $templateQRL = ('test:/injectior/base_injector.unit.template' as any) as QRL;
+  static $templateQRL = 'test:/injectior/base_injector.unit.template' as any as QRL;
   $newState() {
     return {};
   }

client/injector/element_injector.ts

@@ -80,11 +80,11 @@ export class ElementInjector extends BaseInjector {
       } else {
         const stateJSON = this.element.getAttribute(AttributeMarker.ComponentState);
         const state = stateJSON ? (JSON.parse(stateJSON) as ComponentStateOf<COMP>) : null;
-        this.component = component = (new componentType(
+        this.component = component = new componentType(
           this.element,
-          (this.elementProps as any) as ComponentPropsOf<COMP>,
+          this.elementProps as any as ComponentPropsOf<COMP>,
           state
-        ) as unknown) as COMP;
+        ) as unknown as COMP;
         return (this.componentPromise = new Promise<COMP>((resolve, reject) => {
           let promise: Promise<any>;
           if (state == null) {
@@ -161,7 +161,7 @@ export class ElementInjector extends BaseInjector {
               state!.$key = serviceKey;
             }
             const props = serviceType.$keyToProps(serviceKey);
-            const service = (new serviceType(element, props, state) as unknown) as SERVICE;
+            const service = new serviceType(element, props, state) as unknown as SERVICE;
             let chain: Promise<any>;
             if (state) {
               serviceValue.service = service;
@@ -230,7 +230,7 @@ export class ElementInjector extends BaseInjector {
 
   releaseService(key: ServiceKey) {
     if (this.services?.delete(key)) {
-      this.element.removeAttribute((key as any) as string);
+      this.element.removeAttribute(key as any as string);
     }
   }
 

client/injector/element_injector.unit.ts

@@ -206,7 +206,7 @@ describe('ElementInjector', () => {
         );
       });
       it('should throw error if no service provider define', () => {
-        expect(() => hostInjector.getService(('not:found' as any) as ServiceKey)).to.throw(
+        expect(() => hostInjector.getService('not:found' as any as ServiceKey)).to.throw(
           "ERROR(Q-004): Could not find service state 'not:found' ( or service provider '::not') at '<host :>' or any of it's parents."
         );
       });

client/injector/inject.ts

@@ -42,7 +42,7 @@ import { ConcreteType, InjectedFunction, ProviderReturns } from './types.js';
 export function injectFunction<ARGS extends any[], REST extends any[], RET>(
   ...args: [...ARGS, (...args: [...ProviderReturns<ARGS>, ...REST]) => RET]
 ): InjectedFunction<null, ARGS, REST, RET> {
-  const fn = (args.pop() as any) as InjectedFunction<null, ARGS, REST, RET>;
+  const fn = args.pop() as any as InjectedFunction<null, ARGS, REST, RET>;
   fn.$thisType = null;
   fn.$inject = args as any;
   qDev && (fn.$debugStack = new Error());
@@ -89,7 +89,7 @@ export function injectMethod<SELF, ARGS extends any[], REST extends any[], RET>(
     (this: SELF, ...args: [...ProviderReturns<ARGS>, ...REST]) => RET
   ]
 ): InjectedFunction<SELF, ARGS, REST, RET> {
-  const fn = (args.pop() as any) as InjectedFunction<SELF, ARGS, REST, RET>;
+  const fn = args.pop() as any as InjectedFunction<SELF, ARGS, REST, RET>;
   fn.$thisType = args.shift() as ConcreteType<SELF>;
   fn.$inject = args as any;
   qDev && (fn.$debugStack = new Error());

client/injector/inject.unit.ts

@@ -65,7 +65,7 @@ describe('injectEventHandler', async () => {
 
   it('should inject this', async () => {
     class MyComp {
-      static $templateQRL = ('./comp' as any) as QRL;
+      static $templateQRL = './comp' as any as QRL;
       $state = undefined;
       myComp: boolean = true;
       $newState() {}

client/injector/resolve_args.unit.ts

@@ -17,7 +17,7 @@ describe('resolveArgs', () => {
     expect(await resolveArgs(injector, 1, 2)).to.eql([1, 2]);
   });
   it('should resolve promise values', async () => {
-    const injector = ({}! as any) as Injector; // not needed because no providers requested.
+    const injector = {}! as any as Injector; // not needed because no providers requested.
     expect(
       await resolveArgs(injector, 1, (injector: Injector) => Promise.resolve(injector))
     ).to.eql([1, injector]);

client/provider/provide_component_props.ts

@@ -36,6 +36,6 @@ export function provideComponentProps<T>(): Provider<T> {
   return function propsComponentProvider(injector: Injector): T {
     const props = injector.elementProps;
     qDev && assertDefined(props);
-    return (props as any) as T;
+    return props as any as T;
   };
 }

client/provider/provide_service.unit.ts

@@ -28,7 +28,7 @@ describe('provideService', () => {
   it('should return service', async () => {
     RegardsService.$attachService(fixture.parent);
     const fn = injectFunction(
-      provideService(((() => Promise.resolve('regards:Hello:World')) as any) as Provider<
+      provideService((() => Promise.resolve('regards:Hello:World')) as any as Provider<
         ServiceKey<RegardsService>
       >), // TODO(type):
       (service: RegardsService) => service

client/provider/provide_service_state.unit.ts

@@ -29,8 +29,8 @@ describe('provideService', () => {
   it('should return service', async () => {
     RegardsService.$attachService(fixture.parent);
     const fn = injectFunction(
-      provideServiceState<RegardsService>(((() =>
-        Promise.resolve('regards:Hello:World')) as any) as Provider<ServiceKey<RegardsService>>),
+      provideServiceState<RegardsService>((() =>
+        Promise.resolve('regards:Hello:World')) as any as Provider<ServiceKey<RegardsService>>),
       (service: Regards) => service
     );
 

client/qootloader.ts

@@ -51,7 +51,7 @@ interface QConfig {
       let eventUrl = element.getAttribute(eventName);
       if (eventUrl) {
         eventUrl = eventUrl.replace(/^(\w+):/, (_, protocol) => {
-          return ((window as any) as { Q: QConfig }).Q.protocol[protocol];
+          return (window as any as { Q: QConfig }).Q.protocol[protocol];
         });
         const url = new URL(eventUrl, document.baseURI);
         const pathname = url.pathname;

client/render/jsx/mark_dirty.ts

@@ -130,7 +130,7 @@ export function scheduleRender(document: QDocument): Promise<HostElements> {
       const hosts: HostElements = [];
       componentHosts.forEach((host) => {
         host.removeAttribute(AttributeMarker.EventRender);
-        const qrl = (host.getAttribute(AttributeMarker.ComponentTemplate)! as any) as QRL;
+        const qrl = host.getAttribute(AttributeMarker.ComponentTemplate)! as any as QRL;
         qDev && assertString(qrl);
         const props: Props = extractPropsFromElement(host);
         jsxRenderComponent(host, qrl, waitOn, props, document);

client/render/jsx/render.ts

@@ -128,7 +128,7 @@ function visitJSXDomNode(
     // TODO: better way of converting string to QRL.
     jsxRenderComponent(
       reconcileElement,
-      (componentUrl as any) as QRL,
+      componentUrl as any as QRL,
       waitOn,
       jsxNode.props,
       document
@@ -195,7 +195,7 @@ function visitJSXComponentNode(
   const injector: Injector = getInjector(parentNode as Element);
   injector.elementProps = props;
   const componentJsxNode = injector.invoke(
-    (component as any) as InjectedFunction<any, any[], any[], JSXNode<any>>,
+    component as any as InjectedFunction<any, any[], any[], JSXNode<any>>,
     undefined,
     props
   );

client/service/service.ts

@@ -313,7 +313,7 @@ export class Service<PROPS, STATE> {
     propsOrKey: ServicePropsOf<SERVICE> | ServiceKey,
     state: ServiceStateOf<SERVICE> | null
   ): void {
-    const serviceType = (this as any) as ServiceConstructor<SERVICE>;
+    const serviceType = this as any as ServiceConstructor<SERVICE>;
     serviceType.$attachService(host);
     const key = typeof propsOrKey == 'string' ? propsOrKey : propsToKey(serviceType, propsOrKey);
     if (!host.hasAttribute(String(key))) {
@@ -345,15 +345,15 @@ export class Service<PROPS, STATE> {
     propsOrKey: ServicePropsOf<SERVICE> | ServiceKey,
     state?: ServiceStateOf<SERVICE>
   ): ServicePromise<SERVICE> {
-    const serviceType = (this as any) as ServiceConstructor<SERVICE>;
+    const serviceType = this as any as ServiceConstructor<SERVICE>;
     const key: ServiceKey<SERVICE> =
       typeof propsOrKey == 'string'
         ? (propsOrKey as ServiceKey<SERVICE>)
         : propsToKey(serviceType, propsOrKey);
     if (state) state.$key = key;
     const serviceProviderKey = keyToServiceAttribute(key);
     if (!element.hasAttribute(serviceProviderKey)) {
-      ((this as unknown) as ServiceConstructor<SERVICE>).$attachService(element);
+      (this as unknown as ServiceConstructor<SERVICE>).$attachService(element);
     }
     const injector = getInjector(element);
     return injector.getService(key, state, this as any);
@@ -449,7 +449,7 @@ export class Service<PROPS, STATE> {
     ...args: ARGS
   ): Promise<RET> {
     const service = getServiceType(this);
-    const delegate = await qImport(((service as any) as typeof Service).$config, qrl);
+    const delegate = await qImport((service as any as typeof Service).$config, qrl);
     return getInjector(this.$element).invoke(delegate as any, this, ...args);
   }
 
@@ -524,7 +524,7 @@ function getServiceType<SERVICE extends Service<any, any>>(
   if (!(service instanceof Service)) {
     throw qError(QError.Service_expected_obj, service);
   }
-  const serviceType = (service.constructor as any) as ServiceConstructor<SERVICE>;
+  const serviceType = service.constructor as any as ServiceConstructor<SERVICE>;
   if (serviceType.$attachServiceState !== Service.$attachServiceState) {
     throw qError(QError.Service_overridesConstructor_service, service);
   }

client/service/service.unit.ts

@@ -189,7 +189,7 @@ describe('service', () => {
       const fixture = new ElementFixture();
       const empty = await EmptyService.$hydrate(fixture.child, {}, {});
       expect(await empty.ident('ABC')).to.equal('ABC');
-      expect(await getInjector(fixture.child).getService(('empty:' as any) as ServiceKey)).to.equal(
+      expect(await getInjector(fixture.child).getService('empty:' as any as ServiceKey)).to.equal(
         empty
       );
       expect(fixture.child.getAttribute('::empty')).to.equal('service:/service.unit.EmptyService');
@@ -211,7 +211,7 @@ describe('service', () => {
     );
     expect(
       await getInjector(fixture.child).getService(
-        ('greeter:hello:world' as any) as ServiceKey<GreeterService>
+        'greeter:hello:world' as any as ServiceKey<GreeterService>
       )
     ).to.equal(greeter);
 

integration/todo/ui/Footer_template.tsx

@@ -21,7 +21,7 @@ import {
 export const _needed_by_JSX_ = jsxFactory; // eslint-disable-line @typescript-eslint/no-unused-vars
 export default injectFunction(
   provideServiceState<TodoService>(
-    (provideComponentProp('$todos') as any) as Provider<ServiceKey<TodoService>>
+    provideComponentProp('$todos') as any as Provider<ServiceKey<TodoService>>
   ), // TODO(type): fix cast
   function FooterTemplate(todos: Todo) {
     const remaining = todos.items.length - todos.completed;

integration/todo/ui/Item_edit.ts

@@ -30,7 +30,7 @@ export const change = injectEventHandler(
   provideQrlExp<string>('value'),
   provideQrlExp<string>('code'),
   provideService<ItemService>(
-    (provideUrlProp('itemKey') as any) as Provider<ServiceKey<ItemService>>
+    provideUrlProp('itemKey') as any as Provider<ServiceKey<ItemService>>
   ), // TODO fix cast
   async function (
     this: ItemComponent,

integration/todo/ui/Item_remove.ts

@@ -20,7 +20,7 @@ export default injectEventHandler(
   // Providers
   null,
   provideService(TodoService.SINGLETON),
-  (provideUrlProp('itemKey') as unknown) as Provider<ServiceKey<ItemService>>, // TODO(type): add provider to clean this cast up
+  provideUrlProp('itemKey') as unknown as Provider<ServiceKey<ItemService>>, // TODO(type): add provider to clean this cast up
   // Handler
   async function remove(this: null, todoService: TodoService, itemKey: ServiceKey<ItemService>) {
     todoService.remove(itemKey);

integration/todo/ui/Item_template.tsx

@@ -24,7 +24,7 @@ export const _needed_by_JSX_ = jsxFactory; // eslint-disable-line @typescript-es
 export default injectMethod(
   ItemComponent,
   provideServiceState<ItemService>(
-    (provideComponentProp('$item') as any) as Provider<ServiceKey<ItemService>> // TODO(type)
+    provideComponentProp('$item') as any as Provider<ServiceKey<ItemService>> // TODO(type)
   ),
   provideComponentProp('$item'),
   function (this: ItemComponent, item: Item, itemKey: string) {

integration/todo/ui/Item_toggle.ts

@@ -20,7 +20,7 @@ export default injectEventHandler(
   null,
   provideQrlExp<boolean>('toggleState'),
   provideService<ItemService>(
-    (provideComponentProp('$item') as any) as Provider<ServiceKey<ItemService>>
+    provideComponentProp('$item') as any as Provider<ServiceKey<ItemService>>
   ), // TODO(type):
   // Handler
   async function (this: null, toggleState: boolean, itemService: ItemService) {

integration/todo/ui/Main_template.tsx

@@ -25,7 +25,7 @@ import { Item } from './Item.js';
 export const _needed_by_JSX_ = jsxFactory; // eslint-disable-line @typescript-eslint/no-unused-vars
 export default injectFunction(
   provideService<TodoService>(
-    (provideComponentProp('$todos') as any) as Provider<ServiceKey<TodoService>>
+    provideComponentProp('$todos') as any as Provider<ServiceKey<TodoService>>
   ), // TODO(type):
   function (todoService: TodoService) {
     const itemKeys = todoService.filteredItems;

package.json

@@ -43,7 +43,7 @@
     "husky": "^5.2.0",
     "lint-staged": "^10.5.4",
     "mocha": "^8.3.0",
-    "prettier": "2.2.1",
+    "prettier": "2.3.0",
     "rollup": "^2.40.0",
     "serve-static": "^1.14.1",
     "source-map-support": "^0.5.19",