FSE Git Workflow

Git workflows, Conventional Commits, Husky pre-commit hooks, and CI/CD for the Oh My Brand! FSE theme.

When to Use

• Making commits to the repository
• Creating feature branches
• Fixing pre-commit linting failures
• Understanding CI/CD pipeline requirements
• Creating pull requests
• Releasing new versions

Reference Files

Development Workflow

Initial Setup

# Clone and install
git clone git@github.com:WesleySmits/oh-my-brand-wp-fse.git
cd oh-my-brand-wp-fse
pnpm install && composer install
pnpm run prepare

# Verify
pnpm run lint && pnpm test && composer test

Daily Flow

# 1. Start from main
git checkout main && git pull origin main

# 2. Create feature branch
git checkout -b feature/gallery-lightbox

# 3. Develop with watch mode
pnpm run watch

# 4. Lint and test before commit
pnpm run lint:fix && pnpm test && composer test

# 5. Commit (triggers hooks)
git commit -m "feat(gallery): Add lightbox functionality"

# 6. Push and create PR
git push -u origin feature/gallery-lightbox

Environment Commands

pnpm run build

pnpm run watch

pnpm run lint

pnpm run lint:fix

pnpm test

pnpm run test:e2e

composer test

composer lint:fix

Conventional Commits

Format

<type>(<scope>): <subject>

[optional body]

[optional footer(s)]

Commit Types

feat

feat(gallery): Add zoom functionality

fix

fix(faq): Resolve accordion collapse issue

docs

docs(readme): Update installation steps

style

style(css): Fix BEM class indentation

refactor

refactor(carousel): Simplify state

perf

perf(images): Implement lazy loading

test

test(gallery): Add navigation tests

build

build(vite): Upgrade to version 6.1

ci

ci(github): Add e2e job

chore

chore(deps): Update dependencies

Scopes

blocks

gallery

faq

hero

theme

assets

deps

ci

Subject Rules

Branch Naming

Format

<type>/<description>

feature/

feature/gallery-lightbox

fix/

fix/carousel-navigation

docs/

docs/update-readme

refactor/

refactor/optimize-helpers

test/

test/add-faq-tests

chore/

chore/update-dependencies

Git Hooks (Husky)

Hook: pre-commit

Runs

lint-staged

• ESLint for

  *.ts

  ,

  *.js

  ,

  *.tsx

  ,

  *.jsx

• Stylelint for

  *.css

• PHPCS for

  *.php

• Prettier for formatting

Hook: commit-msg

Validates commit message format with commitlint.

What Happens When You Commit

1. pre-commit runs lint-staged on staged files
2. commit-msg validates message format
3. ✅ All pass → Commit succeeds
4. ❌ Any fail → Commit aborted, fix errors and retry

Reinstall Hooks

rm -rf .husky/_
pnpm run prepare

Pre-Commit Checklist

• pnpm run lint

  passes

• pnpm run lint:fix

  applied

• pnpm test

  passes

• composer test

  passes
• Commit message follows Conventional Commits
• Branch is up-to-date with

  main

Pull Request Process

1. Push branch to remote
2. Create PR on GitHub from feature branch to

   main

3. Fill template (see PULL_REQUEST_TEMPLATE.md)
4. CI runs - all checks must pass
5. Request review from maintainer
6. Squash merge to main after approval

PR Best Practices

CI/CD Pipeline

Pipeline Jobs

See ci.yml for the full workflow.

commitlint

lint-js

lint-php

test-unit-js

test-unit-php

test-e2e

build

Required Status Checks

All checks must pass before merging:

• ✅ commitlint
• ✅ lint-js
• ✅ lint-php
• ✅ test-unit-js
• ✅ test-unit-php
• ✅ test-e2e
• ✅ build

Release Process

Semantic Versioning

MAJOR.MINOR.PATCH

MAJOR → Breaking changes
MINOR → New features (backward compatible)
PATCH → Bug fixes (backward compatible)

Creating a Release

# 1. Ensure main is up to date
git checkout main && git pull origin main

# 2. Update version in: style.css, package.json, functions.php

# 3. Update CHANGELOG.md

# 4. Commit version bump
git commit -m "chore(release): Bump version to 1.2.0"

# 5. Create and push tag
git tag -a v1.2.0 -m "Release version 1.2.0"
git push origin main --tags

# 6. Create GitHub release

Troubleshooting

Commit Message Errors

"type must be one of..."

# ❌ Wrong
git commit -m "added new button block"

# ✅ Correct
git commit -m "feat(blocks): Add new button block"

"subject must be sentence-case"

# ❌ Wrong
git commit -m "feat(gallery): add lightbox"

# ✅ Correct
git commit -m "feat(gallery): Add lightbox"

Lint Errors

# Fix all linting issues
pnpm run lint:fix

# Fix PHP issues
composer lint:fix

# Stage fixes and retry
git add . && git commit -m "feat(blocks): Add feature"

Git Hook Issues

# Reinstall hooks
rm -rf .husky/_
pnpm run prepare

Bypass Hooks (Emergency Only)

git commit -m "fix(urgent): Emergency fix" --no-verify
# Note: CI will still run all checks

Related Skills

• vitest-testing - JS testing
• phpunit-testing - PHP testing
• playwright-testing - E2E testing

References

• Conventional Commits Specification
• Commitlint Documentation
• Husky Documentation
• Semantic Versioning