Automattic / Automattic/crowdsignal-forms

v1.5.13 conflicts with Jetpack, WordPress.com, and Nav Unification styles

Open
#206 0 comments 1 reaction 0 assignees View on GitHub
bug
Dominant language
PHP
Stars
15
Forks
10
Avg merge
13m
Merged PRs (30d)
1

Description

### Overview

v1.5.13 makes various admin style changes and setup page additions that cause conflicts with WordPress.com Business and eCommerce plan sites using the more advanced hosted platform.

Specifically, it conflicts with the Nav Unification feature provided by WordPress.com, Jetpack, and Jetpack's masterbar.

The update also includes CSS that modifies various Jetpack elements and might be impacting more than what is described here. It seems the enqueued and admin styles are overriding multiple things unexpectedly.

An A8C internal discussion of the issue is available at p1640288404088600/1640219235.018300-slack-CB0B2G43X and p9o2xV-1KI-p2

### WordPress.com Nav Unification Conflict

v1.5.13 is enqueuing common.min.css : https://github.com/Automattic/crowdsignal-forms/blob/251761efbe0c610c9c58f21e7b8a1[…]d2e8289d8e9/includes/admin/class-crowdsignal-forms-settings.php

This overrides the `margin-left` we're setting on #wpcontent, #wpfooter for nav unification via Jetpack. https://github.com/Automattic/jetpack/blob/9288ce25f63a05f81fe1629e6cc7734e7313f23[…]cts/plugins/jetpack/modules/masterbar/admin-menu/admin-menu.css

Which leads to the WP sidebar to overlap WP-Admin pages.
![Screen Shot on 2021-12-23 at 15:51:34](https://user-images.githubusercontent.com/4887830/147290474-f0f302dc-0e5c-4012-9638-b56edea16a51.png)

### Admin Styles

v1.5.13's admin-styles.css changes lead to certain Jetpack admin elements to have their fonts and other styles override.

For example, the styles set for `.dops-card h3` lead to font changes within Jetpack's dashboard.

![Screen Shot on 2021-12-23 at 15_31_50](https://user-images.githubusercontent.com/4887830/147290407-f8490f4b-e717-4bc9-9c71-f0cf398836ba.png)

#### Reproducing

1. Create a WordPress.com on Atomic developer blog.
2. Update `crowdsignal-forms` to v1.5.13.
3. Navigate to the Jetpack dashboard and other WP-Admin pages.

Contributor guide

No contributing guide indexed for this repository

Research direction

Inspect the enqueue logic in includes/admin/class-crowdsignal-forms-settings.php and the admin-styles.css selectors, then reproduce the conflict on a WordPress.com Atomic site with Jetpack and Nav Unification enabled. Check the Jetpack dashboard and other WP-Admin pages for sidebar overlap and unintended font or style overrides; done means Crowdsignal styles no longer interfere with those elements.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, php
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.