search

glpi-project / glpi

GLPI is a Free Asset and IT Management Software package, Data center management, ITIL Service Desk, licenses tracking and software auditing.
https://glpi-project.org
GNU General Public License v3.0
4.01k stars 1.26k forks source link

[GLPI 10] Long location in tooltips can crop user photos #13880

Open AKorezin opened 1 year ago

AKorezin commented 1 year ago

Code of Conduct

Is there an existing issue for this?

Version

10.0.6

Bug description

If the user tooltip in the ticket contains a field of a specific length, then the user photo may become cropped horizontally. In some cases, it may become a tiny vertical strip 6 pixels wide.

Here's a screenshot with a tooltip. The image with user avatar cropped by long location string.

Page URL

/front/ticket.form.php

Steps To reproduce

  1. Install clean glpi.
  2. Login as glpi:glpi.
  3. Go to Administration > Users.
  4. Open the profile of user glpi.
  5. Add a new location to the profile. The location name should contain about 71 | symbols.
  6. Create and open a new issue with user glpi.
  7. In the top row of the message, hover the cursor over the glpi name to display the tooltip.
  8. You will see that the location is displayed in one line and the cropped photo of the user.

Your GLPI setup information

Information about system installation and configuration 
GLPI 10.0.6 ( => /var/www/html)
Installation mode: TARBALL
Current language:en_GB
Server 
 
Operating system: Linux 827b5848d937 6.1.7-arch1-1 #1 SMP PREEMPT_DYNAMIC Wed, 18 Jan 2023 19:54:38 +0000 x86_64
PHP 8.1.14 apache2handler (Core, PDO, Phar, Reflection, SPL, SimpleXML, Zend OPcache, apache2handler, bz2, ctype, curl, date,
    dom, exif, fileinfo, filter, ftp, gd, hash, iconv, igbinary, intl, json, ldap, libxml, mbstring, memcached, mysqli, mysqlnd,
    openssl, pcntl, pcre, pdo_sqlite, posix, session, sodium, sqlite3, standard, tokenizer, xml, xmlreader, xmlwriter, zip, zlib)
Setup: max_execution_time="600" memory_limit="64M" post_max_size="8M" safe_mode="" session.save_handler="memcached"
    upload_max_filesize="2M" 
Software: Apache ()
    Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36
Server Software: mariadb.org binary distribution
    Server Version: 10.7.7-MariaDB-1:10.7.7+maria~ubu2004
    Server SQL Mode: STRICT_TRANS_TABLES,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION
    Parameters: glpi@mariadb/glpi
    Host info: mariadb via TCP/IP

PHP version (8.1.14) is supported.
Sessions configuration is OK.
Allocated memory is sufficient.
mysqli extension is installed.
Following extensions are installed: dom, fileinfo, json, simplexml.
curl extension is installed.
gd extension is installed.
intl extension is installed.
libxml extension is installed.
zlib extension is installed.
The constant SODIUM_CRYPTO_AEAD_XCHACHA20POLY1305_IETF_NPUBBYTES is present.
Database engine version (10.7.7) is supported.
No files from previous GLPI version detected.
Write access to /var/www/html/files/_cache has been validated.
Write access to /var/www/html/config has been validated.
Write access to /var/www/html/files/_cron has been validated.
Write access to /var/www/html/files has been validated.
Write access to /var/www/html/files/_dumps has been validated.
Write access to /var/www/html/files/_graphs has been validated.
Write access to /var/www/html/files/_lock has been validated.
Write access to /var/www/html/files/_pictures has been validated.
Write access to /var/www/html/files/_plugins has been validated.
Write access to /var/www/html/files/_rss has been validated.
Write access to /var/www/html/files/_sessions has been validated.
Write access to /var/www/html/files/_tmp has been validated.
Write access to /var/www/html/files/_uploads has been validated.
The following directories should be placed outside "/var/www/html":
‣ "/var/www/html/files" ("GLPI_VAR_DIR")
‣ "/var/www/html/config" ("GLPI_CONFIG_DIR")
You can ignore this suggestion if you are certain that these directories are not accessible through your web server.
Sessions configuration is secured.
exif extension is installed.
ldap extension is installed.
openssl extension is installed.
zip extension is installed.
bz2 extension is installed.
Zend OPcache extension is installed.
Following extensions are installed: ctype, iconv, mbstring, sodium.
Write access to /var/www/html/marketplace has been validated.
Timezones seems loaded in database.
GLPI constants 
 
