[BD-46] feat: add testing guidelines #1165

monteri · 2022-03-24T14:10:15Z

New features:

component TestingGuideline that corresponds to the <guide /> tag in the .md files
add converting strings from .md file when passing props to the <guide /> tag using markdown-to-jsx
according to the PAR-728 filled Testing guidelines for all page components (except deprecated)

netlify · 2022-03-24T14:10:20Z

✅ Deploy Preview for paragon-openedx ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	`28551e5`
🔍 Latest deploy log	https://app.netlify.com/sites/paragon-openedx/deploys/6297337653d0fd00091c472f
😎 Deploy Preview	https://deploy-preview-1165--paragon-openedx.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

openedx-webhooks · 2022-03-24T14:10:20Z

Thanks for the pull request, @monteri! I've created BLENDED-1160 to keep track of it in Jira. More details are on the BD-46 project page.

When this pull request is ready, tag your edX technical lead.

codecov · 2022-03-24T14:17:35Z

Codecov Report

Merging #1165 (1aba536) into master (b5eb9a9) will decrease coverage by 0.12%.
The diff coverage is n/a.

❗ Current head 1aba536 differs from pull request most recent head 28551e5. Consider uploading reports for the commit 28551e5 to get more accurate results

@@            Coverage Diff             @@
##           master    #1165      +/-   ##
==========================================
- Coverage   91.02%   90.90%   -0.13%     
==========================================
  Files         196      195       -1     
  Lines        3243     3155      -88     
  Branches      732      704      -28     
==========================================
- Hits         2952     2868      -84     
+ Misses        278      274       -4     
  Partials       13       13

Impacted Files	Coverage Δ
src/ProductTour/index.jsx	`83.87% <0.00%> (-4.66%)`	⬇️
src/SelectableBox/index.jsx	`96.42% <0.00%> (-0.24%)`	⬇️
src/Tabs/index.jsx	`93.33% <0.00%> (-0.22%)`	⬇️
src/Sticky/index.jsx	`95.83% <0.00%> (-0.17%)`	⬇️
src/DataTable/index.jsx	`94.82% <0.00%> (ø)`
src/Menu/SelectMenu.jsx	`64.06% <0.00%> (ø)`
src/Breadcrumb/index.jsx	`100.00% <0.00%> (ø)`
src/utils/breakpoints.js	`100.00% <0.00%> (ø)`
src/DataTable/DataViewToggle.jsx	`100.00% <0.00%> (ø)`
src/DataTable/utils/getVisibleColumns.jsx	`100.00% <0.00%> (ø)`
... and 3 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b5eb9a9...28551e5. Read the comment docs.

adamstankiewicz · 2022-03-25T05:46:17Z

src/CheckBox/README.md

+<guide
+  defaultText="`nextLabel: 'Next'`, `prevLabel: 'Previous'`"
+  events="`onSelect`, `onSlid`, `onSlide`"
+  selectors="`carousel`"
+/>


Looks like this might be copy/pasta from Carousel above.

yes, thank you, forgot to remove

adamstankiewicz · 2022-03-25T05:46:39Z

src/CheckBoxGroup/README.md

+<guide
+  defaultText="`nextLabel: 'Next'`, `prevLabel: 'Previous'`"
+  events="`onSelect`, `onSlid`, `onSlide`"
+  selectors="`carousel`"
+/>


Looks like this might be copy/paste from Carousel above.

yes, thank you, forgot to remove

adamstankiewicz · 2022-03-25T05:49:03Z

src/Image/README.md

@@ -46,4 +46,4 @@ notes: |
 <Image src="https://source.unsplash.com/1600x800/?nature,flower" fluid />
 ```

-
+<guide />


I think dataTestId is supported here?

yes, thank you, added

adamstankiewicz · 2022-03-25T05:49:34Z

src/Figure/README.md

@@ -30,3 +30,7 @@ notes: |
  </Figure.Caption>
 </Figure>
 ```
+
+<guide
+  selectors="`figure`"


I think dataTestId is supported here?

yes, it is supported, my mistake. Added

adamstankiewicz · 2022-03-25T05:51:48Z

src/CheckBox/README.md

