Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Old Headless mode has been removed from the Chrome binary #124

Open
alex-dr opened this issue Jan 17, 2025 · 23 comments
Open

Old Headless mode has been removed from the Chrome binary #124

alex-dr opened this issue Jan 17, 2025 · 23 comments

Comments

@alex-dr
Copy link

alex-dr commented Jan 17, 2025

My Chrome updated today (Ubuntu 24.04) and now dfi.export is broken with the following error:

CalledProcessError: Command '['--enable-logging', '--disable-gpu', '--headless=old', '--crash-dumps-dir=/home/alex/.dataframe_image/tmpykuuxx_z', '--force-device-scale-factor=3.0', '--window-size=1400,900', '--hide-scrollbars', '--screenshot=/home/alex/.dataframe_image/tmpykuuxx_z/temp.png', '/home/alex/.dataframe_image/tmpykuuxx_z/temp.html']' returned non-zero exit status 1.

When using table_conversion="html2image" it works, and I also see a warning:

Old Headless mode has been removed from the Chrome binary. Please use the new Headless mode 
(https://developer.chrome.com/docs/chromium/new-headless) or the chrome-headless-shell which 
is a standalone implementation of the old Headless mode (https://developer.chrome.com/blog/chrome-headless-shell).

"chrome" also works if I provide a chrome_path pointed at the chrome-headless-shell.

@PaleNeutron
Copy link
Collaborator

PaleNeutron commented Jan 18, 2025

I have set --headless='new' but reverse this change for some reason I forget. See commit 951e99c and #115

@PaleNeutron
Copy link
Collaborator

OK, I found why we need '--headless=old', see test

def test_huge_df(document_name, converter, dpi):
df = pd.DataFrame(np.random.randint(0, 100, size=(300, 20)))
df.dfi.export(
f"tests/test_output/{document_name}.png",
table_conversion=converter,
dpi=dpi,
max_rows=-1,
)

If use new headless or html2image package, only 25 lines will be exported.

PaleNeutron added a commit that referenced this issue Jan 22, 2025
@PaleNeutron PaleNeutron marked this as a duplicate of #125 Jan 29, 2025
@PaleNeutron PaleNeutron marked this as a duplicate of #126 Jan 29, 2025
@Jacques2101
Copy link

Hi
Concerning the error message what should we do to m’y program to work fine ? Is there a corrective in the near future That will be launched ?
The

@PaleNeutron
Copy link
Collaborator

Due to Chrome completely remove old headless mode, I suggest everyone migrate to playwright mode by modify your table_conversion parameter like this:

dfi.export(df, "df_style.png", table_conversion="playwright")

Or wait for me to draft a new release which will make playwright the default choice.

@Jacques2101
Copy link

I tried dfi.export(df, "df_style.png", table_conversion="playwright")
but get an error message Error:
It looks like you are using Playwright Sync API inside the asyncio loop.
Please use the Async API instead.

@PaleNeutron
Copy link
Collaborator

I tried dfi.export(df, "df_style.png", table_conversion="playwright") but get an error message Error: It looks like you are using Playwright Sync API inside the asyncio loop. Please use the Async API instead.

If you use dfi in an async context, you can use this code instead.

    await dfi.export_async(
        df,
        f"tests/test_output/{document_name}_playwright_async.png",
        table_conversion="playwright_async",
    )

@Jacques2101
Copy link

I am not in async context. I even don't know what it is (what it is ?)...but it seems to works !
thx

@Jacques2101
Copy link

Jacques2101 commented Jan 29, 2025

One more question. It seems that I loose my layout with this new configuration. Now i have an image with black backround one row out of 2...

table_styles = [
    {"selector": "thead th",  # Style pour les en-têtes de colonnes
        "props": [
            ("background-color", "blue"),  # Fond bleu
            ("color", "white"),  # Texte en blanc
            ("font-weight", "bold"),  # Texte en gras
            ("text-align", "center")  # Centrer le texte
        ]
    },
    {"selector": "td",  # Style général pour toutes les cellules
     "props": [("border-right", "0.8px solid black")]
     },
    {"selector": "td.col0",  # Largeur spécifique pour la première colonne
     "props": [("width", "200px")]
     },
    # Appliquer une largeur spécifique à toutes les colonnes de la 2ᵉ à la dernière
    {"selector": "td:nth-child(n+2)",  # `nth-child(n+2)` cible la 2ᵉ colonne et au-delà
     "props": [("width", "70px")]
     }
]

perf_indice_stylised = (
    perf_indice
    .style
    .set_properties(**{'text-align': 'center'})  # Centrer le contenu des colonnes
    .set_table_styles(table_styles, overwrite=False)  # Appliquer les propriétés CSS
    .format(col_format, na_rep='')  # Appliquer les formats avec valeurs manquantes remplacées par ''
    .bar(align=0, vmin=-2.5, vmax=2.5, 
         height=50, width=50, cmap=custom_cmap, 
         subset=['Perf 1 sem', 'Perf 1M', 'Perf 3M', 'Perf 6M', 'Perf YTD', 'Perf 1Y', 'Perf 3Y', 'Perf 5Y'])
    .hide(axis=0)  # Masquer l'index
    )

image_path = Path(full_path) / "image.png"
await dfi.export_async(
        perf_indice_stylised,
        image_path,
        table_conversion="playwright_async",
    )

@PaleNeutron
Copy link
Collaborator

PaleNeutron commented Jan 29, 2025

@Jacques2101 lack definition of col_format and custom_cmap

I tested your code with both chrome and playwright, the looks the same.

playwright version

Image

Chrome version

Image

@Jacques2101
Copy link

col_format = {'Dernier prix': '{:.1f}',
'Perf 1 sem': '{:.1f}%',
'Perf 1M': '{:.1f}%',
'Perf 3M': '{:.1f}%',
'Perf 6M': '{:.1f}%',
'Perf YTD': '{:.1f}%',
'Perf 1Y': '{:.1f}%',
'Perf 3Y': '{:.1f}%',
'Perf 5Y': '{:.1f}%',
'Volat 3Y': '{:.1f}%',
'Max DD 3Y': '{:.1f}%',
}
from matplotlib.colors import LinearSegmentedColormap
custom_cmap = LinearSegmentedColormap.from_list("custom_cmap", ["#FFA07A" , "white", "#ADD8E6"]) # Bleu clair, blanc, rouge clair

@Jacques2101
Copy link

Jacques2101 commented Jan 29, 2025

With this code i received an

ERROR Property: Invalid value for "CSS Level 2.1" property: linear-gradient(90deg, transparent 25%, #add8e6 25%, #add8e6 50%, transparent 50%) no-repeat center [23:3: background] WARNING Property: Unknown Property name. [24:3: background-size] ERROR Property: Invalid value for "CSS Level 2.1" property: linear-gradient(90deg, transparent 4%, #ffaf8f 4%, #ffaf8f 25%, transparent 25%) no-repeat center [29:3: background] WARNING Property: Unknown Property name. [30:3: background-size] Image générée : [C:\Users\JacquesTebeka\Monceau](file:///C:/Users/JacquesTebeka/Monceau) Asset Management\Multigestion - Documents de gestion\Réunion de Gestion\20250129\tableau_styled.png

The file seems to be generated but with a wrong format

Image

`
import pandas as pd
import dataframe_image as dfi
from pptx import Presentation
from pptx.util import Inches

from matplotlib.colors import LinearSegmentedColormap
custom_cmap = LinearSegmentedColormap.from_list("custom_cmap", ["#FFA07A" , "white", "#ADD8E6"]) # Bleu clair, blanc, rouge clair

df = pd.DataFrame({
"Fonds": ["Fonds A", "Fonds B", "Fonds C"],
"Performance": [5.4, -2.1, 3.7],
"Volatilité": [12.3, 15.2, 9.8],
})

Fonction pour appliquer le style conditionnel

col_format = {'Performance': '{:.1f}%', 'Volatilité': '{:.1f}', }
table_styles = [
{"selector": "thead th", # Style pour les en-têtes de colonnes
"props": [
("background-color", "blue"), # Fond bleu
("color", "white"), # Texte en blanc
("font-weight", "bold"), # Texte en gras
("text-align", "center") # Centrer le texte
]
},
{"selector": "td", # Style général pour toutes les cellules
"props": [("border-right", "0.8px solid black")]
},
{"selector": "td.col0", # Largeur spécifique pour la première colonne
"props": [("width", "200px")]
},
# Appliquer une largeur spécifique à toutes les colonnes de la 2ᵉ à la dernière
{"selector": "td:nth-child(n+2)", # nth-child(n+2) cible la 2ᵉ colonne et au-delà
"props": [("width", "70px")]
}
]

styled_df = (df
.style
.set_properties(**{'text-align': 'center'}) # Centrer le contenu des colonnes
.set_table_styles(table_styles, overwrite=False) # Appliquer les propriétés CSS
.format(col_format, na_rep='') # Appliquer les formats avec valeurs manquantes remplacées par ''
.bar(align=0,
vmin=-2.5, vmax=2.5,
height=50, width=50,
cmap=custom_cmap,
subset=['Performance'])
.hide(axis=0) # Masquer l'index
)

from pathlib import Path
rep = Path(r"C:\Users\TTT")
png_file = rep / "tableau_styled.png"
await dfi.export_async(
styled_df,
png_file,
table_conversion="playwright_async",
)
print(f"Image générée : {png_file}")
`

@UltimateLaForsch
Copy link

UltimateLaForsch commented Jan 29, 2025

Hi,
thank you.
For me, installing 'playwright' and
dfi.export(...., table_conversion="playwright")
worked.
Thx again

@Jacques2101
Copy link

I still have this error message.

I am using Pandas 2.2.3
Could it be that ?

ERROR Property: Invalid value for "CSS Level 2.1" property: linear-gradient(90deg, transparent 25%, #add8e6 25%, #add8e6 50%, transparent 50%) no-repeat center [23:3: background]
WARNING Property: Unknown Property name. [24:3: background-size]

@PaleNeutron
Copy link
Collaborator

@Jacques2101 , You can create a notebook using colab and share it here.

@Jacques2101
Copy link

Jacques2101 commented Jan 29, 2025

https://colab.research.google.com/drive/1odS7DjvabmdWTO3_kCAvaMk3L5zD4fOX?usp=sharing

Did you have it ? Did you get the same error message ?

@haynja
Copy link

haynja commented Jan 29, 2025

I have set --headless='new' but reverse this change for some reason I forget. See commit 951e99c and #115

The change was to fix a similar kind of issue... personal view is that we should just revert the headless=old change here, such that it goes back to being just:
"--headless" in the args

I don't get an error with the latter in my config, as we did before, when this change was originally needed, although I do observe that the table is being truncated on the top-to-bottom/vertical axis.... perhaps folks can find a fix for the truncation and put it in the same release?

@PaleNeutron
Copy link
Collaborator

I have set --headless='new' but reverse this change for some reason I forget. See commit 951e99c and #115

The change was to fix a similar kind of issue... personal view is that we should just revert the headless=old change here, such that it goes back to being just: "--headless" in the args

I don't get an error with the latter in my config, as we did before, when this change was originally needed, although I do observe that the table is being truncated on the top-to-bottom/vertical axis.... perhaps folks can find a fix for the truncation and put it in the same release?

See this comment, pure --headless will lost rows below 25 of long dataframe during exporting.

@Jacques2101
Copy link

Did you see the colab file that i sent you ?
Do you have an idea where is my problem ?

thx

@PaleNeutron
Copy link
Collaborator

@Jacques2101 , Thanks for sharing test code and I have fixed bug in latest commit. You can go to colab to see if it works.

Since latest commit is not released yet, run pip install git+https://github.com/dexplo/dataframe_image in your local machine will get the fix.

@Jacques2101
Copy link

Jacques2101 commented Jan 30, 2025

I am sorry but i tried :

await dfi.export_async(
        styled_df,
        png_file,
        table_conversion="playwright_async",
    )

and i get an error message NotImplementedError

I tried also:
dfi.export(styled_df, png_file)
and get an error message Error: It looks like you are using Playwright Sync API inside the asyncio loop. Please use the Async API instead.

I also tried:
dfi.export(styled_df, png_file, table_conversion="playwright") but get an error message

Error: It looks like you are using Playwright Sync API inside the asyncio loop.
Please use the Async API instead.

@Jacques2101
Copy link

Sorry it seems that with dfi.export(styled_table, image_path, table_conversion='chrome') it works !!!

@PaleNeutron
Copy link
Collaborator

Sorry it seems that with dfi.export(styled_table, image_path, table_conversion='chrome') it works !!!

DO NOT USE table_conversion='chrome' in this version, see your colab example here:

https://colab.research.google.com/drive/1odS7DjvabmdWTO3_kCAvaMk3L5zD4fOX?usp=sharing

@Jacques2101
Copy link

Jacques2101 commented Jan 30, 2025

Ok but when i tried :
await dfi.export_async( styled_df, png_file, max_rows=-1 ) print(f"Image générée : {png_file}")

I have an error message which is NotImplementedError

But when i did
dfi.export(styled_df, png_file, table_conversion="chrome") it works fine !!!

SO WHY DO NOT USE table_conversion='chrome'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants