simple-local-avatars
simple-local-avatars copied to clipboard
10up
Crop area does not appear sometimes.
Describe the bug
The avatar crop feature was recently introduced in #83. It is noted that the crop area does not appear sometimes. Also noticed the behavior - when changing a window size slightly, the crop area appears!
Steps to Reproduce
- Upload a wide image and keep the window size narrow or vice versa.
- Try to select and crop the image.
- The crop area does not appear.
- Slightly change the window size.
- Crop are appears.
- Check the below video.
Screenshots, screen recording, code snippet
https://www.screencast.com/t/PhQmfpPL7dO7
Environment information
version: 5.9.1 site_language: en_US user_language: en_US timezone: Asia/Kolkata permalink: /%postname%/ https_status: true multisite: false user_registration: 0 blog_public: 1 default_comment_status: open environment_type: local user_count: 11 dotorg_communication: true
wp-paths-sizes
wordpress_path: /Users/faisalalvi/LocalSites/wpne/app/public wordpress_size: 43.74 MB (45862139 bytes) uploads_path: /Users/faisalalvi/LocalSites/wpne/app/public/wp-content/uploads uploads_size: 6.46 MB (6776453 bytes) themes_path: /Users/faisalalvi/LocalSites/wpne/app/public/wp-content/themes themes_size: 6.47 MB (6780262 bytes) plugins_path: /Users/faisalalvi/LocalSites/wpne/app/public/wp-content/plugins plugins_size: 2.91 GB (3122292916 bytes) database_size: 47.20 MB (49496064 bytes) total_size: 3.01 GB (3231207834 bytes)
wp-active-theme
name: Twenty Twenty-One (twentytwentyone) version: 1.4 (latest version: 1.5) author: the WordPress team author_website: https://wordpress.org/ parent_theme: none theme_features: core-block-patterns, wc-product-gallery-zoom, wc-product-gallery-lightbox, wc-product-gallery-slider, woocommerce, widgets-block-editor, post-thumbnails, automatic-feed-links, title-tag, post-formats, menus, html5, custom-logo, customize-selective-refresh-widgets, wp-block-styles, align-wide, editor-styles, editor-style, editor-font-sizes, custom-background, editor-color-palette, editor-gradient-presets, responsive-embeds, custom-line-height, experimental-link-color, custom-spacing, custom-units, widgets theme_path: /Users/faisalalvi/LocalSites/wpne/app/public/wp-content/themes/twentytwentyone auto_update: Disabled
wp-themes-inactive (10)
Newspack Joseph: version: 1.0.0-alpha.33, author: Automattic, Auto-updates disabled Newspack Katharine: version: 1.0.0-alpha.33, author: Automattic, Auto-updates disabled Newspack Nelson: version: 1.0.0-alpha.33, author: Automattic, Auto-updates disabled Newspack Sacha: version: 1.0.0-alpha.33, author: Automattic, Auto-updates disabled Newspack Scott: version: 1.0.0-alpha.33, author: Automattic, Auto-updates disabled Newspack: version: 1.53.2, author: Automattic, Auto-updates disabled Storefront: version: 3.9.1, author: Automattic, Auto-updates disabled Twenty Nineteen: version: 2.1, author: the WordPress team (latest version: 2.2), Auto-updates disabled Twenty Twenty: version: 1.8, author: the WordPress team (latest version: 1.9), Auto-updates disabled Twenty Twenty-Two: version: 1.0, author: the WordPress team (latest version: 1.1), Auto-updates disabled
wp-mu-plugins (1)
ngrok.php: author: (undefined), version: (undefined)
wp-plugins-active (4)
10up Block Library: version: 1.0.1, author: 10up, Auto-updates disabled Simple Local Avatars: version: 2.2.0, author: Jake Goldman, 10up, Auto-updates disabled WooCommerce: version: 5.9.0, author: Automattic (latest version: 6.2.1), Auto-updates disabled WooCommerce Bookings: version: 1.15.52, author: WooCommerce, Auto-updates disabled
wp-plugins-inactive (40)
Accessibility CheckUp: version: 1.2.0, author: 10up, Auto-updates disabled Ads.txt Manager: version: 1.3.0, author: 10up, Auto-updates disabled AMP: version: 2.1.4, author: AMP Project Contributors (latest version: 2.2.1), Auto-updates disabled Block for Apple Maps: version: 1.0.1, author: 10up (latest version: 1.0.2), Auto-updates disabled Bookings Generator: version: 1.0.0, author: WooCommerce, Auto-updates disabled Bookings Helper: version: 1.0.3, author: WooCommerce, Auto-updates disabled Distributor: version: 1.6.7, author: 10up Inc., Auto-updates disabled Dokan: version: 3.3.2, author: weDevs (latest version: 3.3.9), Auto-updates disabled Jetpack: version: 10.3, author: Automattic (latest version: 10.6), Auto-updates disabled Members: version: 3.1.7, author: MemberPress, Auto-updates disabled Newspack: version: 1.67.0-alpha.2, author: Automattic, Auto-updates disabled Newspack Blocks: version: 1.42.1, author: Automattic, Auto-updates disabled Newspack Newsletters: version: 1.36.1, author: Automattic (latest version: 1.41.0), Auto-updates disabled ProfilePress: version: 3.2.8, author: ProfilePress Team, Auto-updates disabled Publisher Media Kit: version: 1.0.0, author: 10up, Auto-updates disabled PWA: version: 0.6.0, author: PWA Plugin Contributors, Auto-updates disabled Query Monitor: version: 3.7.1, author: John Blackbourn (latest version: 3.8.2), Auto-updates disabled Repeat Order for Woocommerce: version: 1.2.0, author: polyres, Auto-updates disabled Restricted Site Access: version: 7.2.0, author: Jake Goldman, 10up, Oomph (latest version: 7.3.0), Auto-updates disabled Simple Podcasting: version: 1.2.0, author: 10up (latest version: 1.2.1), Auto-updates disabled Site Kit by Google: version: 1.45.0, author: Google (latest version: 1.69.0), Auto-updates disabled User Switching: version: 1.5.8, author: John Blackbourn & contributors, Auto-updates disabled W3 Total Cache: version: 2.1.9, author: BoldGrid (latest version: 2.2.1), Auto-updates disabled WooCommerce Accommodation Bookings: version: 1.1.26, author: WooCommerce, Auto-updates disabled WooCommerce Amazon Pay: version: 2.1.1, author: WooCommerce, Auto-updates disabled WooCommerce Blocks: version: 7.1.0-dev, author: Automattic, Auto-updates disabled WooCommerce Bookings Availability: version: 1.1.19, author: WooCommerce, Auto-updates disabled WooCommerce Deposits: version: 1.5.8, author: WooCommerce, Auto-updates disabled WooCommerce EU VAT Number: version: 2.4.1, author: WooCommerce, Auto-updates disabled WooCommerce Memberships: version: 1.22.1, author: SkyVerge, Auto-updates disabled WooCommerce Multi-currency: version: 2.14.3, author: TIV.NET INC, Auto-updates disabled WooCommerce Pre-Orders: version: 1.6.0, author: WooCommerce, Auto-updates disabled WooCommerce Product Add-ons: version: 4.7.0, author: WooCommerce, Auto-updates disabled WooCommerce Product Vendors: version: 2.1.58, author: WooCommerce, Auto-updates disabled WooCommerce Square: version: 2.9.0, author: WooCommerce, Auto-updates disabled WooCommerce Stripe Gateway: version: 6.1.0, author: WooCommerce (latest version: 6.2.0), Auto-updates disabled WooCommerce Xero Integration: version: 1.7.41, author: WooCommerce, Auto-updates disabled WP Crontrol: version: 1.12.0, author: John Blackbourn & crontributors, Auto-updates disabled XT Quick View for WooCommerce: version: 1.9.4, author: XplodedThemes (latest version: 1.9.5), Auto-updates disabled Yoast SEO: version: 17.6, author: Team Yoast (latest version: 18.2), Auto-updates disabled
wp-media
image_editor: WP_Image_Editor_GD imagick_module_version: Not available imagemagick_version: Not available imagick_version: Not available file_uploads: File uploads is turned off post_max_size: 1000M upload_max_filesize: 300M max_effective_size: 300 MB max_file_uploads: 20 gd_version: bundled (2.1.0 compatible) gd_formats: GIF, JPEG, PNG, BMP ghostscript_version: not available
wp-server
server_architecture: Darwin 21.3.0 x86_64 httpd_software: nginx/1.16.0 php_version: 7.3.5 64bit php_sapi: fpm-fcgi max_input_variables: 4000 time_limit: 1200 memory_limit: 256M max_input_time: 600 upload_max_filesize: 300M php_post_max_size: 1000M curl_version: 7.77.0 (SecureTransport) LibreSSL/2.8.3 suhosin: false imagick_availability: false pretty_permalinks: true htaccess_extra_rules: false
wp-database
extension: mysqli server_version: 8.0.16 client_version: mysqlnd 5.0.12-dev - 20150407 - $Id: 7cc7cc96e675f6d72e5cf0f267f48e167c2abb23 $ max_allowed_packet: 16777216 max_connections: 151
wp-constants
WP_HOME: undefined WP_SITEURL: undefined WP_CONTENT_DIR: /Users/faisalalvi/LocalSites/wpne/app/public/wp-content WP_PLUGIN_DIR: /Users/faisalalvi/LocalSites/wpne/app/public/wp-content/plugins WP_MEMORY_LIMIT: 40M WP_MAX_MEMORY_LIMIT: 256M WP_DEBUG: true WP_DEBUG_DISPLAY: true WP_DEBUG_LOG: false SCRIPT_DEBUG: true WP_CACHE: false CONCATENATE_SCRIPTS: undefined COMPRESS_SCRIPTS: undefined COMPRESS_CSS: undefined WP_ENVIRONMENT_TYPE: local DB_CHARSET: utf8 DB_COLLATE: undefined
wp-filesystem
wordpress: writable wp-content: writable uploads: writable plugins: writable themes: writable mu-plugins: writable
`
WordPress information
No response
Code of Conduct
- [X] I agree to follow this project's Code of Conduct
Hey, @faisal-alvi @jeffpaul, It looks like an issue with the WordPress crop feature itself, I tried updating the site icon in the customizer panel, and I see the same problem happening here too.
If I try to use a larger image in a smaller window size, the crop screen doesn't appear, and once I resize the window, the crop screen appears again.
SS - https://share.getcloudapp.com/8LuD4LWm
Could you please try testing it at your end and let me know if it breaks at your end, too? If that's the case, I might need to open an issue in the WordPress Trac.
Dimensions I faced an issue with.
Image size - 2560 by 1707 pixels Screen Size - 780 by 550 pixels
@ajmaurya99 thanks for the report. I have tested it as per your instructions and the crop issue is occurring in the customizer too.
@jeffpaul can you please follow up on the core ticket so this gets resolved sooner?
@jeffpaul Site Logo block does not offer a crop feature inside the media library popup. It simply allows to choose an image, and the crop is performed like this:
Interesting that the Site Logo block does provide options to crop to a square and other aspect ratios. We don't need to get too fancy in handling this in the media library popup, but even a basic option to crop as square or freeform will probably suffice?
@jeffpaul Yes, we should provide (initially) 2 options: square and freeform. @cadic has already provided a suggestion on it in https://github.com/10up/simple-local-avatars/pull/130#issuecomment-1133242447, I will look into it. However, we need a design discussion, once I check the feasibility.
Created a separate ticket #131 to discuss this.