Merge pull request #31 from IKatsuba/feature-platform

feat(ngx-ssr-platform): create the platform package

angular.json

@@ -338,6 +338,51 @@
           }
         }
       }
+    },
+    "ngx-ssr-platform": {
+      "projectType": "library",
+      "root": "libs/ngx-ssr/platform",
+      "sourceRoot": "libs/ngx-ssr/platform/src",
+      "prefix": "ngx-ssr",
+      "architect": {
+        "build": {
+          "builder": "@nrwl/angular:package",
+          "options": {
+            "tsConfig": "libs/ngx-ssr/platform/tsconfig.lib.json",
+            "project": "libs/ngx-ssr/platform/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "libs/ngx-ssr/platform/tsconfig.lib.prod.json"
+            }
+          }
+        },
+        "lint": {
+          "builder": "@nrwl/linter:eslint",
+          "options": {
+            "lintFilePatterns": [
+              "libs/ngx-ssr/platform/src/**/*.ts",
+              "libs/ngx-ssr/platform/src/**/*.html"
+            ]
+          }
+        },
+        "test": {
+          "builder": "@nrwl/jest:jest",
+          "outputs": ["coverage/libs/ngx-ssr/platform"],
+          "options": {
+            "jestConfig": "libs/ngx-ssr/platform/jest.config.js",
+            "passWithNoTests": true
+          }
+        },
+        "deploy": {
+          "builder": "@ng-builders/semrel:release",
+          "options": {
+            "npm": {
+              "pkgRoot": "dist/libs/ngx-ssr/platform"
+            }
+          }
+        }
+      }
     }
   },
   "cli": {

jest.config.js

@@ -5,5 +5,6 @@ module.exports = {
     '<rootDir>/libs/rickandmorty/api',
     '<rootDir>/libs/rickandmorty/utils',
     '<rootDir>/libs/ngx-ssr/timeout',
+    '<rootDir>/libs/ngx-ssr/platform',
   ],
 };

libs/ngx-ssr/platform/.eslintrc.json

@@ -0,0 +1,31 @@
+{
+  "extends": ["../../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "extends": [
+        "plugin:@nrwl/nx/angular",
+        "plugin:@angular-eslint/template/process-inline-templates"
+      ],
+      "parserOptions": {
+        "project": ["libs/ngx-ssr/platform/tsconfig.*?.json"]
+      },
+      "rules": {
+        "@angular-eslint/directive-selector": [
+          "error",
+          { "type": "attribute", "prefix": "ngxSsr", "style": "camelCase" }
+        ],
+        "@angular-eslint/component-selector": [
+          "error",
+          { "type": "element", "prefix": "ngx-ssr", "style": "kebab-case" }
+        ]
+      }
+    },
+    {
+      "files": ["*.html"],
+      "extends": ["plugin:@nrwl/nx/angular-template"],
+      "rules": {}
+    }
+  ]
+}

libs/ngx-ssr/platform/README.md

@@ -0,0 +1 @@
+# @ngx-ssr/platform

libs/ngx-ssr/platform/jest.config.js

@@ -0,0 +1,23 @@
+module.exports = {
+  displayName: 'ngx-ssr-platform',
+  preset: '../../../jest.preset.js',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
+  globals: {
+    'ts-jest': {
+      tsConfig: '<rootDir>/tsconfig.spec.json',
+      stringifyContentPathRegex: '\\.(html|svg)$',
+      astTransformers: {
+        before: [
+          'jest-preset-angular/build/InlineFilesTransformer',
+          'jest-preset-angular/build/StripStylesTransformer',
+        ],
+      },
+    },
+  },
+  coverageDirectory: '../../../coverage/libs/ngx-ssr/platform',
+  snapshotSerializers: [
+    'jest-preset-angular/build/AngularNoNgAttributesSnapshotSerializer.js',
+    'jest-preset-angular/build/AngularSnapshotSerializer.js',
+    'jest-preset-angular/build/HTMLCommentSerializer.js',
+  ],
+};

libs/ngx-ssr/platform/ng-package.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../../dist/libs/ngx-ssr/platform",
+  "lib": {
+    "entryFile": "src/index.ts"
+  }
+}

