@openedx/frontend-base 1.0.0-alpha.12 → 1.0.0-alpha.13

package/config/webpack/webpack.config.dev.js

@@ -1,70 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_refresh_webpack_plugin_1 = __importDefault(require("@pmmmwh/react-refresh-webpack-plugin"));
-const fork_ts_checker_webpack_plugin_1 = __importDefault(require("fork-ts-checker-webpack-plugin"));
-const mini_css_extract_plugin_1 = __importDefault(require("mini-css-extract-plugin"));
-const path_1 = __importDefault(require("path"));
-const webpack_remove_empty_scripts_1 = __importDefault(require("webpack-remove-empty-scripts"));
-const common_config_1 = require("./common-config");
-const getLocalAliases_1 = __importDefault(require("./utils/getLocalAliases"));
-const getPublicPath_1 = __importDefault(require("./utils/getPublicPath"));
-const getResolvedSiteConfigPath_1 = __importDefault(require("./utils/getResolvedSiteConfigPath"));
-const aliases = (0, getLocalAliases_1.default)();
-const resolvedSiteConfigPath = (0, getResolvedSiteConfigPath_1.default)('site.config.dev.tsx');
-const config = {
-    entry: {
-        app: path_1.default.resolve(process.cwd(), 'node_modules/@openedx/frontend-base/shell/site'),
-    },
-    output: {
-        path: path_1.default.resolve(process.cwd(), './dist'),
-        publicPath: (0, getPublicPath_1.default)(),
-    },
-    resolve: {
-        alias: {
-            ...aliases,
-            'site.config': resolvedSiteConfigPath,
-            '@src': path_1.default.resolve(process.cwd(), 'src'),
-        },
-        extensions: ['.js', '.jsx', '.ts', '.tsx'],
-    },
-    mode: 'development',
-    devtool: 'eval-source-map',
-    module: {
-        rules: [
-            ...(0, common_config_1.getCodeRules)('dev', resolvedSiteConfigPath),
-            (0, common_config_1.getStylesheetRule)('dev'),
-            ...(0, common_config_1.getFileLoaderRules)(),
-        ],
-    },
-    optimization: {
-        splitChunks: {
-            chunks: 'all',
-        },
-        minimizer: (0, common_config_1.getImageMinimizer)(),
-    },
-    // Specify additional processing or side-effects done on the Webpack output bundles as a whole.
-    plugins: [
-        // RemoveEmptyScriptsPlugin get rid of empty scripts generated by webpack when using mini-css-extract-plugin
-        // This helps to clean up the final bundle application
-        // See: https://www.npmjs.com/package/webpack-remove-empty-scripts#usage-with-mini-css-extract-plugin
-        new webpack_remove_empty_scripts_1.default(),
-        // Writes the extracted CSS from each entry to a file in the output directory.
-        new mini_css_extract_plugin_1.default({
-            filename: '[name].css',
-        }),
-        (0, common_config_1.getHtmlWebpackPlugin)(),
-        new react_refresh_webpack_plugin_1.default(),
-        new fork_ts_checker_webpack_plugin_1.default(),
-    ],
-    // This configures webpack-dev-server which serves bundles from memory and provides live
-    // reloading.
-    devServer: (0, common_config_1.getDevServer)(),
-    // Limit the number of watched files to avoid `inotify` resource starvation.
-    watchOptions: {
-        ignored: /node_modules/
-    }
-};
-exports.default = config;

package/config/webpack/webpack.config.dev.shell.js

