Tag Archives: javascript

Darren Ethier (nerrad) 3:31 pm on November 12, 2019
Tags: javascript,   

Javascript Chat Summary – November 12, 2019

Below is a summary of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on next week’s agenda.

Switching to Prettier

Slack | Github Issue

Some discussion ensued on what is needed to merge this pull.

  • Post on make.wordpress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ regarding any code standard changes affected by this pull (and to inform about the change). This will need further feedback from coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. lead devs, core committers and contributors.
  • There are some rule removals from the es-lint pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. package, some discussion ensued about how to handle that and are those changes necessary. At a minimum, there seems to be some agreement that the ESLint rules should match the standards.

Tasks:

  • Check how many of the existing eslint rules could stay unmodified and what can be tweaked to work with Prettier and which need to be disabled. Should align with whatever standards are for the project (including any necessary modifications to those standards)
  • We should also seek a way so that the eslint plugin can continue to be used without prettier so folks can have the benefit of styling standard checks the same way as of today.
  • Once the above is done, write a post on make.wordpress.org/core outlining the changes and inviting feedback.

__experimentalCreateInterpolateElement

Slack | Github

This is a new function that makes it possible to interpolate elements within a translated string and have those rendered as reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org elements. Currently, doing something like the following can’t be done in react.

const MyLinkComponent = ( { href } ) => {
    return wp.i18n.__( 'This is a <a href={ href }>link</a>' );
};

In order to have <a> render, you’d need to split up the string, which in turn breaks context for translations. The solution is __experimentalCreateInterpolateElement:

const MyLinkComponent = ( { href } ) => {
    return __experimentalCreateInterpolateElement(
        wp.i18n.__( 'This is a <a>link</a>' ),
        { a: <a href={ href } /> }
    );
};

If you have any feedback or concerns with the proposed api please give feedback in the pull.

In the meeting:

  • generally seems to be approval around the api
  • concerns over whether the parsing should be cached.
  • wondering whether there’d be value in introducing a useInterpolation hook (that could also take care of some of the caching)
  • adding some sort of performance testing (although since it’s not used anywhere, there’s nothing currently in the project that can help with this).

Upcoming React Features

Slack

In this portion of the meeting there was mostly just some resource and link sharing around upcoming react features:

  • https://reactjs.org/docs/concurrent-mode-adoption.html
  • https://reactjs.org/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense.html
  • https://www.youtube.com/playlist?list=PLPxbbTqCLbGHPxZpw4xj_Wwg8-fdNxJRh (React Conf 2019 playlist)

#javascript, #meeting-notes

Jorge Costa 7:13 pm on November 8, 2019
Tags: , javascript,   

Javascript Chat Summary: Tuesday, November 5, 2019

Below is a of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on next week’s agenda.

Editor-specific .gitignore entries in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/

  • Context: https://github.com/WordPress/gutenberg/pull/18257#discussion_r342255694
    • Proposing to add a gitignore entry for VSCode’s “.vscode” local folder
  • Historically we’ve avoided editor-specific entries in the project’s gitignore to avoid opening pandora’s box (proliferation of ignore entries), but is this too rigid a guideline causing friction in new contributor onboarding?
  • Question: Should we allow more of these entries, and if so, which?

@gziolo said that he does not have a strong opinion on this item, but WordPress as a project is strict about it.

@mkaz also does not feels strong either way but said he would probably merge the PR because vscode its perhaps the largest and most popular editor.

@chancethedev shared his perspective as an instructor:

I often include vscode settings in my repos to make things easier for students when running workshops, so ignoring it globally won’t work for me. That said, I can just remember to remove it before I commit so it’s not a HUGE deal, I can just imagine folks slipping up often enough to where it’ll end up in commits from time-to-time and we’ll just have the conversation again.

@aduth and @adamsilverstein asked if the fact that WordPress os strict is written down somewhere?

@gziolo shared the following comment from https://core.trac.wordpress.org/ticket/34345:

IDEIDE Integrated Development Environment. A software package that provides a full suite of functionality to software developers/programmers. Normally an IDE includes a source code editor, code-build tools and debugging functionality.-specific .gitignore rules should not be present in a project. They should be managed in the user’s ~/.gitignore_global.

@gziolo added that it does not look like it is a written rule, as he was not able to find it in the docs. So, we can go both ways; we should document it to make it easy for contributors to update patches.

@nerrad said :

I lean towards adding the rule and just evaluating on a case-by-case basis.

It seems to be more dev friendly and avoids unnecessary noise in reviews.

@mkaz asked if there is any downside to adding the rule and @aduth answered:

I don’t think there’s a downside in-and-of-itself, more the slippery slope of how we make these decisions in the future without a well-defined approach.

@adamsilverstein suggested as action item working on some language for HOW we decide.

@mkaz and @gziolo suggested we add 3-5 top popular IDEs. @gziolo said we could also link to docs how to add an IDE to ~/.gitignore_global.

@aduth suggested, and @adamsilverstein supported that we can base it on “X% or greater” of some well-defined data, e.g., https://insights.stackoverflow.com/survey/2019#technology-_-most-popular-development-environments.

@chancethedev said he is joining the docs team specifically for Gutenberg docs, so he is happy to bring this up in the docs meeting today as well.

If you have any thoughts on this, please share them.

Bundling and loaders – extend coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. to allow SVG components

As part of the open floor, @mkaz introduced the topic by saying: 

For the open floor, I’m interested in the topic above regarding bundling and loaders – trying to extend core to allow SVG components.

Parcel sounds like an interesting option but looks like v2 is not out yet, so would need to wait

@aduth asked clarification on the background of this task and what is trying to be achieved by importing an SVG.

@mkas linked to the ticketticket Created for both bug reports and feature development on the bug tracker. https://github.com/WordPress/gutenberg/issues/14628 and said:

Right now the Social Links duplicates the SVG in CSSCSS Cascading Style Sheets. and PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher to work – we want to figure out some way to get it to a single .svg file

@aduth asked if it’d be feasible to manually shove the SVG into JSX. And asked if not an option to use something like <img src="icon.svg">.

@mkaz answered that the problem for the publishing view is KSES, and linking to images, one loses the ability to color them.

@aduth shared the main questions he thinks we should answer are “Should we do it, and if so, how?” and shared some thoughts :

  • I am conscious of the size inflation, though I think we need to be solving this problem anyways. Could be a way to prompt us to investigate better handling of “large” blocks (opening path for more complex blocks too, like reintroducing Code+SyntaxHighlighting).
  • I guess there is some issue with our build that the Webpack loader might not work? The Babel transform seems less ideal, but also workable.

@gziolo shared the following analysis of what creat reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org app did:

CRA experiments with Babel macros, but the blockerblocker A bug which is so severe that it blocks a release. at the moment is cache invalidation. They had a very solid proposal to inline many types of files, including SVG with Babel macros https://github.com/facebook/create-react-app/issues/3722#issuecomment-458124126.

Macros struggle with the cache invalidation for the dependent files. See the comment in create-react-app https://github.com/facebook/create-react-app/commit/11737bc78676868e76ce5d0c04ddbb5c758d3908#diff-b1524f1e1ccabdb327a12f23b432b20bR13.

Related Babel issue which might resolve this issue in the future: https://github.com/babel/babel/issues/8497.

@mkaz said Parcel 2 sounds like a potential option for the future. Then, asked if we want to add SVGR support to wp-scripts without it in core Gutenberg, relevant PR https://github.com/WordPress/gutenberg/pull/18243. @gziolo answered that we use a custom config in Gutenberg, so it should be fine.

#core-js, #javascript, #meeting-notes

Greg Ziółkowski 3:37 pm on October 31, 2019
Tags: , , javascript, ,   

JavaScript chat summary, October 29nd, 2019

Below is a summary of the discussion from last week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on this week’s agenda.

ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org prerelease channels

Slack Conversation

There was an announcement from the React team about official prerelease channels:

The long story short is they are promoting react@next prereleases and share some guidelines on how to test projects with the upcoming changes to their libraries. If you want to get involved and explore how the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ project could participate please comment on the corresponding issue.

Time of the meeting

Slack Conversation

Weekly meetings discuss JavaScript in the context of the WordPress ecosystem and we value the input from people working with JavaScript in WordPress. We wanted to survey people whether they would like to participate in the weekly chat if there was a different time?

As of today, we expect you’ll come to the meeting prepared to contribute your perspectives and help influence direction. You can also share in comments what would you expect from such meetings.