GLPI_ROOT: "/var/www/html"
GLPI_CONFIG_DIR: "/var/www/html/config"
GLPI_VAR_DIR: "/var/www/html/files"
GLPI_MARKETPLACE_DIR: "/var/www/html/marketplace"
GLPI_USE_CSRF_CHECK: "1"
GLPI_CSRF_EXPIRES: "7200"
GLPI_CSRF_MAX_TOKENS: "100"
GLPI_USE_IDOR_CHECK: "1"
GLPI_IDOR_EXPIRES: "7200"
GLPI_ALLOW_IFRAME_IN_RICH_TEXT: false
GLPI_SERVERSIDE_URL_ALLOWLIST: ["/^(https?|feed):\\/\\/[^@:]+(\\/.*)?$/"]
GLPI_TELEMETRY_URI: "https://telemetry.glpi-project.org"
GLPI_INSTALL_MODE: "TARBALL"
GLPI_NETWORK_MAIL: "glpi@teclib.com"
GLPI_NETWORK_SERVICES: "https://services.glpi-network.com"
GLPI_MARKETPLACE_ALLOW_OVERRIDE: true
GLPI_MARKETPLACE_MANUAL_DOWNLOADS: true
GLPI_USER_AGENT_EXTRA_COMMENTS: ""
GLPI_DISABLE_ONLY_FULL_GROUP_BY_SQL_MODE: "1"
GLPI_AJAX_DASHBOARD: "1"
GLPI_CALDAV_IMPORT_STATE: 0
GLPI_DEMO_MODE: "0"
GLPI_CENTRAL_WARNINGS: "1"
GLPI_DOC_DIR: "/var/www/html/files"
GLPI_CACHE_DIR: "/var/www/html/files/_cache"
GLPI_CRON_DIR: "/var/www/html/files/_cron"
GLPI_DUMP_DIR: "/var/www/html/files/_dumps"
GLPI_GRAPH_DIR: "/var/www/html/files/_graphs"
GLPI_LOCAL_I18N_DIR: "/var/www/html/files/_locales"
GLPI_LOCK_DIR: "/var/www/html/files/_lock"
GLPI_LOG_DIR: "/var/www/html/files/_log"
GLPI_PICTURE_DIR: "/var/www/html/files/_pictures"
GLPI_PLUGIN_DOC_DIR: "/var/www/html/files/_plugins"
GLPI_RSS_DIR: "/var/www/html/files/_rss"
GLPI_SESSION_DIR: "/var/www/html/files/_sessions"
GLPI_TMP_DIR: "/var/www/html/files/_tmp"
GLPI_UPLOAD_DIR: "/var/www/html/files/_uploads"
GLPI_INVENTORY_DIR: "/var/www/html/files/_inventories"
GLPI_NETWORK_REGISTRATION_API_URL: "https://services.glpi-network.com/api/registration/"
GLPI_MARKETPLACE_PLUGINS_API_URI: "https://services.glpi-network.com/api/glpi-plugins/"
GLPI_I18N_DIR: "/var/www/html/locales"
GLPI_VERSION: "10.0.6"
GLPI_SCHEMA_VERSION: "10.0.6"
GLPI_MARKETPLACE_PRERELEASES: false
GLPI_MIN_PHP: "7.4.0"
GLPI_MAX_PHP: "8.3.0"
GLPI_YEAR: "2023"
Libraries 
 
