Development and tooling

How the Bundler Publishes npm Packages

How the Bundler Publishes npm Packages When you deploy an OSGi bundle with the specified structure, its modules are made available for consumption through canonical URLs. To better illustrate...

Published Date: May 9, 24, 6:55 PM

How JavaScript Modules are Formatted for AMD

How JavaScript Modules are Formatted for AMD Liferay AMD Loader is based on the AMD specification. All modules inside an npm OSGi bundle must be in AMD format. This is done for CommonJS modules by...

Published Date: May 9, 24, 6:55 PM

Understanding Bundler Configuration Presets

Understanding Bundler Configuration Presets The liferay-npm-bundler comes with a default configuration preset: liferay-npm-bundler-preset-standard. You may omit the liferay-npm-bundler prefix from...

Published Date: May 9, 24, 6:55 PM

Liferay npm Bundler

Liferay npm Bundler The liferay-npm-bundler is a bundler (like Webpack or Browserify) that targets Liferay Portal as a platform and assumes you're using your npm packages from widgets (as opposed...

Published Date: May 9, 24, 6:55 PM

Running a Test

Running a Test Open the poshi-ext.properties file on your poshi-standalone directory and add the following line, replacing the TestCaseFileName#TestCaseName with the one you created in Creating A...

Published Date: May 9, 24, 6:55 PM

Setup

Setup Prerequisites A supported version of Java. Google Chrome. Gradle or Gradle Wrapper 6.6.1 or higher. Setting up the Poshi Standalone Gradle Project Create a new directory, example...

Published Date: May 9, 24, 6:55 PM

Syntax Validation

Syntax Validation The Poshi Standalone grade projects includes a validation task that can be used to check your code for syntax errors before running your test. To use this, simply run ./gradlew...

Published Date: May 9, 24, 6:55 PM

Understanding Test Results and Debugging Tests

Understanding Test Results and Debugging Tests Poshi tests are run on the terminal or command line. When a test run is completed there are multiple ways to view the test results and diagnose test...

Published Date: May 9, 24, 6:55 PM

Poshi Basics

Poshi Basics New features, improvements, and system upgrades can sometimes introduce unexpected behaviors and bugs. Running suites of automated tests is an advantageous method of identifying issues...

Published Date: May 9, 24, 6:55 PM

Poshi Advantages

Poshi Advantages Simplified Syntax To make it easier for less technical testers to read and write test automation, Poshi uses a simplified Groovy-like script syntax. It is less wordy than most...

Published Date: May 9, 24, 6:55 PM

Poshi Layers

Published Date: May 9, 24, 6:55 PM

Using Poshi Resources

Using Poshi Resources Once the Poshi resources jar file is loaded onto your Poshi project, you are now able to use Liferay's commonly used functions, paths, and macros. To distinguish between files...

Published Date: May 9, 24, 6:55 PM

Reference

Reference Node Version Information

Published Date: May 9, 24, 6:55 PM

Node Version Information

Node Version Information Liferay DXP uses Node (and NPM) for many different frontend components. Specifically, the Liferay Theme Generator and Liferay's JavaScript application tools require the use...

Published Date: May 9, 24, 6:55 PM

Using the Bootstrap 3 Compatibility Layer in Liferay 7.4

Using the Bootstrap 3 Compatibility Layer in Liferay 7.4 As of Liferay DXP 7.4 GA1, the Bootstrap 3 compatibility layer is removed from the built-in packages in Liferay frontend applications. If...

Published Date: May 9, 24, 6:55 PM

Creating a Workflow Powered Application

Creating a Workflow Powered Application Subscribers Workflow Powered Applications require data from multiple stakeholders. These process-driven applications can go through multiple stages before...

Published Date: May 9, 24, 6:55 PM

Deploying WARs (WAB Generator)

Deploying WARs (WAB Generator) You can create applications as Java EE-style Web Application ARchive (WAR) artifacts or as Java ARchive (JAR) OSGi bundle artifacts. Bean Portlets, PortletMVC4Spring...

Published Date: May 9, 24, 6:55 PM

JARs Excluded from WABs

