# XPlib Media Groups

With the goal of being able to open up Media Group Repositories to Publishers, Media Groups has to be simple to work with, easy to test and not tied to the rest of the Marfeel Infrastructure.

We call these Media Groups for XPlib Media Groups. The files structure and types of files are mostly the same but the tools used in them differ from traditional Media Groups.

In addition, the XPlib Media Groups have Linting, unit and End-to-end testing set up to make sure our code is in top-notch condition!

# How to know if a Media Group uses XPlib

The easiest way to identify a XPlib is by looking if there is a package.json file in the project root.

package.json file contains at least the following dependencies:

{
    "devDependencies": {
        "@marfeel/core": "<version>",
        "@marfeel/cli": "<version>",
        "@marfeel/eslint-config-mediagroup": "<version>"
    }
}

Along with package.json (opens new window), at root level of the XPlib Media there are the following files: package-lock.json (opens new window), .npmrc (opens new window), and renovate.json (opens new window)

Migration in progress

Maybe not all tenants within a XPlib Media Group are migrated. To validate if a tenant is using XPlib, check if the useMarfeelXPAsALibrary flag is enabled in the features.json file.

# Migration to XPLib

New Marfeel tenants all use XPLib. Older tenants are migrated on a case-by-case basis, if necessary.

Avoid working on migrations that are not required! Migrating to XPLib is required:

To implement a paywall provider
To impelement a new Ad Server provider

Migrating to XPLib is not required:

To update an exisitng 3pi widget
To use an existing core Ad Server without modifications

# Working in a tenant

Node 12.X version is required to work in a tenant with XPlib.

TIP

You can check your current version of node with the following command.

$ node -v
v12.13

To install the required Node version, use NVM.

All dependencies for working with a XPlib Media Group are managed via NPM so after cloning the Media Group repository install/update the dependencies.

Marfeel Nexus Access must be configured.

The .npmrc file must be at the root of the repository in order to resolve Marfeel dependencies.

Then, install the dependencies using npm install in the Media Group directory.

npm install

Jinks is not available to compile tenants using XPlib, use npm run build.

WARNING

If not all tenants in a MediaGroup are XPLib (check the features.json), you have to specify the tenant's name when running npm run build.

If you don't, expect build errors looking like this:

 looking for modules in /Users/user/marfeel/ProTenants/MediaGroup/node_modules/@marfeel/core/Dixie/src/js
    using description file: /Users/user/marfeel/ProTenants/MediaGroup/node_modules/@marfeel/core/package.json (relative path: ./Dixie/src/js)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: /Users/user/marfeel/ProTenants/MediaGroup/node_modules/@marfeel/core/package.json (relative path: ./Dixie/src/js/marfeel/touch/adservers/AdServer)
    no extension
    Field 'browser' doesn't contain a valid alias configuration
    /Users/user/marfeel/ProTenants/MediaGroup/node_modules/@marfeel/core/Dixie/src/js/marfeel/touch/adservers/AdServer doesn't exist
    .wasm

# Available commands

# Build

# `npm run build`

Compile JS and stylesheets for all tenants in the Media Group and create manifest.json file.

npm run build

# `npm run build [tenant-name]`

Compile JS and stylesheets for a Tenant and create it's manifest.json file.

npm run build [tenant-name]

TIP

This is the only way to build a tenant in a MediaGroup where not all sites are XPLib.

# `npm run build -- -v react`

Compiles the react version of a tenant. It is required for sites using the react library.

Find out if a site uses it by looking for:

The enableReact feature flag in the definition.json.
The useSSR feature flag in the features.json flag

Widget providers are written with react: this flag is required for any site using a widget provider.

npm run build -- -v react

# Lint

Run the linter

npm run lint

# Test

Run the test suite for the Media Group.

npm run test

# Jinks Cheat Sheet

Media Group	XPlib Media Group
`Jinks --build`	`npm run build`
`Jinks --scripts`	`npm run build`
`Jinks --styles`	`npm run build`
`Jinks --core`	needs to be done using Jinks --> `Jinks --coredll` or `Jinks --corereactdll`
`Jinks --custom`	`npm run build`
`eslint` and `mrf-json-lint`	`npm run lint`

# Updating dependencies

Update dependencies to get the latest package version.(Equivalent to MarfeelXP pull)

npm update

Whenever a new version of a Marfeel package is published, package-lock.json will be updated for all the Media Group repositories.

This means sometimes you'll work in local environment with versions of the packages that are not the latest ones, make sure you update them whenever needed.

INFO

Renovate is the software in charge of updating every repository's dependencies, every time a new version of a marfeel package is published it will update all the package-lock.jsons of all the Media Group repositories.

Experimental

Renovate only updates a subset of the dependencies (opens new window).

# Linting

All the XPlib mediagroups share the same ESLint rules (opens new window).

WARNING

The default configuration lints for ES6, if your tenant is using PhantomJS ignore the Whitecollar files since they will not be ESLint compliant.(PhantomJS is not ES6 compatible)

To do so, override the ESLint configuration found in the package.json file at the root of the Media Group:

{
    /* ... */
    "eslintIgnore": [
	    "**/src/whiteCollar/*.js"
	],
    /* ... */
}

# Working with local MarfeelXP

You can link Marfeel core package to your local copy of MarfeelXP to test in-progress changes or debug existing code.

Follow this process:

$ xp
$ npm link
...
/Users/user/.nvm/versions/node/v12.16.0/lib/node_modules/@marfeel/core -> /Users/user/Marfeel/MarfeelXP

$ cd ~/Marfeel/ProTenants/Mediagroup
$ npm link @marfeel/core
/Users/user/Marfeel/ProTenants/Mediagroup/node_modules/@marfeel/core -> /Users/user/.nvm/versions/node/v12.16.0/lib/node_modules/@marfeel/core -> /Users/user/Marfeel/MarfeelXP

$ jinks --coredll (or jinks --corereactdll if you are working with React)
...
$ npm run build
...

← Working on a Tenant Move or rename a tenant folder →