Testing components

Slack Conversation

There is an ongoing discussion about different approaches to testing UIUI User interface components on GitHub. It isn’t a new topic. We have already considered removing enzyme in the past when some React APIs weren’t covered, but we gave up because of its wide usage.

We agreed that we can live with enzyme in old files following Code Refactoring guidelines, but we should plan to make it easier to contribute with tests when working on new features. @nerrad emphasized that it would be good to iron out what testing approach we want to recommend going forward. If anything the discussion in that issue highlights, we should include it in the Testing Overview documentation as the very first step.

@gziolo proposed we consider the E2E testing approach with the instance of Storybook as the testing environment given that it is a static site working like a single page application. @itsjonq shared that he’s done storybook E2E testing using Cypress in the past. It was something that could be automated by CI (Travis) and it worked great.

#core-js, #corejs, #javascript, #js, #meeting-notes

Omar Reiss 10:44 pm on October 28, 2019
Tags: , , javascript, ,   

JavaScript chat summary, October 22nd, 2019

Below is a summary of the discussion from last week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on this week’s agenda.

Agenda: Node LTS

Slack Conversation

Recently, Node 12 became the new LTS version for Node. A pull request to make WordPress scripts compatible with Node 12 was merged.

Agenda: Code style

Slack Conversation

A change to the JSDoc pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. triggered new ESLint warnings. These were fixed in a pull request: https://github.com/WordPress/gutenberg/pull/18025.

Another PR tries to bring WP Prettier into WP Scripts. WP Prettier is a Prettier fork that follows the WordPress code conventions that allows to easily reformat all of WordPress JavaScript but also enable other developers in the community who leverage WP scripts to do the same.

Agenda: Storybook

Slack Conversation

In September, Storybook was added to Gutenberg. There’s an issue open discussing next steps, which includes adding stories for all @wordpress/components and adding support for ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org Native components. @mkaz published a tutorial video on his blogblog (versus network, site) on how to code a storybook story.

The following questions could be explored:

  • How can we enable plugin and theme developers to leverage storybook in their own workflows? It was suggested storybook could be added to WP scripts.
  • How can we integrate storybook into https://developer.wordpress.org/block-editor/? Storybook could be a replacement for the components reference.

A few concerns were raised with regard to using storybook on wordpress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/:

– How do we keep the WP dev site headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes.?
– How do we avoid iframes (and include the header) to keep routing?
– How do we keep the READMEs (or some aspects of them) as there’s a lot of good info there?

It seems storybook allows for enough customization to be able to address these concerns. Some help from the metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. team would be required.

Open floor: Card component

Slack Conversation

@itsjonq worked on a PR for a new Card component. There’s still some ongoing discussion about the introduction of css-in-js and Enzyme in that PR. Feedback appreciated!

#core-js, #corejs, #javascript, #js, #meeting-notes

Greg Ziółkowski 12:09 pm on October 18, 2019
Tags: javascript,   

Javascript Chat Summary – October 15, 2019

Below is a summary of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript). Major props to @cbravobernal for wrangling it.

Have a topic for discussion for the next meeting? Leave a suggested edit on next week’s agenda.

Storybook

Storybook is a UIUI User interface component explorer for frontend developers and designers.

@gziolo created a new label Storybook on GitHubGitHub GitHub is a website that offers online implementation of git repositories that can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged by the repository owner. https://github.com/ to make it easier to discover related issues and PRs in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/.

In the meantime, contributors @mkaz and @itsjonq added the first stories with examples of UI components available at https://wordpress.github.io/gutenberg/design-system/components/?path=/story/introduction–page.

Adding @wordpress/components in Storybook is a straightforward way to start, as they are already some existing examples. Many people also voiced many advantages of using Storybook, emphasizing the easy way to explore which components Gutenberg provides.

The team also talked about benefits for having the master issue overview of the effort and a way to track progress.

@gziolo raised the issue of using Netlify for the playground and Storybook previews in PRs. Netlifly offers a special free plan for OSS projects but they require a link to be included on the project page which is something which might not work in the case of WordPress.

Action items:

  • create the master issue with the next steps for Storybook (@gziolo)
  • create individual issues with improvements to the Storybook setup (owner required)
  • discuss live preview for PRs and explore various options (owner required, with @nerrad ready to pick it up at a later time)

