Skip to content

Update Electron to latest version 33.3.1 - #782

Merged
nightnei merged 8 commits into
trunkfrom
nightnei/updateElectronToLatest33v
Jan 17, 2025
Merged

Update Electron to latest version 33.3.1#782
nightnei merged 8 commits into
trunkfrom
nightnei/updateElectronToLatest33v

Conversation

@nightnei

@nightnei nightnei commented Jan 7, 2025

Copy link
Copy Markdown
Contributor

Related issues

Proposed Changes

With this PR we are updating Electron to the latest version to keep it up-to-date.

Testing Instructions

  1. Run Studio locally npm start
  2. Assert that there are no (new) errors/warning
    Screenshot 2025-01-07 at 17 16 43
  3. Open Studio
  4. Select Electron in the app's menu and then Test Render Failure (dev only)
    Screenshot 2025-01-07 at 17 28 05
  5. Assert that you still see the same expected error (here were changes in code of this PR)
    Screenshot 2025-01-07 at 17 29 27
  6. Smoke test Studio
@nightnei nightnei self-assigned this Jan 7, 2025
@nightnei
nightnei requested a review from sejas January 7, 2025 17:32

@wojtekn wojtekn left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The change looks clear, and the Studio still works fine. I've checked dev build, too, and it installs and runs correctly.

We may upgrade electron-forge at some point, too, but we will need to review issues with version format change we spotted last time we tried.

@wojtekn wojtekn changed the title chore(electron): update to latest version 33.3.1 Jan 8, 2025
@wojtekn
wojtekn self-requested a review January 8, 2025 09:48

@wojtekn wojtekn left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, it seems I can't import Jetpack backup to a Studio site anymore as I'm getting the error:

Error occurred in handler for 'importSite': TypeError: Cannot read properties of undefined (reading 'endsWith')
    at /Users/cyphelf/Sites/studio/.webpack/main/index.js:227050:58
    at Array.some (<anonymous>)
    at BackupHandlerFactory.isTarGz (/Users/cyphelf/Sites/studio/.webpack/main/index.js:227050:34)
    at BackupHandlerFactory.create (/Users/cyphelf/Sites/studio/.webpack/main/index.js:227034:23)
    at /Users/cyphelf/Sites/studio/.webpack/main/index.js:227583:81
    at Generator.next (<anonymous>)
    at fulfilled (/Users/cyphelf/Sites/studio/.webpack/main/index.js:227546:58)
@nightnei

nightnei commented Jan 8, 2025

Copy link
Copy Markdown
Contributor Author

@wojtekn

Actually, it seems I can't import Jetpack backup to a Studio site anymore as I'm getting the error:

Thank you, fixed

We may upgrade electron-forge at some point, too, but we will need to review issues with version format change we spotted last time we tried.

I can take a look at it. Do we have discussion somewhere to read and get familiar with background and previous attempts.

@wojtekn

wojtekn commented Jan 8, 2025

Copy link
Copy Markdown
Contributor

Thank you, fixed

Thanks, I will run through the whole smoke test suite.

I can take a look at it. Do we have discussion somewhere to read and get familiar with background and previous attempts.

Sounds great! See #201 for the context and feel free to open a separate issue for that.

@fredrikekelund fredrikekelund left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't have any decisive feedback on this yet. I'll take another look tomorrow, but @wojtekn might beat me to approving it.

Should we hold off with merging this until the 1.3.2 release to have some more time to test it..?

Comment thread src/menu.ts
Comment on lines +61 to +63
withMainWindow( ( window ) => {
window.webContents.send( 'test-render-failure' );
} );

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Out of curiosity, which change in Electron made it so we had to make this change?

@nightnei nightnei Jan 9, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

They replaced BrowserWindow with BaseWindow, so in this argument we don't have access to webContents anymore.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Comment thread src/hooks/use-import-export.tsx Outdated

let filePath: string;
if ( file instanceof File ) {
filePath = getIpcApi().showFilePath( file );

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Electron docs led me to believe that we can access webUtils.getPathForFile directly in this file, but that's clearly not the case when I test it…

How should we understand it when the Electron docs say Process: Renderer..? cc @Automattic/yolo

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it's mistake in documentation. After a few days of working with Electron documentation and Issues I noticed that it's not rare case of mistakes in docs.
It should not be in Renderer for sure, since the intention of webUtils.getPathForFile is to move retrieving path logic from Renderer to Preload layer.
Screenshot 2025-01-09 at 16 19 48

const importFile = useCallback(
async (
file: BackupArchiveInfo,
file: File | BackupArchiveInfo,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why did this work previously? 🤔 Because File and BackupArchiveInfo both have a path prop?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Long story short - If it walks like a duck and quacks like a duck, then it probably is a duck 😂

Will try to explain step by step, maybe it will be easier to understand:

  1. BackupArchiveInfo is name and path properties
  2. Inside of importFile we also expect only name and path
  3. So TS doesn't care which extra properties of the object we provide and what the object actualy is. Since anyway we use only these two properties.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just mean that we clearly passed a File instance to importFile previously, too (see below). It's curious that TS didn't bark at us for doing that 🤔

await importFile( fileForImport, newSite, {
showImportNotification: false,
isNewSite: true,
} );

@nightnei nightnei Jan 10, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see what you mean.
Yeah, as I mentioned before, it's about "duck typing".
File is just set of properties, so as soon as we provide all expected properties - it's enough for TS to be happy 😄
If you curious, I made a quick example for you to play with it.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Gotcha 👍 Thanks for the clarification!

@wojtekn

wojtekn commented Jan 10, 2025

Copy link
Copy Markdown
Contributor

I don't have any decisive feedback on this yet. I'll take another look tomorrow, but @wojtekn might beat me to approving it.
Should we hold off with merging this until the 1.3.2 release to have some more time to test it..?

I think we should run the whole smoke test suite on Mac and Windows before we merge.

@fredrikekelund fredrikekelund left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't encounter any issues while testing the following stuff:

  • creating a new blank site
  • creating a new site from a Studio export
  • creating a new site from a Playground export
  • importing a Studio export to an existing site
  • importing a database into an existing site
  • creating a demo site
  • pulling a site
  • pushing a site
  • chatting with Assistant
  • changing the PHP version
  • deleting a site

I left a few remarks on the code, but still approving the PR based on my smoke testing on Mac.

Per @wojtekn's latest comment, we should also run a similar test suite on Windows before merging.

Comment thread src/ipc-types.d.ts Outdated
Comment on lines +70 to +73
* webUtils.getPathForFile is available only inside preload script, that's why this one function is exception and need to be defined here manually.
*
* The nonstandard `path` property of the Web `File` object was added in an early version of Electron as a convenience method for working with native files when doing everything in the renderer was more common.
* However, it represents a deviation from the standard and poses a minor security risk as well, so beginning in Electron 32.0 it has been removed in favor of the [`webUtils.getPathForFile`](api/web-utils.md#webutilsgetpathforfilefile) method.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
* webUtils.getPathForFile is available only inside preload script, that's why this one function is exception and need to be defined here manually.
*
* The nonstandard `path` property of the Web `File` object was added in an early version of Electron as a convenience method for working with native files when doing everything in the renderer was more common.
* However, it represents a deviation from the standard and poses a minor security risk as well, so beginning in Electron 32.0 it has been removed in favor of the [`webUtils.getPathForFile`](api/web-utils.md#webutilsgetpathforfilefile) method.
* `webUtils.getPathForFile` is available only inside preload script, that's why this one
* function is exception and need to be defined here manually.
*
* See https://www.electronjs.org/docs/latest/breaking-changes#planned-breaking-api-changes-320
* for more details.

Nit, but I would shorten this and refer directly to the Electron docs.

Comment thread src/hooks/use-import-export.tsx Outdated
Comment on lines +104 to +107
let filePath: string;
if ( file instanceof File ) {
filePath = getIpcApi().showFilePath( file );
} else {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we should move this logic to src/hooks/use-add-site.ts instead? Seems reasonable that this function would consume a single format, and src/hooks/use-add-site.ts already calls the IPC API in some other places, so it wouldn't be exotic to also introduce a getIpcApi().showFilePath call

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's really reasonable idea, but it's used more than in src/hooks/use-add-site.ts. There are 6 calls of this function, and that's why I decided to keep it flexible with expecting bothFile | { path: ... }. Otherwise, it would be just copy-paste. WDYT about it?
Screenshot 2025-01-13 at 22 04 47

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think src/hooks/use-add-site.ts is the only place where we pass a File instance, though.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I double-checked - it's 2 files, not 3. Also content-tab-import-export

Comment thread src/preload.ts Outdated
ipcRenderer.invoke( 'getConnectedWpcomSites', localSiteId ),
addSyncOperation: ( id: string ) => ipcRenderer.invoke( 'addSyncOperation', id ),
clearSyncOperation: ( id: string ) => ipcRenderer.invoke( 'clearSyncOperation', id ),
showFilePath: webUtils.getPathForFile,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
showFilePath: webUtils.getPathForFile,
getPathForFile: webUtils.getPathForFile,

I don't think showFilePath is an ideal name. Something with "get" would be better, since the function is responsible for retrieving a string

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was thinking about it too, but decided to take this name, since it was somewhere in documentation, don't remember where exactly I saw it. It's hard to provide some arguments or explain my thoughts, but I will try 😅
This name is provided by creators of Electron, so maybe it will be kinda-ish following style guides for naming. I just want to believe, that they were thinking about something, when gave this name to "expose it to main world".
Totally not strong arguments, it's more about my feelings 😅 So I am ok to go with either name, just decided to explain my decision 🙂

Also, if we decided to use something else instead of showFilePath - I think it's better to chose whatever, but not getPathForFile , to simplify Command + F across our codebase, avoid confusion and simplify reading code at a glance.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if we decided to use something else instead of showFilePath - I think it's better to chose whatever, but not getPathForFile , to simplify Command + F across our codebase, avoid confusion and simplify reading code at a glance

I actually think that reusing the getPathForFile name makes sense since we are simply exposing that API without any modifications.

* chore(package.json): update electron-forge to latest version 7.6.1

* chore: space

* chore: test removing overrides for electron-packager

* chore: revert testing broken Windows
@wojtekn
wojtekn self-requested a review January 14, 2025 08:58
Comment thread src/hooks/use-import-export.tsx Outdated
Comment on lines +104 to +109
let filePath: string;
if ( file instanceof File ) {
filePath = getIpcApi().getPathForFile( file );
} else {
filePath = file.path;
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
let filePath: string;
if ( file instanceof File ) {
filePath = getIpcApi().getPathForFile( file );
} else {
filePath = file.path;
}
const filePath = file instanceof File ? getIpcApi().getPathForFile( file ) : file.path;

We could make this slightly more compact

@wojtekn

wojtekn commented Jan 16, 2025

Copy link
Copy Markdown
Contributor

@nightnei I ran a smoke test suite on Windows for this build and haven't found issues.

@nightnei
nightnei merged commit 5cb39f3 into trunk Jan 17, 2025
@nightnei
nightnei deleted the nightnei/updateElectronToLatest33v branch January 17, 2025 08:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants