larsroettig / component-targetables

Allows to use .targetables.js for PWAStudio

Hi there,

I develop Adobe Commerce Projects as a Technical Architect at Adobe

Languages 📝

Contribution Graph 📊

component-targetables's Issues

targetablesSearchPaths only support paths with 2 levels

Current Behavior:

When I change targetablesSearchPaths and add a path with 3 or more levels it doesn't work.

This is my local-intercept.js

const { ExtendLocalIntercept } = require('@larsroettig/component-targetables');

function localIntercept(targets) {
    const { Targetables } = require('@magento/pwa-buildpack');
    const targetables = Targetables.using(targets);
    const extendLocalIntercept = new ExtendLocalIntercept(targetables);
    extendLocalIntercept.allowCustomTargetables('*.js', [
        'src/targets/components',
        'src/targets/rootComponents'
    ]);
    extendLocalIntercept.allowCssOverwrites('*.module.css', [
        'src/targets/components',
        'src/targets/rootComponents'
    ]);
}

module.exports = localIntercept;

And checking the source code, the problem is in the buildRegex function

private buildRegex = (targetablesSearchPaths: string[]): RegExp => {
    const componentPaths: string[] = [];
    const rootPaths: string[] = [];

    targetablesSearchPaths.forEach((tmpPath: string) => {
      const [rootPath, componentPath] = tmpPath.split('/', 2);
      componentPaths.push(componentPath);
      rootPaths.push(rootPath);
    });

    return new RegExp(
      `(${rootPaths.join('|')})/(?<type>${componentPaths.join('|')})`,
      '',
    );
  };

Expected Behavior:

Be able to set targetablesSearchPaths without limitations

Steps To Reproduce:

steps to reproduce the behavior:

1. add https://github.com/larsroettig/component-targetables to yout proyect
2. modify local-intercept.js and change the targetablesSearchPaths with a path with three o more levels
3. yarn watch