Monorepo – Mobile Gutenberg

The next topic was moving the Mobile Gutenberg codebase into the Gutenberg monorepo. @hypest opened the original issue nearly a year ago!

There is a draft PR which moves most of the code from wordpress-mobile/gutenberg-mobile respository to npm packages in WordPress/gutenberg repository.

@hypest requested help from someone with good web knowledge in order to check if that PR is going to cause any issues.

Action item: 

@gziolo will check this PR and help to merge once WordPress trunktrunk A directory in Subversion containing the latest development code in preparation for the next major release cycle. If you are running "trunk", then you are on the latest revision. is frozen during the process of the 5.3 release.

#javascript, #meeting-notes

Darren Ethier (nerrad) 2:30 pm on October 8, 2019
Tags: javascript,   

Javascript Chat Summary – October 8, 2019

Below is a summary of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on next week’s agenda.

Open Floor

There was no agenda items this week so the meeting was spent with open floor.

Storybook Chat

Spent a bit of time chatting about efforts to get storybook working (slack)

Related pulls:

Also:

WordPress 5.3 Notes

  • will include an updated version of Backbone that introduces some back-compat breaking changes (related trac ticket). If you use backbone in your pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party./theme, worth checking to make sure everything still works. A dev notedev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include a description of the change, the decision that led to this change, and a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. will be published soon including details.
#javascript, #meeting-notes
Jorge Costa 4:48 pm on October 1, 2019
Tags: , javascript,   

Javascript Chat Summary: October 1, 2019

Below is a of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on next week’s agenda.

WordPress 5.3 progress

@gziolo announced that WordPress 5.3 release betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. 2 is out. @gziolo asked if participants know if there any tasks left related to JavaScript coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..

@jorgefilipecosta referred https://core.trac.wordpress.org/ticket/47527 as a small JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. patchpatch A special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. that should fix a bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. in the media library. The patch should be ready and needs a review. A review there would be much appreciated.

@gziolo continued by saying it would be important to merge https://core.trac.wordpress.org/ticket/48154, which would simplify updating npm packages in WP core. But there is still this pending issue to address:

> Where to put generated asset files to be consumed by PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher? At the moment they are generated in the folder, which in usual is exposed as client-side assets.

In case you have any ideas, please provide your insights on the ticketticket Created for both bug reports and feature development on the bug tracker..

CSSCSS Cascading Style Sheets. support in wordpress/scripts

@gziolo introduced the subject by saying that it is something that we discussed some time ago in core-js chat. It’s tracked under https://github.com/WordPress/gutenberg/issues/14801, and it was primarily explored by @fabiankaegy in https://github.com/WordPress/gutenberg/pull/14847. 

Participants started discussing the challenge of CSS support in wordpress/scripts.

@gziolo shared some context:

In GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ we don’t import CSS in JS files. Instead, we have a separate build step that converts the SCSS files into CSS files which are published to npm. There is some additional step performed by webpack, but I guess it’s mostly about ensuring the LTR version is produced as well.

@nerrad said:

I do think we should have @wordpress/scripts as a utility that builds CSS as well. But getting to something that addresses the various needs of those consuming it is the difficulty here.

@nerrad concluded that we need to decide the defaults for the CSS build system with ways to override them via CLICLI Command Line Interface. Terminal (Bash) in Mac, Command Prompt in Windows, or WP-CLI for WordPress. args.

@gziolo continued and said that ideally, we should be able to reuse as much as possible of what Gutenberg uses internally. This is the only way to ensure pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party./theme developers get all updates out of the box.

@gziolo questioned why developers default to importing CSS in JS file. @jsnajdr provided an answer to the question and then explained how the webpack runtime loads the assets. @gziolo found the mechanism interesting and said we should definitely explore alternatives in how we manage assets in WordPress core to better align with what JavaScript ecosystem offers these days. 

@gziolo continued the conversation and said that the mobile team is exploring how to build cross-platform UIUI User interface components.

This is the PR https://github.com/WordPress/gutenberg/pull/17614 which explores styled-system and styled-components.

@pinarol said we want to reach a point where we can build blocks with a cross-platform components library which enables us to implement a blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. once and run it on both web/mobile.