@@ -1,104 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const ts_transformer_1 = require("@formatjs/ts-transformer");
-const react_refresh_webpack_plugin_1 = __importDefault(require("@pmmmwh/react-refresh-webpack-plugin"));
-const fork_ts_checker_webpack_plugin_1 = __importDefault(require("fork-ts-checker-webpack-plugin"));
-const mini_css_extract_plugin_1 = __importDefault(require("mini-css-extract-plugin"));
-const path_1 = __importDefault(require("path"));
-const react_refresh_typescript_1 = __importDefault(require("react-refresh-typescript"));
-const webpack_remove_empty_scripts_1 = __importDefault(require("webpack-remove-empty-scripts"));
-const common_config_1 = require("./common-config");
-const html_webpack_plugin_1 = __importDefault(require("html-webpack-plugin"));
-const getLocalAliases_1 = __importDefault(require("./utils/getLocalAliases"));
-const getPublicPath_1 = __importDefault(require("./utils/getPublicPath"));
-const getResolvedSiteConfigPath_1 = __importDefault(require("./utils/getResolvedSiteConfigPath"));
-const aliases = (0, getLocalAliases_1.default)();
-const resolvedSiteConfigPath = (0, getResolvedSiteConfigPath_1.default)('shell/site.config.dev.tsx');
-const config = {
-    entry: {
-        app: path_1.default.resolve(process.cwd(), 'shell/site'),
-    },
-    output: {
-        path: path_1.default.resolve(process.cwd(), './dist'),
-        publicPath: (0, getPublicPath_1.default)(),
-    },
-    resolve: {
-        alias: {
-            ...aliases,
-            'site.config': resolvedSiteConfigPath,
-            '@src': path_1.default.resolve(process.cwd(), 'src'),
-        },
-        extensions: ['.js', '.jsx', '.ts', '.tsx'],
-    },
-    mode: 'development',
-    devtool: 'eval-source-map',
-    module: {
-        rules: [
-            {
-                test: /\.(js|jsx|ts|tsx)$/,
-                include: [
-                    /shell/,
-                    /runtime/,
-                    path_1.default.resolve(process.cwd(), 'types'),
-                    resolvedSiteConfigPath,
-                ],
-                use: {
-                    loader: require.resolve('ts-loader'),
-                    options: {
-                        transpileOnly: true,
-                        compilerOptions: {
-                            noEmit: false,
-                        },
-                        getCustomTransformers() {
-                            return {
-                                before: [
-                                    (0, ts_transformer_1.transform)({
-                                        overrideIdFn: '[sha512:contenthash:base64:6]',
-                                    }),
-                                    (0, react_refresh_typescript_1.default)()
-                                ],
-                            };
-                        },
-                    },
-                },
-            },
-            (0, common_config_1.getStylesheetRule)('dev'),
-            ...(0, common_config_1.getFileLoaderRules)(),
-        ],
-    },
-    optimization: {
-        splitChunks: {
-            chunks: 'all',
-        },
-        minimizer: (0, common_config_1.getImageMinimizer)(),
-    },
-    // Specify additional processing or side-effects done on the Webpack output bundles as a whole.
-    plugins: [
-        // RemoveEmptyScriptsPlugin get rid of empty scripts generated by webpack when using mini-css-extract-plugin
-        // This helps to clean up the final bundle application
-        // See: https://www.npmjs.com/package/webpack-remove-empty-scripts#usage-with-mini-css-extract-plugin
-        new webpack_remove_empty_scripts_1.default(),
-        // Writes the extracted CSS from each entry to a file in the output directory.
-        new mini_css_extract_plugin_1.default({
-            filename: '[name].css',
-        }),
-        new html_webpack_plugin_1.default({
-            inject: true, // Appends script tags linking to the webpack bundles at the end of the body
-            template: path_1.default.resolve(process.cwd(), 'shell/public/index.html'),
-            chunks: ['app'],
-        }),
-        new react_refresh_webpack_plugin_1.default(),
-        new fork_ts_checker_webpack_plugin_1.default(),
-    ],
-    // This configures webpack-dev-server which serves bundles from memory and provides live
-    // reloading.
-    devServer: (0, common_config_1.getDevServer)(),
-    // Limit the number of watched files to avoid `inotify` resource starvation.
-    watchOptions: {
-        ignored: /node_modules/
-    }
-};
-exports.default = config;

package/runtime/__mocks__/file.js

@@ -1 +0,0 @@
-export default 'FileMock';

package/runtime/__mocks__/svg.js

@@ -1 +0,0 @@
-export default 'SvgURL';

package/runtime/__mocks__/universal-cookie.js

@@ -1,6 +0,0 @@
-const mockCookiesImplementation = {
-  get: jest.fn(),
-  remove: jest.fn(),
-};
-
-module.exports = () => mockCookiesImplementation;

package/runtime/analytics/MockAnalyticsService.js

@@ -1,71 +0,0 @@
-/**
- * The MockAnalyticsService implements all functions of AnalyticsService as Jest mocks (jest.fn())).
- * It emulates the behavior of a real analytics service but witohut making any requests. It has no
- * other functionality.
- *
- * @implements {AnalyticsService}
- * @memberof module:Analytics
- */
-class MockAnalyticsService {
-  static hasIdentifyBeenCalled = false;
-
-  constructor({ httpClient, loggingService }) {
-    this.loggingService = loggingService;
-    this.httpClient = httpClient;
-  }
-
-  checkIdentifyCalled = jest.fn(() => {
-    if (!this.hasIdentifyBeenCalled) {
-      this.loggingService.logError('Identify must be called before other tracking events.');
-    }
-  });
-
-  /**
-   * Returns a resolved promise.
-   *
-   * @returns {Promise} The promise returned by HttpClient.post.
-   */
-  sendTrackingLogEvent = jest.fn(() => Promise.resolve());
-
-  /**
-   * No-op, but records that identify has been called.
-   *
-   * @param {string} userId
-   * @throws {Error} If userId argument is not supplied.
-   */
-  identifyAuthenticatedUser = jest.fn((userId) => {
-    if (!userId) {
-      throw new Error('UserId is required for identifyAuthenticatedUser.');
-    }
-    this.hasIdentifyBeenCalled = true;
-  });
-
-  /**
-   * No-op, but records that it has been called to prevent double-identification.
-   * @returns {Promise} A resolved promise.
-   */
-  identifyAnonymousUser = jest.fn(() => {
-    this.hasIdentifyBeenCalled = true;
-    return Promise.resolve();
-  });
-
-  /**
-   * Logs the event to the console.
-   *
-   * Checks whether identify has been called, logging an error to the logging service if not.
-   */
-  sendTrackEvent = jest.fn(() => {
-    this.checkIdentifyCalled();
-  });
-
-  /**
-   * Logs the event to the console.
-   *
-   * Checks whether identify has been called, logging an error to the logging service if not.
-   */
-  sendPageEvent = jest.fn(() => {
-    this.checkIdentifyCalled();
-  });
-}
-
-export default MockAnalyticsService;

package/runtime/analytics/SegmentAnalyticsService.js

@@ -1,243 +0,0 @@
-import formurlencoded from 'form-urlencoded';
-import { snakeCaseObject } from '../utils';
-
-/**
- * @implements {AnalyticsService}
- * @memberof module:Analytics
- */
-class SegmentAnalyticsService {
-  constructor({ httpClient, loggingService, config }) {
-    this.loggingService = loggingService;
-    this.httpClient = httpClient;
-    this.trackingLogApiUrl = `${config.lmsBaseUrl}/event`;
-    this.segmentKey = config.segmentKey;
-    this.hasIdentifyBeenCalled = false;
-    this.segmentInitialized = false;
-
-    if (this.segmentKey) {
-      this.initializeSegment();
-    }
-  }
-
-  // The code in this function is from Segment's website, with a few updates:
-  // - It uses the segmentKey from the SegmentAnalyticsService instance.
-  // - It also saves a "segmentInitialized" variable on the SegmentAnalyticsService instance so
-  //   that the service can keep track of its own initialization state.
-  // Reference:
-  // https://segment.com/docs/connections/sources/catalog/libraries/website/javascript/quickstart/
-  initializeSegment() {
-    // Create a queue, but don't obliterate an existing one!
-    global.analytics = global.analytics || [];
-    const { analytics } = global;
-
-    // If the real analytics.js is already on the page return.
-    if (analytics.initialize) {
-      this.segmentInitialized = true;
-      return;
-    }
-
-    // If the snippet was invoked do nothing.
-    if (analytics.invoked) {
-      this.segmentInitialized = true;
-      return;
-    }
-
-    // Invoked flag, to make sure the snippet
-    // is never invoked twice.
-    analytics.invoked = true;
-
-    // A list of the methods in Analytics.js to stub.
-    analytics.methods = [
-      'trackSubmit',
-      'trackClick',
-      'trackLink',
-      'trackForm',
-      'pageview',
-      'identify',
-      'reset',
-      'group',
-      'track',
-      'ready',
-      'alias',
-      'debug',
-      'page',
-      'once',
-      'off',
-      'on',
-    ];
-
-    // Define a factory to create stubs. These are placeholders
-    // for methods in Analytics.js so that you never have to wait
-    // for it to load to actually record data. The `method` is
-    // stored as the first argument, so we can replay the data.
-    analytics.factory = method => (...args) => {
-      args.unshift(method);
-      analytics.push(args);
-      return analytics;
-    };
-
-    // For each of our methods, generate a queueing stub.
-    analytics.methods.forEach((key) => {
-      analytics[key] = analytics.factory(key);
-    });
-
-    // Define a method to load Analytics.js from our CDN,
-    // and that will be sure to only ever load it once.
-    analytics.load = (key, options) => {
-      // Create an async script element based on your key.
-      const script = document.createElement('script');
-      script.type = 'text/javascript';
-      script.onerror = () => {
-        this.segmentInitialized = false;
-        const event = new Event('segmentFailed');
-        document.dispatchEvent(event);
-      };
-      script.async = true;
-      script.src = `https://cdn.segment.com/analytics.js/v1/${key}/analytics.min.js`;
-
-      // Insert our script next to the first script element.
-      const first = document.getElementsByTagName('script')[0];
-      first.parentNode.insertBefore(script, first);
-      analytics._loadOptions = options;
-
-      this.segmentInitialized = true;
-    };
-
-    // Add a version to keep track of what's in the wild.
-    analytics.SNIPPET_VERSION = '4.1.0';
-
-    // Load Analytics.js with your key, which will automatically
-    // load the tools you've enabled for your account. Boosh!
-    analytics.load(this.segmentKey);
-  }
-
-  /**
-   * Checks that identify was first called.  Otherwise, logs error.
-   *
-   */
-  checkIdentifyCalled() {
-    if (!this.hasIdentifyBeenCalled) {
-      this.loggingService.logError('Identify must be called before other tracking events.');
-    }
-  }
-
-  /**
-   * Logs events to tracking log and downstream.
-   * For tracking log event documentation, see
-   * https://openedx.atlassian.net/wiki/spaces/AN/pages/13205895/Event+Design+and+Review+Process
-   *
-   * @param {string} eventName (event_type on backend, but named to match Segment api)
-   * @param {Object} properties (event on backend, but named properties to match Segment api)
-   * @returns {Promise} The promise returned by HttpClient.post.
-   */
-  sendTrackingLogEvent(eventName, properties) {
-    const snakeEventData = snakeCaseObject(properties, { deep: true });
-    const serverData = {
-      event_type: eventName,
-      event: JSON.stringify(snakeEventData),
-      page: global.location.href,
-    };
-    return this.httpClient.post(
-      this.trackingLogApiUrl,
-      formurlencoded(serverData),
-      {
-        headers: {
-          'Content-Type': 'application/x-www-form-urlencoded',
-        },
-      },
-    ).catch((error) => {
-      this.loggingService.logError(error);
-    });
-  }
-
-  /**
-   * * Send identify call to Segment.
-   *
-   * @param {string} userId
-   * @param {*} [traits]
-   */
-  identifyAuthenticatedUser(userId, traits) {
-    if (!userId) {
-      throw new Error('UserId is required for identifyAuthenticatedUser.');
-    }
-
-    if (!this.segmentInitialized) {
-      return;
-    }
-    global.analytics.identify(userId, traits);
-    this.hasIdentifyBeenCalled = true;
-  }
-
-  /**
-   * Send anonymous identify call to Segment's identify.
-   *
-   * @param {*} [traits]
-   * @returns {Promise} Promise that will resolve once the document readyState is complete
-   */
-  identifyAnonymousUser(traits) { // eslint-disable-line @typescript-eslint/no-unused-vars
-    if (!this.segmentInitialized) {
-      return Promise.resolve();
-    }
-    // if we do not have an authenticated user (indicated by being in this method),
-    // but we still have a user id associated in segment, reset the local segment state
-    // This has to be wrapped in the analytics.ready() callback because the analytics.user()
-    // function isn't available until the analytics.js package has finished initializing.
-    return new Promise((resolve, reject) => { // eslint-disable-line @typescript-eslint/no-unused-vars
-      global.analytics.ready(() => {
-        if (global.analytics.user().id()) {
-          global.analytics.reset();
-        }
-        // We don’t need to call `identify` for anonymous users and can just make the value of
-        // hasIdentifyBeenCalled true. Segment automatically assigns them an anonymousId, so
-        // just calling `page` and `track` works fine without identify.
-        this.hasIdentifyBeenCalled = true;
-        resolve();
-      });
-
-      // this is added to handle a specific use-case where if a user has blocked the analytics
-      // tools in their browser, this promise does not get resolved and user sees a blank
-      // page. Dispatching this event in script.onerror callback in analytics.load.
-      document.addEventListener('segmentFailed', resolve);
-      // This is added to handle the google analytics blocked case which is injected into
-      // the DOM by segment.min.js.
-      setTimeout(() => {
-        if (!global.ga?.create || !global.google_tag_manager) {
-          this.segmentInitialized = false;
-          resolve();
-        }
-      }, 2000);
-    });
-  }
-
-  /**
-   * Sends a track event to Segment and downstream.
-   * Note: For links and forms, you should use trackLink and trackForm instead.
-   *
-   * @param {*} eventName
-   * @param {*} [properties]
-   */
-  sendTrackEvent(eventName, properties) {
-    if (!this.segmentInitialized) {
-      return;
-    }
-    this.checkIdentifyCalled();
-    global.analytics.track(eventName, properties);
-  }
-
-  /**
-   * Sends a page event to Segment and downstream.
-   *
-   * @param {*} [name] If only one string arg provided, assumed to be name.
-   * @param {*} [category] Name is required to pass a category.
-   * @param {*} [properties]
-   */
-  sendPageEvent(category, name, properties) {
-    if (!this.segmentInitialized) {
-      return;
-    }
-    this.checkIdentifyCalled();
-    global.analytics.page(category, name, properties);
-  }
-}
-
-export default SegmentAnalyticsService;

package/runtime/analytics/index.ts

@@ -1,12 +0,0 @@
-export {
-  configureAnalytics,
-  getAnalyticsService,
-  identifyAnonymousUser,
-  identifyAuthenticatedUser,
-  resetAnalyticsService,
-  sendPageEvent,
-  sendTrackEvent,
-  sendTrackingLogEvent
-} from './interface';
-export { default as MockAnalyticsService } from './MockAnalyticsService';
-export { default as SegmentAnalyticsService } from './SegmentAnalyticsService';