libs/ngx-ssr/platform/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@ngx-ssr/platform",
+  "version": "0.0.0-development",
+  "keywords": [
+    "angular",
+    "angulae ssr",
+    "universal",
+    "angular/universal",
+    "ssr",
+    "platform",
+    "is-server",
+    "is-browser"
+  ],
+  "peerDependencies": {
+    "@angular/common": "^11.0.6",
+    "@angular/core": "^11.0.6"
+  },
+  "dependencies": {
+    "tslib": "^2.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

libs/ngx-ssr/platform/src/index.ts

@@ -0,0 +1,4 @@
+export * from './lib/is-server.directive';
+export * from './lib/is-browser.directive';
+export * from './lib/ngx-ssr-platform.module';
+export * from './lib/tokens';

libs/ngx-ssr/platform/src/lib/is-browser.directive.spec.ts

@@ -0,0 +1,35 @@
+import { IsBrowserDirective } from './is-browser.directive';
+import { render, screen } from '@testing-library/angular';
+import { IS_BROWSER_PLATFORM } from './tokens';
+
+describe('IsBrowserDirective', () => {
+  it('should create an element', async () => {
+    await render(IsBrowserDirective, {
+      template: '<div *isBrowser>Some text</div>',
+      providers: [
+        {
+          provide: IS_BROWSER_PLATFORM,
+          useValue: true,
+        },
+      ],
+    });
+
+    expect(screen.getByText('Some text').outerHTML).toStrictEqual(
+      '<div>Some text</div>'
+    );
+  });
+
+  it('should not create an element', async () => {
+    await render(IsBrowserDirective, {
+      template: '<div *isBrowser>Some text</div>',
+      providers: [
+        {
+          provide: IS_BROWSER_PLATFORM,
+          useValue: false,
+        },
+      ],
+    });
+
+    expect(() => screen.getByText('Some text')).toThrowError();
+  });
+});

libs/ngx-ssr/platform/src/lib/is-browser.directive.ts

@@ -0,0 +1,23 @@
+import {
+  Directive,
+  Inject,
+  TemplateRef,
+  ViewContainerRef,
+} from '@angular/core';
+import { IS_BROWSER_PLATFORM } from './tokens';
+
+@Directive({
+  // eslint-disable-next-line @angular-eslint/directive-selector
+  selector: '[isBrowser]',
+})
+export class IsBrowserDirective {
+  constructor(
+    @Inject(IS_BROWSER_PLATFORM) isBrowser: boolean,
+    templateRef: TemplateRef<any>,
+    viewContainer: ViewContainerRef
+  ) {
+    if (isBrowser) {
+      viewContainer.createEmbeddedView(templateRef);
+    }
+  }
+}

libs/ngx-ssr/platform/src/lib/is-server.directive.spec.ts

@@ -0,0 +1,35 @@
+import { IsServerDirective } from './is-server.directive';
+import { render, screen } from '@testing-library/angular';
+import { IS_SERVER_PLATFORM } from './tokens';
+
+describe('IsServerDirective', () => {
+  it('should create an element', async () => {
+    await render(IsServerDirective, {
+      template: '<div *isServer>Some text</div>',
+      providers: [
+        {
+          provide: IS_SERVER_PLATFORM,
+          useValue: true,
+        },
+      ],
+    });
+
+    expect(screen.getByText('Some text').outerHTML).toStrictEqual(
+      '<div>Some text</div>'
+    );
+  });
+
+  it('should not create an element', async () => {
+    await render(IsServerDirective, {
+      template: '<div *isServer>Some text</div>',
+      providers: [
+        {
+          provide: IS_SERVER_PLATFORM,
+          useValue: false,
+        },
+      ],
+    });
+
+    expect(() => screen.getByText('Some text')).toThrowError();
+  });
+});

libs/ngx-ssr/platform/src/lib/is-server.directive.ts

@@ -0,0 +1,23 @@
+import {
+  Directive,
+  Inject,
+  TemplateRef,
+  ViewContainerRef,
+} from '@angular/core';
+import { IS_SERVER_PLATFORM } from './tokens';
+
+@Directive({
+  // eslint-disable-next-line @angular-eslint/directive-selector
+  selector: '[isServer]',
+})
+export class IsServerDirective {
+  constructor(
+    @Inject(IS_SERVER_PLATFORM) isServer: boolean,
+    templateRef: TemplateRef<any>,
+    viewContainer: ViewContainerRef
+  ) {
+    if (isServer) {
+      viewContainer.createEmbeddedView(templateRef);
+    }
+  }
+}

libs/ngx-ssr/platform/src/lib/ngx-ssr-platform.module.ts

@@ -0,0 +1,11 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IsBrowserDirective } from './is-browser.directive';
+import { IsServerDirective } from './is-server.directive';
+
+@NgModule({
+  imports: [CommonModule],
+  declarations: [IsBrowserDirective, IsServerDirective],
+  exports: [IsBrowserDirective, IsServerDirective],
+})
+export class NgxSsrPlatformModule {}

libs/ngx-ssr/platform/src/lib/tokens.ts

@@ -0,0 +1,18 @@
+import { inject, InjectionToken, PLATFORM_ID } from '@angular/core';
+import { isPlatformBrowser, isPlatformServer } from '@angular/common';
+
+export const IS_SERVER_PLATFORM = new InjectionToken<boolean>('Is server?', {
+  factory() {
+    const platform = inject(PLATFORM_ID);
+
+    return isPlatformServer(platform);
+  },
+});
+
+export const IS_BROWSER_PLATFORM = new InjectionToken<boolean>('Is browser?', {
+  factory() {
+    const platform = inject(PLATFORM_ID);
+
+    return isPlatformBrowser(platform);
+  },
+});

libs/ngx-ssr/platform/src/test-setup.ts

@@ -0,0 +1 @@
+import 'jest-preset-angular';

libs/ngx-ssr/platform/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.lib.prod.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}

libs/ngx-ssr/platform/tsconfig.lib.json

@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "target": "es2015",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": [],
+    "lib": ["dom", "es2018"]
+  },
+  "angularCompilerOptions": {
+    "skipTemplateCodegen": true,
+    "strictMetadataEmit": true,
+    "enableResourceInlining": true
+  },
+  "exclude": ["src/test-setup.ts", "**/*.spec.ts"],
+  "include": ["**/*.ts"]
+}

libs/ngx-ssr/platform/tsconfig.lib.prod.json

@@ -0,0 +1,10 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "enableIvy": false
+  }
+}

libs/ngx-ssr/platform/tsconfig.spec.json

@@ -0,0 +1,10 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "files": ["src/test-setup.ts"],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
+}