JARs Excluded from WABs [Liferay-generated web application bundles (WABs) are stripped of third party JARs that contain packages that Liferay exports already. Deploying the same third party...

Published Date: May 9, 24, 6:55 PM

Troubleshooting Blade CLI

Troubleshooting Blade CLI If Blade CLI isn't working as expected, you may find answers here. The blade command is not available in my CLI The Blade CLI installer adds the blade command to your...

Published Date: May 9, 24, 6:55 PM

Configuring Liferay Workspace

Configuring Liferay Workspace Liferay Workspace is simple to use, and you can learn the basics by starting at the beginning. If you're happily creating projects, deploying code, or using a Docker...

Published Date: May 9, 24, 6:55 PM

Configuring a Liferay Docker Container

Configuring a Liferay Docker Container Creating and deploying containers is an important part of the modern developer workflow. Liferay Workspace makes it easy to use Docker containers both for...

Published Date: May 9, 24, 6:55 PM

Creating A Liferay Workspace

Creating A Liferay Workspace You can create a Liferay Workspace manually or with Blade CLI. Creating a Liferay Workspace Manually To create a Liferay Workspace manually, you must have Gradle...

Published Date: May 9, 24, 6:55 PM

Creating Code with Liferay Workspace

Creating Code with Liferay Workspace Liferay Workspace is the developer's tool for creating and managing Liferay development projects. Creating Projects Blade CLI makes it easy to create projects...

Published Date: May 9, 24, 6:55 PM

Creating Deployment Environments

Creating Deployment Environments There comes a point when your code is ready to share. For that, you must build an environment. In the corporate world, there are usually three environments: ...

Published Date: May 9, 24, 6:55 PM

Liferay CLI Tool

Liferay CLI Tool The Liferay CLI tool makes it easy to create Angular, JavaScript, React, shared bundle, or Vue.js projects to interface with Liferay's REST and GraphQL services. Using a liferay...

Published Date: May 9, 24, 6:55 PM

Other Tools

Other Tools Liferay CLI Tool Liferay npm Bundler Liferay npm Bundler Understanding Bundler Loaders Changes Between Bundler 1.x and 2.x Default Bundler Loaders How Liferay and Loader...

Published Date: May 9, 24, 6:55 PM

Liferay npm Bundler

Published Date: May 9, 24, 6:55 PM

Bundler Migration Guide

Published Date: May 9, 24, 6:55 PM

Migrating an Angular Project to Use Liferay npm Bundler 2.x

Migrating an Angular Project to Use Liferay npm Bundler 2.x Follow these steps to migrate your Angular project to use liferay-npm-bundler 2.x. While liferay-npm-bundler 1.x relied on Babel to...

Published Date: May 9, 24, 6:55 PM

Migrating a liferay-npm-bundler Project from 1.x to 2.x

Migrating a liferay-npm-bundler Project from 1.x to 2.x liferay-npm-bundler 2.x offers more stability and includes more features out-of-the-box. If you already created a project using the 1.x...

Published Date: May 9, 24, 6:55 PM

Migrating a Plain JavaScript, Billboard JS, JQuery, Metal JS, React, or Vue JS Project to Use Liferay npm Bundler 2.x

Migrating a Plain JavaScript, Billboard JS, JQuery, Metal JS, React, or Vue JS Project to Use Liferay npm Bundler 2.x Follow these steps to migrate the framework projects shown below to use...

Published Date: May 9, 24, 6:55 PM

Migrating Your Project to Use liferay-npm-bundler's New Mode

Migrating Your Project to Use liferay-npm-bundler's New Mode Since issue #303, two modes of operation are available for the liferay-npm-bundler. You can preprocess files before the bundler runs, or...

Published Date: May 9, 24, 6:55 PM

Changes Between Bundler 1.x and 2.x

Changes Between Bundler 1.x and 2.x This article outlines the key changes between liferay-npm-bundler version 1.x and 2.x. Automatically Formatting Modules for AMD In version series 1.x of the...

Published Date: May 9, 24, 6:55 PM

Understanding the npmbundlerrc Structure

Understanding the npmbundlerrc Structure The liferay-npm-bundler is configured via a .npmbundlerrc file placed in the widget project's root folder. You can create a complete configuration manually...

Published Date: May 9, 24, 6:55 PM

OSGi Bundles and npm Package Structure

OSGi Bundles and npm Package Structure To deploy JavaScript modules, you must create an OSGi bundle with the npm dependencies extracted from the project's node_modules folder and modify them to...

Published Date: May 9, 24, 6:55 PM

Understanding the Liferay npm Bundler Loader

Understanding the Liferay npm Bundler Loader liferay-npm-bundler's mechanism is inspired by webpack. Like webpack, the liferay-npm-bundler processes files using a set of rules that include loaders...

Published Date: May 9, 24, 6:55 PM

Poshi Test Automation

Poshi Test Automation Poshi is a test automation framework that is simple, easy to understand, and does not require prior development experience to get started. Poshi tests can be written to...

Published Date: May 9, 24, 6:55 PM

Getting Started

Getting Started Previously, Poshi tests could only be executed by downloading and creating the test files within the Liferay source code. The Poshi Standalone gradle project enables you to use...

Published Date: May 9, 24, 6:55 PM

Creating a Macro File

Creating a Macro File Test Scenario Write your first macro file using the test scenario below: You would like to test that your name does not appear on any learn.liferay.com article. The steps you...

Published Date: May 9, 24, 6:55 PM

Creating A Path File

Creating A Path File Test Scenario Write your first path file using the test scenario below: You would like to test that your name does not appear on any learn.liferay.com article. The steps you...

Published Date: May 9, 24, 6:55 PM

Creating the Testcase File

Creating the Testcase File Test Scenario Write your first testcase file using the test scenario below: You would like to test that your name does not appear on any learn.liferay.com article. The...

Published Date: May 9, 24, 6:55 PM

Functions

Functions In Poshi, Functions handle extra WebDriver commands that an element might require to interact with a page object or element. Functions combine the basic methods defined in the...

Published Date: May 9, 24, 6:55 PM

Macros

Macros A macro is a set of functions that perform a task. Macros are where locators (paths) and functions are brought together to script interactions that a user performs on the system being...

Published Date: May 9, 24, 6:55 PM

Paths

Paths A path is an element on a page that a test will interact with. An element can be a button, text field, link, image, paragraph, or just about anything you would need to assert, click, or type...

Published Date: May 9, 24, 6:55 PM

Testcases

Testcases A testcase file in Poshi is a collection of test scenarios grouped in blocks of code called test blocks. The three main test blocks: setUp, test, and tearDown, are made up of multiple...

Published Date: May 9, 24, 6:55 PM

Using Variables

Using Variables Though not a Poshi layer, variables are a large part of Poshi tests. Variables, like in other programming languages, are used to store data which can be referenced and reused in...

Published Date: May 9, 24, 6:55 PM

Poshi Resources

Poshi Resources To give Poshi test writers easy access to commonly used functions or other files, Poshi resources were created to store existing Poshi files as dependencies that can be loaded apart...

Published Date: May 9, 24, 6:55 PM

Configuration

Configuration In order to give test writers easy access to commonly used functions, paths, or macros, Poshi resources were created to store existing Poshi files as dependencies. These resources can...

Published Date: May 9, 24, 6:55 PM

Developer Guide

Developer Guide Below are developer-related articles for site building.

Published Date: May 9, 24, 6:57 PM

Developing Page Fragments Reference

Developing Page Fragments Reference The Developing Fragments Reference provides essential information on key aspects of fragment development in Liferay. It covers command references, configuration...

Published Date: May 9, 24, 6:57 PM

Fragment Configuration Types Reference

Fragment Configuration Types Reference Below are the available configuration types for fragments. See Adding Configuration Options to Fragments for more on how to make a fragment configurable. ...

Published Date: May 9, 24, 6:57 PM

Fragment Specific Tags and Attributes Reference

Fragment Specific Tags and Attributes Reference Along with standard HTML, CSS, and JavaScript, you can use Liferay-specific tags and attributes to define editable sections, embed widgets, and more....

Published Date: May 9, 24, 6:57 PM

Fragments Toolkit Command Reference

Fragments Toolkit Command Reference The Fragments Toolkit is deprecated as of Liferay 2024.Q1+/Portal 7.4 GA112+. See Alternatives for the Fragments Toolkit for more information. The Fragments...

Published Date: May 9, 24, 6:57 PM

Applying Styles to Fragments

Applying Styles to Fragments When you add a fragment to a page, you can use the sidebar menu to configure the fragment, including the Styles configuration tab. Use the Styles tab in the sidebar...

Published Date: May 9, 24, 6:57 PM

Adding Configuration Options to Fragments

Adding Configuration Options to Fragments Liferay DXP 7.2 SP1 Configurable options make your fragments flexible, reducing the need to maintain many similar fragments. For example, instead of...

Published Date: May 9, 24, 6:57 PM

Developing Page Fragments

Developing Page Fragments Page fragments are the building blocks for content pages. They're made from the three components of web pages: CSS, HTML, and JavaScript. To create a page you combine...

Published Date: May 9, 24, 6:57 PM

Page Fragment Editor Interface Reference

Page Fragment Editor Interface Reference The page fragment editor's interface is organized into two tabs: Code Editor Configuration The sections below cover how to use these portions of the...

Published Date: May 9, 24, 6:57 PM

Auto-Deploying Fragments

Auto-Deploying Fragments Liferay Portal 7.3 GA1+ or Liferay DXP 7.3+ If you're developing page fragments with your own tooling, you can deploy them by packaging them in ZIP files for importing via...

Published Date: May 9, 24, 6:57 PM

Best Practices for Using Fragment Configurations

Best Practices for Using Fragment Configurations When you are creating page fragments for your site with your own configurations, it's your responsibility to use them in their HTML presentation...

Published Date: May 9, 24, 6:57 PM

Creating a Contributed Fragment Set

Creating a Contributed Fragment Set Contributed fragment sets are deployable modules containing page fragments. Fragments in a contributed set can be used like regular fragments, but aren't...

Published Date: May 9, 24, 6:57 PM