htmlawed/htmlawed version 1.2.9 in (/var/www/html/vendor/htmlawed/htmlawed)
phpmailer/phpmailer version 6.6.0 in (/var/www/html/vendor/phpmailer/phpmailer/src)
simplepie/simplepie version 1.5.8 in (/var/www/html/vendor/simplepie/simplepie/library)
tecnickcom/tcpdf version 6.6.2 in (/var/www/html/vendor/tecnickcom/tcpdf)
michelf/php-markdown in (/var/www/html/vendor/michelf/php-markdown/Michelf)
true/punycode in (/var/www/html/vendor/true/punycode/src)
iamcal/lib_autolink in (/var/www/html/vendor/iamcal/lib_autolink)
sabre/dav in (/var/www/html/vendor/sabre/dav/lib/DAV)
sabre/http in (/var/www/html/vendor/sabre/http/lib)
sabre/uri in (/var/www/html/vendor/sabre/uri/lib)
sabre/vobject in (/var/www/html/vendor/sabre/vobject/lib)
laminas/laminas-i18n in (/var/www/html/vendor/laminas/laminas-i18n/src)
laminas/laminas-servicemanager in (/var/www/html/vendor/laminas/laminas-servicemanager/src)
monolog/monolog in (/var/www/html/vendor/monolog/monolog/src/Monolog)
sebastian/diff in (/var/www/html/vendor/sebastian/diff/src)
donatj/phpuseragentparser in (/var/www/html/vendor/donatj/phpuseragentparser/src/UserAgent)
elvanto/litemoji in (/var/www/html/vendor/elvanto/litemoji/src)
symfony/console in (/var/www/html/vendor/symfony/console)
scssphp/scssphp in (/var/www/html/vendor/scssphp/scssphp/src)
laminas/laminas-mail in (/var/www/html/vendor/laminas/laminas-mail/src/Protocol)
laminas/laminas-mime in (/var/www/html/vendor/laminas/laminas-mime/src)
rlanvin/php-rrule in (/var/www/html/vendor/rlanvin/php-rrule/src)
blueimp/jquery-file-upload in (/var/www/html/vendor/blueimp/jquery-file-upload/server/php)
ramsey/uuid in (/var/www/html/vendor/ramsey/uuid/src)
psr/log in (/var/www/html/vendor/psr/log/Psr/Log)
psr/simple-cache in (/var/www/html/vendor/psr/simple-cache/src)
psr/cache in (/var/www/html/vendor/psr/cache/src)
league/csv in (/var/www/html/vendor/league/csv/src)
mexitek/phpcolors in (/var/www/html/vendor/mexitek/phpcolors/src/Mexitek/PHPColors)
guzzlehttp/guzzle in (/var/www/html/vendor/guzzlehttp/guzzle/src)
guzzlehttp/psr7 in (/var/www/html/vendor/guzzlehttp/psr7/src)
glpi-project/inventory_format in (/var/www/html/vendor/glpi-project/inventory_format/lib/php)
wapmorgan/unified-archive in (/var/www/html/vendor/wapmorgan/unified-archive/src)
paragonie/sodium_compat in (/var/www/html/vendor/paragonie/sodium_compat/src)
symfony/cache in (/var/www/html/vendor/symfony/cache)
html2text/html2text in (/var/www/html/vendor/html2text/html2text/src)
symfony/css-selector in (/var/www/html/vendor/symfony/css-selector)
symfony/dom-crawler in (/var/www/html/vendor/symfony/dom-crawler)
twig/twig in (/var/www/html/vendor/twig/twig/src)
twig/string-extra in (/var/www/html/vendor/twig/string-extra)
symfony/polyfill-ctype not found
symfony/polyfill-iconv not found
symfony/polyfill-mbstring not found
symfony/polyfill-php80 not found
symfony/polyfill-php81 not found
symfony/polyfill-php82 in (/var/www/html/vendor/symfony/polyfill-php82)
SQL replicas 
 
Not active
Notifications 
 
Way of sending emails: PHP
Plugins list 
 

Anything else?

No response

trasher commented 1 year ago

About 70 characters with no space, this sounds like an illegitimate case. Anyways, I'm not able to reproduce with current nightly build; looks like this has been fixed.

AKorezin commented 1 year ago

About 70 characters with no space, this sounds like an illegitimate case.

Just a test case. Spaces are not the problem here.

I tried 10.0-75cbfb6 nightly build and can reproduce the issue. Here are some screenshots. 1 2

trasher commented 1 year ago

Since I'm not able to reproduce, I cannot fix. I let someone else try.

trasher commented 1 year ago

image

cedric-anne commented 1 year ago

When I hover the ticket header, I have this tooltip: image

On what page have you this issue?

AKorezin commented 1 year ago

These examples are absolutely correct, yet in some cases, the tooltip will be broken. It depends on the length of the location or other fields. Even a long but valid email without spaces will cause the problem. 4

This is the screenshot from the production environment. 3

cedric-anne commented 1 year ago

What is your browser?

AKorezin commented 1 year ago

Chromium 111. Also I'm able to reproduce it in firefox 110.

AKorezin commented 1 year ago