@@ -91,3 +91,9 @@ class CheckBoxWrapper extends React.Component {
  }
 }
 ```
+
+<guide


I think dataTestId is supported here?

yes, but as it is deprecated, I remove testguide from there

adamstankiewicz · 2022-03-25T06:15:42Z

www/src/scss/base.scss

@@ -14,3 +14,4 @@ body {
 @import "../components/doc-elements";
 @import "../components/Settings";
 @import "../components/Toc";
+@import "../components/TestingGuideline";


nit: newline

adamstankiewicz · 2022-03-25T06:17:36Z

www/src/templates/component-page-template.jsx

@@ -35,17 +42,28 @@ export default function PageTemplate({
      h6: (props) => <LinkedHeading h="6" {...props} />,
      pre: props => <div {...props} />,
      code: CodeBlock,
+      guide: (props) => (


Might be kind of a pain to change everywhere, but I'm thinking testguide might be a bit clearer to make it more explicit it has to do with the testing guidelines? What do you think?

yes, it is more appropriate so I change

adamstankiewicz · 2022-03-25T06:22:30Z

www/src/components/TestingGuideline.jsx

+  selectors,
+}) => {
+  const [collapseIsOpen, setCollapseIsOpen] = useState(false);
+  setIsGuidelinesOnPage(true);


[clarification] Is it OK this happens on every component re-render? Or should it be in a useEffect with an empty dependency array?

I think the idea of having useEffect is better than simple function call. But as I read about setting state to the same value does nothing. Correct me if it is not right. But according to every render function call, yes, useEffect is better here

adamstankiewicz · 2022-03-25T06:22:50Z

www/src/components/TestingGuideline.scss

@@ -0,0 +1,5 @@
+.pgn-doc__guideline {
+    code {
+        background: #f8f8ff;


Is there an SCSS color variable we could use here?

yes, I added $danger-100. It is similar to that color

adamstankiewicz · 2022-03-25T06:23:05Z

www/src/templates/component-page-template.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useState} from 'react';


nit: { useState }

openedx-webhooks added blended PR is managed through 2U's blended developmnt program needs triage labels Mar 24, 2022

adamstankiewicz reviewed Mar 25, 2022

View reviewed changes

monteri force-pushed the zadorozhnii/docs-testing-guidelines branch from a7bc1ff to d345511 Compare March 25, 2022 13:09

adamstankiewicz mentioned this pull request Apr 8, 2022

Raccoon Gang sync (4/7) #1221

Closed

monteri force-pushed the zadorozhnii/docs-testing-guidelines branch from 9cc5f74 to 1aba536 Compare May 11, 2022 09:39

natabene assigned adamstankiewicz and unassigned adamstankiewicz May 14, 2022

vzadorozhnii added 5 commits June 1, 2022 12:36

feat: add testing guidelines

a193a64

feat: PR comment fixes

bfcc6e2

feat: updated according to PR

4c45b3f

feat: fix quotes

d28bd4c

feat: package-lock.json

28551e5

monteri force-pushed the zadorozhnii/docs-testing-guidelines branch from 1aba536 to 28551e5 Compare June 1, 2022 09:37

adamstankiewicz added the engineering Engineering label Jan 24, 2023

monteri requested a review from adamstankiewicz February 21, 2023 15:06

monteri assigned adamstankiewicz Feb 21, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[BD-46] feat: add testing guidelines #1165

[BD-46] feat: add testing guidelines #1165

monteri commented Mar 24, 2022 •

edited

Loading

netlify bot commented Mar 24, 2022 •

edited

Loading

openedx-webhooks commented Mar 24, 2022

codecov bot commented Mar 24, 2022 •

edited

Loading

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022

adamstankiewicz Mar 25, 2022

monteri Mar 25, 2022 •

edited

Loading

adamstankiewicz Mar 25, 2022

@@ @@ -91,3 +91,9 @@ class CheckBoxWrapper extends React.Component { @@
                 }
               }
               ```
+              <guide

		@@ -1,4 +1,4 @@
		import React from 'react';
		import React, {useState} from 'react';

[BD-46] feat: add testing guidelines #1165

Are you sure you want to change the base?

[BD-46] feat: add testing guidelines #1165

Conversation

monteri commented Mar 24, 2022 • edited Loading

netlify bot commented Mar 24, 2022 • edited Loading

✅ Deploy Preview for paragon-openedx ready!

openedx-webhooks commented Mar 24, 2022

codecov bot commented Mar 24, 2022 • edited Loading

Codecov Report

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

monteri Mar 25, 2022 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

monteri commented Mar 24, 2022 •

edited

Loading

netlify bot commented Mar 24, 2022 •

edited

Loading

codecov bot commented Mar 24, 2022 •

edited

Loading

monteri Mar 25, 2022 •

edited

Loading