This requires the mobile team to find a way to have a common styling system with the web, and since CSS is not supported by ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org Native we started to investigate styled-system and styled-components. @pinarol concluded by saying that this is a problem we want to solve as soon as possible.

@gziolo said that the approach used for multiplatform comments is directly related to work of making wordpress/scripts support CSS.

Storybook

@gziolo announced that we are considering adding Storybook to help with the development of UI components.

It is possible to leave feedback on the PR’s that propose this addition https://github.com/WordPress/gutenberg/pull/17475 and https://github.com/WordPress/gutenberg/pull/17173. They are alternative versions for a similar goal.

@ajitbohra also implemented a similar solution outside of the Gutenberg repository and said he would love to consolidate efforts.

Custom element interoperability

@flixos90 proposed a PR that includes CustomElement interoperability for block types. 

If you care about the support for web components in Gutenberg, give the PR https://github.com/WordPress/gutenberg/pull/17649 a spin and help to land it.

In case, you have any insights or suggestions please share them on the PR.

#core-js, #javascript, #meeting-notes

Greg Ziółkowski 11:44 am on October 1, 2019
Tags: , javascript,   

JavaScript chat summary, September 24th, 2019

Below is a summary of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript).

Have a topic for discussion for the next meeting? Leave a suggested edit on this week’s agenda.

New JavaScript APIs and support for previous versions of WordPress

Discussion: @adamsilverstein suggested that we add a developer guide section to explain how to write plugins that use newly introduced JavaScript APIs to work with older versions of WordPress. The biggest challenge is how to approach APIs which are exposed by new modules available under the wp global namespace.

We encourage pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. developers to share their strategies in the comments so we could work on the official recommendations on how to tackle this issue.

We also agreed that a good start would be to enforce using the @since pragma in JSDoc comments for all public APIs present in JavaScript code. This is something that is taken for granted in PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher codebase.

Action items:

  • Ensure GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ follows JavaScript Documentation Standards for JSDoc and starts using @since pragma in particular.

#core-js, #javascript, #meeting-notes

Adam Silverstein 3:41 am on September 17, 2019
Tags: , javascript,   

JavaScript chat summary, Sept. 10th, 2019

Below is a summary of the discussion from this week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript). Thanks to @cbravobernal for putting these notes together.

Agenda: Upgrading jQuery when user on the front end.

@adamsilverstein comment the idea of upgrading jQuery on the front end, due to the crashes that appear if you try to update the wp-adminadmin (and super admin) part. There was discussion about removing jQuery from all WP, but is a hard task to do and we have still to be compatible with old browsers like IE11.

Action:

Anything new should either not use jQuery or at the very least work with the current version correctly.

Keep the discussion going in the ticketticket Created for both bug reports and feature development on the bug tracker. and hopefully we can arrive at a way forward.

Out of agenda: jQuery dependency on admin bar

@williampatton raised this Issue regarding the jQuery dependency of the admin bar.

The main discussion is what to do, use a temporary patchpatch A special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. (for 2020 theme we are considering just enqueueing jQuery) or try to completely remove the jQuery dependency of that admin bar.

Seems that a “hoverintent” is the main problem of removing jQuery there, also other keyboard actions should be checked before removing it.

Action: 

Keep tracking the issue

#core-js, #javascript, #meeting-notes

Omar Reiss 12:37 pm on September 3, 2019
Tags: , , javascript,   

JavaScript chat summary, August 27th, 2019

Below is a summary of the discussion from last week’s JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com chat (agenda, Slack Transcript)

Have a topic for discussion for the next meeting? Leave a suggested edit on this week’s agenda.

Agenda: Cross-platform packages

Slack Conversation

In the near future we want to publish a mobile components library to allow cross-platform development of blocks, how can we document mobile/web specific props? The proposal currently only touches README files which are manually crafted. So far we assumed that this code is only used in WordPress. How could we make packages that are interoperable with both ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org DOM and React Native?

The mobile team is trying to make the API’s / Prop interfaces for mobile and webcomponents as similar as possible. But it will be hard to make them entirely the same. So we need to make sure we find a way to manage the documentation for these things better. Jorge Bernal will work on a proposal based on https://github.com/WordPress/gutenberg/pull/17145.

#core-js, #corejs, #javascript, #meeting-notes