Let me refine the reproduction guide

  1. Install clean glpi.
  2. Get ubuntu:22.04 desktop livecd.
  3. Run livecd in try it mode. Maybe change the resolution. 1440x900 works for me.
  4. Use firefox.
  5. Login as glpi:glpi.
  6. Create and open a new issue.
  7. In separate tab open Administration > Users.
  8. Open the profile of user glpi.
  9. Set email by adding one letter at a time and save the profile. I get the result with abcdefghijklmnopqrstuvwxyz@abcdefghijklm.
  10. After each save, reload the issue tab and check the tooltip. In the top row of the message, hover the cursor over the glpi name to display the tooltip. You will see that the location is displayed in one line and the cropped photo of the user.

1 3

cconard96 commented 1 year ago

I am also not able to recreate this issue. Selection_138

Tested with 10.0.6, 10.0.7, and a recent 10.0 bugfix commit on FIrefox and Chrome and tried different screen sizes.

AKorezin commented 1 year ago

Hello @cconard96.

The email you specified looks too long. Can you try removing some letters? It seems to me the ideal number of letters to remove in your case will be from 10 to 20. The email should be short enough to be displayed in one line but long enough for the user's photo to collapse.

Also, the location is not necessary. Can you remove it? And set an image as a user photo. This will make reproduction easier, I think.

github-actions[bot] commented 1 year ago

There has been no activity on this issue for some time and therefore it is considered stale and will be closed automatically in 10 days.

If this issue is related to a bug, please try to reproduce on latest release. If the problem persist, feel free to add a comment to revive this issue. If it is related to a new feature, please open a topic to discuss with community about this enhancement on suggestion website.

You may also consider taking a subscription to get professionnal support or contact GLPI editor team directly.

AKorezin commented 1 year ago

Reproduced, d36ca78

brusilva84 commented 11 months ago

can confirm this happens with edge browser too

github-actions[bot] commented 9 months ago

There has been no activity on this issue for some time and therefore it is considered stale and will be closed automatically in 10 days.

If this issue is related to a bug, please try to reproduce on latest release. If the problem persist, feel free to add a comment to revive this issue. If it is related to a new feature, please open a topic to discuss with community about this enhancement on suggestion website.

You may also consider taking a subscription to get professionnal support or contact GLPI editor team directly.

AKorezin commented 9 months ago

Reproduced, 8f8851f

github-actions[bot] commented 6 months ago

There has been no activity on this issue for some time and therefore it is considered stale and will be closed automatically in 10 days.

If this issue is related to a bug, please try to reproduce on latest release. If the problem persist, feel free to add a comment to revive this issue. If it is related to a new feature, please open a topic to discuss with community about this enhancement on suggestion website.

You may also consider taking a subscription to get professionnal support or contact GLPI editor team directly.

AKorezin commented 6 months ago

Reproduced, c04505d

github-actions[bot] commented 4 months ago

There has been no activity on this issue for some time and therefore it is considered stale and will be closed automatically in 10 days.

If this issue is related to a bug, please try to reproduce on latest release. If the problem persist, feel free to add a comment to revive this issue. If it is related to a new feature, please open a topic to discuss with community about this enhancement on suggestion website.

You may also consider taking a subscription to get professionnal support or contact GLPI editor team directly.

AKorezin commented 4 months ago

Reproduced, 99e26dc, d4c9e5e

github-actions[bot] commented 2 months ago

There has been no activity on this issue for some time and therefore it is considered stale and will be closed automatically in 10 days.

If this issue is related to a bug, please try to reproduce on latest release. If the problem persist, feel free to add a comment to revive this issue. If it is related to a new feature, please open a topic to discuss with community about this enhancement on suggestion website.

You may also consider taking a subscription to get professionnal support or contact GLPI editor team directly.

AKorezin commented 2 months ago

Reproduced, ddd2d58, 4e2d5f8

github-actions[bot] commented 2 weeks ago

There has been no activity on this issue for some time and therefore it is considered stale and will be closed automatically in 10 days.

If this issue is related to a bug, please try to reproduce on latest release. If the problem persist, feel free to add a comment to revive this issue. If it is related to a new feature, please open a topic to discuss with community about this enhancement on suggestion website.

You may also consider taking a subscription to get professionnal support or contact GLPI editor team directly.

AKorezin commented 2 weeks ago

Reproduced, aa4ad2c, 472bbb4