Move internal dynamic categories to use JSON

[BeksOmega]

Is your feature request related to a problem? Please describe.

The XML serializaation system is being iceboxed, so internal usages of the XML system should be moved to the new JSON system.

In particular, dynamic categories which are internal to Blockly should be changed to use JSON

Describe the solution you'd like

• Change the dynamic variable category to use json
• Change the dynamic typed variable category to use json
• Change the dynamic procedure category to use json

Describe alternatives you've considered

N/A

Additional context

Note that currently we suport dynamic categories being defined in JSON or XML, but it's good to move the internal definitions to JSON.

[bhsingla]

Hi team, I would love to work on this. Thanks

[rachel-fenichel]

Hi @bhsingla! This is being worked on in the blockly-badger breakout room.

[coolcoder03]

how can i work on this?

[Apoorvgarg-creator]

Is this issue still available ? @BeksOmega

[BeksOmega]

Yep go for it @Apoorvgarg-creator !

[Apoorvgarg-creator]

@BeksOmega Thanks for Assigning it to me, Since it's a feature request and I am new to blockly, I would appreciate if you could give me a brief on how to get started with the feature ! What all should I know and how to test my features. Thanks once again !

[BeksOmega]

@BeksOmega Thanks for Assigning it to me, Since it's a feature request and I am new to blockly, I would appreciate if you could give me a brief on how to get started with the feature ! What all should I know and how to test my features. Thanks once again !

Oh whoops, this shouldn't have been marked as a feature request!

The issue is to convert toolboxes categories which are currently defined using XML to use JSON. You can see here how XML is being constructed for the variable category. You should refactor the flyoutCategoryBlocks function to construct a JSON toolbox instead.

We want to switch all three functions linked in the original issue to use JSON. You can do that all at once, or you can submit PRs for each individual function. Whatever works better for you!

Let me know if you have any further questions =)

[Apoorvgarg-creator]

@BeksOmega Thank you for the help !

[BeksOmega]

@Apoorvgarg-creator are you still interested in working on this?

[Apoorvgarg-creator]

@BeksOmega Yes, I took a little break. Sorry for the inconvenience.

[BeksOmega]

@BeksOmega Yes, I took a little break. Sorry for the inconvenience.

You're good no rush! I was just going through the active issues and seeng if there were any I could mark as available again :P Thanks for your interest in this!

[Apoorvgarg-creator]

@BeksOmega, do we have to add unit test cases for this issue ?

[BeksOmega]

@BeksOmega, do we have to add unit test cases for this issue ?

It would be great to add unit tests for this if you have time =) But otherwise that can be split off into a separate issue!

[Apoorvgarg-creator]

@BeksOmega, I saw you created common functions to createElement in Xml in a file xml.ts. Should I Use the same approach for creating in JSON ?

[BeksOmega]

@BeksOmega, I saw you created common functions to createElement in Xml in a file xml.ts. Should I Use the same approach for creating in JSON ?

You should just be able to return plain old object literals! so no helpers necessary for JSON.

[Apoorvgarg-creator]

@BeksOmega Thank you for the help ! I Want to know how Can I test after making my changes, I know a little silly question to ask ! Sorry !

[BeksOmega]

@BeksOmega Thank you for the help ! I Want to know how Can I test after making my changes, I know a little silly question to ask ! Sorry !

To manually test the variables you can open up the variable category, click the "create variable" button, and test that a variable block properly shows up in the flyout.

To manually test the procedures you can open up the function category, drag out a function definition block, and then reopen the procedure category and test that the procedure caller block properly shows up in the flyout.

[Apoorvgarg-creator]

@BeksOmega Thank you

[Apoorvgarg-creator]

interface BlockInfo {
  kind: string;
  blockxml?: string | Node;
  type?: string;
  gap?: string | number;
  disabled?: string | boolean;
  enabled?: boolean;
  id?: string;
  x?: number;
  y?: number;
  collapsed?: boolean;
  inline?: boolean;
  data?: string;
  extraState?: AnyDuringMigration;
  icons?: {[key: string]: AnyDuringMigration};
  fields?: {[key: string]: AnyDuringMigration};
  inputs?: {[key: string]: ConnectionState};
  next?: ConnectionState;
}

How to set variable name in JSON structure

[Apoorvgarg-creator]

@BeksOmega, I solved it for variables and dynamic variables, Can you please once check the PR, I am not sure how to proceed for procedures.

[AbhinavKRN]

@BeksOmega is this issue available?