Home

>

Tools

>

Strapi

>

Releases

>

4.0.0-beta.14

Strapi Release: 4.0.0-beta.14

Pre Release

Tag Name: v4.0.0-beta.14

Release Date: 11/19/2021

Strapi LogoStrapi

Open-source headless CMS built with Node.js. Provides developers with complete freedom in choosing their favorite tools and frameworks for frontend development.

TL;DR

Strapi v4.0.0-beta.14 introduces significant improvements to the core architecture with new factories for controllers, services, and routers. This release also brings comprehensive typography updates across the admin panel, fixes for GraphQL attribute handling, and various UI enhancements. The update requires developers to adapt their code to the new factory pattern for controllers and services, as files must now physically exist rather than being generated in memory.

Highlight of the Release

    • Introduction of factories for controllers, services, and routers in the Core Content API
    • Comprehensive typography updates across the entire admin panel
    • New plugins page with dedicated API
    • Enhanced media library with filters and improved drag-and-drop functionality
    • Fixed GraphQL handling for writable attributes in input types
    • Improved dynamic zones and repeatable components UI

Migration Guide

Updating Routes

Routes must now be updated to use the new core router pattern:

// Old approach - No longer works
module.exports = {
  routes: [
    {
      method: 'GET',
      path: '/articles',
      handler: 'article.find',
      config: { /* ... */ },
    },
  ],
};

// New approach - Required
module.exports = {
  routes: [
    {
      method: 'GET',
      path: '/articles',
      handler: 'api::article.article.find',
      config: { /* ... */ },
    },
  ],
};

Updating Controllers

Controllers must now physically exist as files. Auto-generation in memory is no longer supported:

  1. Create a file at src/api/apiName/controllers/content-type-name.js
  2. Use the factory pattern:
// Required file: src/api/article/controllers/article.js
const { createCoreController } = require('@strapi/strapi').factories;

module.exports = createCoreController('api::article.article', ({ strapi }) => ({
  // Add custom methods or override existing ones
  async find(ctx) {
    // Custom implementation
    const { data, meta } = await super.find(ctx);
    return { data, meta };
  },
}));

Updating Services

Services must now physically exist as files. Auto-generation in memory is no longer supported:

  1. Create a file at src/api/apiName/services/content-type-name.js
  2. Use the factory pattern:
// Required file: src/api/article/services/article.js
const { createCoreService } = require('@strapi/strapi').factories;

module.exports = createCoreService('api::article.article', ({ strapi }) => ({
  // Add custom methods or override existing ones
  async find(params) {
    // Custom implementation
    return await super.find(params);
  },
}));

Upgrade Recommendations

This is a beta release with breaking changes from previous betas. It's recommended to:

  1. Backup your project before upgrading
  2. Update to v4.0.0-beta.14 using npm install @strapi/[email protected]
  3. Review and update all custom controllers, services, and routes to match the new factory pattern
  4. Ensure all required files physically exist in your project structure
  5. Test thoroughly in a development environment before deploying to production

For developers with extensive customizations to controllers and services, this upgrade will require significant changes to adapt to the new factory pattern. Plan accordingly and allocate sufficient time for testing.

If you're starting a new project, it's recommended to use this beta version as it represents the direction Strapi v4 is heading with more stable core architecture.

Bug Fixes

Admin Panel

  • Fixed password icon color in input fields
  • Fixed footer padding in list views
  • Fixed UI bugs in the Content Manager
  • Fixed empty component permissions in Content Types
  • Fixed DZ (Dynamic Zone) thread background color
  • Fixed DZ label padding
  • Fixed timestamps field display
  • Fixed CTB (Content-Type Builder) navigation issues
  • Fixed CTB UI in custom radio group
  • Unlocked app when there is an error during user creation

Core Functionality

  • Fixed asset types for images
  • Fixed tests failing with wrong Strapi instance after destroying
  • Fixed single types routes
  • Fixed missing permission for empty components in Content Types
  • Fixed build release script
  • Fixed nested component resolvers in GraphQL
  • Fixed file watching in development mode by checking if app and admin are defined in destroy

New Features

Core Architecture

  • Factory Pattern Implementation: New factories for controllers, services, and routers in the Core Content API
  • Prototype Chaining: Added support for the super keyword in controllers and services
  • Core Router: New core router implementation for more consistent routing

Admin Panel

  • Plugins Page: New dedicated page for managing plugins with improved UI
  • Plugins List API: Added /plugins list API endpoint with plain English descriptions
  • Media Library Enhancements:
    • Added filters to the Media Library modal
    • Improved drag-and-drop functionality with preview box
    • Enhanced asset dialog and asset list components

User Interface

  • Typography System: Comprehensive typography updates across the entire admin panel including:
    • SSO pages
    • Homepage
    • Media Library
    • Content-Type Builder
    • Content Manager
    • i18n settings
    • Admin components
    • Onboarding screens
    • Authentication pages
    • Profile pages

Security Updates

No specific security fixes were mentioned in this release.

Performance Improvements

Admin Panel

  • Pre-built Admin Panel: The admin panel is now pre-built during the release process, improving initial load times
  • Optimized Component Rendering: Typography updates and component refactoring have led to more efficient UI rendering
  • Improved State Management:
    • Clear modal state when closing it to prevent memory leaks
    • Better handling of component initialization

GraphQL

  • Optimized Type Registration: Only register writable attributes in input types, reducing schema complexity
  • Improved Component Resolvers: Better handling of nested components in GraphQL resolvers

Development Mode

  • Enhanced File Watching: More reliable file watching mechanism with proper cleanup on destroy

Impact Summary

This beta release represents a significant architectural shift in how Strapi handles core functionality through the introduction of factories for controllers, services, and routers. The most impactful change is the requirement for these files to physically exist rather than being generated in memory, which will require code updates for developers using custom controllers or services.

The admin UI receives comprehensive typography updates across all sections, creating a more consistent and polished user experience. The new plugins page and enhanced media library with filters and improved drag-and-drop functionality provide better content management capabilities.

For GraphQL users, the optimization of input types to only include writable attributes improves schema clarity and performance. The fix for nested component resolvers enhances reliability when working with complex content structures.

The update to track the updatedBy field on publish/unpublish actions improves content auditing capabilities, while various UI fixes for dynamic zones, repeatable components, and timestamps fields enhance the content editing experience.

Overall, this beta brings Strapi v4 closer to a stable release with more consistent architecture patterns and improved UI, though it requires developers to adapt to the new factory pattern.

Full Release Notes

Changes

  • Factories Core Content API.
  • UpdatedBy update on publish / unpublish
  • Fix timestamps field
  • Files watched updates & watch mode fix
  • Typography updates and fixes
  • Graphql fixes on writables attributes

Breaking Changes (from previous betas)

This beta introduces the new factories for core CRUD features.

You will need to update:

Statistics:

File Changed271
Line Additions5,054
Line Deletions4,126
Line Changes9,180
Total Commits111

User Affected:

  • Must update routes, controllers, and services to match the new factory pattern
  • Need to ensure files physically exist for controllers and services
  • Benefit from improved GraphQL handling for writable attributes
  • Experience more reliable file watching in development mode

Contributors:

alexandrebodinronronscelestessoupettevincentbproConvlyHichamELBSI