[Platform security] Replace SCSS with CSS in JS (part 2)#233508
[Platform security] Replace SCSS with CSS in JS (part 2)#233508kc13greiner merged 14 commits intoelastic:mainfrom
Conversation
|
@elasticmachine merge upstream |
|
@elasticmachine merge upstream |
|
Pinging @elastic/kibana-security (Team:Security) |
|
@elasticmachine merge upstream |
Now that <EuiProvider> is the wrapper, this expect is finding the passed in RuleGroupEditor. No sub-RuleGroupEditors are found though. We need mount vs shallow here so we can find the AddRuleButton
| }; | ||
| const wrapper = shallowWithIntl(<RuleGroupEditor {...props} />); | ||
| expect(wrapper.find(RuleGroupEditor)).toHaveLength(0); | ||
| const wrapper = mountWithEuiProvider(<RuleGroupEditor {...props} />); |
There was a problem hiding this comment.
Note: now that it is nested in the EuiProvider, the first assertion is finding the element that was passed in.
So just one is found, no sub RuleGroupEditors
|
/ci |
Now that we are actually rendering it with mount (vs shallow), it needs the `role` prop set
| role, | ||
| }); | ||
| }, | ||
| role: { |
There was a problem hiding this comment.
Note: Thank you @elena-shostak ! (please fact check me here 😅 )
Now that we are actually rendering with mount (instead of using shallow...), the role prop needs to be set on initial render
|
/ci |
💚 Build Succeeded
Metrics [docs]Module Count
Async chunks
Page load bundle
History
cc @kc13greiner |
|
Starting backport for target branches: 8.18, 8.19 https://github.com/elastic/kibana/actions/runs/18106995623 |
) Closes elastic#211652 ## Summary Part 2 of elastic#211652 and follow up from elastic#214798 Removed most SASS files from all platform security owned code. (Full checklist on parent issue) ### How to test Testing visual regression isn't super straightforward here. For my local testing, i started two instances of Kibana (main and this branch) On main: - Start es: ``` yarn es snapshot --license=trial -E http.port=9400 ``` - Start kibana with the following config (CLI or kibana.dev.yml) ``` server.port: 5602 elasticsearch.hosts: ["http://localhost:9400"] ``` Once started, in a private browsing window, you should have access to Kibana on main on `localhost:5602` On this PR: Start ES and Kibana normally (Kibana should be available on localhost:5601) This PR contains changes to the following parts of the Spaces plugin: - Access agreement page - Login page (see note below regarding testing) - Role mapping rule group editor For testing the full login page with different selectors, etc, you can start kibana with the following changes in the kibana.dev.yml file ``` xpack.security.authc.providers: basic.basic1: order: 0 hint: "Use your corporate username & password" accessAgreement: message: | **You are accessing a system with sensitive information** By logging in, you acknowledge that information system usage pki.pki1: order: 1 token.token1: order: 2 saml.saml1: order: 3 realm: saml1 oidc.oidc1: order: 4 realm: oidc1 ``` Ideally, you should see no visual regression between the two versions. ## Screenshots | Component | Main | PR | |--------|--------|--------| |Access agreement page|<img width="300" alt="Screenshot 2025-05-09 at 10 31 18" src="https://github.com/user-attachments/assets/483d9e47-e4a0-4e01-8282-9d205ba0bf6d" />|<img width="300" alt="Screenshot 2025-05-09 at 10 54 14" src="https://github.com/user-attachments/assets/62965843-5242-4d96-b300-812cdc349864" />| |Login page|<img width="300" alt="Screenshot 2025-05-08 at 17 05 23" src="https://github.com/user-attachments/assets/99536f62-75d8-46e2-ae3a-aba7b990a723" />|<img width="300" alt="Screenshot 2025-05-08 at 18 24 50" src="https://github.com/user-attachments/assets/3c2aadc9-1746-4d7f-9093-a6053916b597" />| |Role mapping rule editor| <img width="300" src="https://github.com/user-attachments/assets/8a14e323-223d-43df-9dfb-edf8f6859c40" />|<img width="300" src="https://github.com/user-attachments/assets/68a9b37d-060d-4060-b2ad-b0b3319de78d" />| ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging. - [x] The risk of inexact conversion: verifying this PR requires manual checks to ensure that the conversion has not created any regressions in the style. --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com> Co-authored-by: Kurt <kc13greiner@users.noreply.github.com> Co-authored-by: Larry Gregory <larry.gregory@elastic.co> (cherry picked from commit 589c0b4) # Conflicts: # src/platform/plugins/private/interactive_setup/public/app.scss # src/platform/plugins/private/interactive_setup/public/app.tsx # x-pack/platform/plugins/shared/security/public/authentication/components/authentication_state_page/authentication_state_page.scss # x-pack/platform/plugins/shared/security/public/authentication/components/authentication_state_page/authentication_state_page.test.tsx # x-pack/platform/plugins/shared/security/public/authentication/components/authentication_state_page/authentication_state_page.tsx # x-pack/platform/plugins/shared/security/public/authentication/login/__snapshots__/login_page.test.tsx.snap # x-pack/platform/plugins/shared/security/public/authentication/login/components/login_form/__snapshots__/login_form.test.tsx.snap # x-pack/platform/plugins/shared/security/public/authentication/login/login_page.scss # x-pack/platform/plugins/shared/security/public/authentication/login/login_page.tsx # x-pack/platform/plugins/shared/security/public/authentication/overwritten_session/__snapshots__/overwritten_session_page.test.tsx.snap # x-pack/platform/plugins/shared/security/tsconfig.json
) Closes elastic#211652 ## Summary Part 2 of elastic#211652 and follow up from elastic#214798 Removed most SASS files from all platform security owned code. (Full checklist on parent issue) ### How to test Testing visual regression isn't super straightforward here. For my local testing, i started two instances of Kibana (main and this branch) On main: - Start es: ``` yarn es snapshot --license=trial -E http.port=9400 ``` - Start kibana with the following config (CLI or kibana.dev.yml) ``` server.port: 5602 elasticsearch.hosts: ["http://localhost:9400"] ``` Once started, in a private browsing window, you should have access to Kibana on main on `localhost:5602` On this PR: Start ES and Kibana normally (Kibana should be available on localhost:5601) This PR contains changes to the following parts of the Spaces plugin: - Access agreement page - Login page (see note below regarding testing) - Role mapping rule group editor For testing the full login page with different selectors, etc, you can start kibana with the following changes in the kibana.dev.yml file ``` xpack.security.authc.providers: basic.basic1: order: 0 hint: "Use your corporate username & password" accessAgreement: message: | **You are accessing a system with sensitive information** By logging in, you acknowledge that information system usage pki.pki1: order: 1 token.token1: order: 2 saml.saml1: order: 3 realm: saml1 oidc.oidc1: order: 4 realm: oidc1 ``` Ideally, you should see no visual regression between the two versions. ## Screenshots | Component | Main | PR | |--------|--------|--------| |Access agreement page|<img width="300" alt="Screenshot 2025-05-09 at 10 31 18" src="https://github.com/user-attachments/assets/483d9e47-e4a0-4e01-8282-9d205ba0bf6d" />|<img width="300" alt="Screenshot 2025-05-09 at 10 54 14" src="https://github.com/user-attachments/assets/62965843-5242-4d96-b300-812cdc349864" />| |Login page|<img width="300" alt="Screenshot 2025-05-08 at 17 05 23" src="https://github.com/user-attachments/assets/99536f62-75d8-46e2-ae3a-aba7b990a723" />|<img width="300" alt="Screenshot 2025-05-08 at 18 24 50" src="https://github.com/user-attachments/assets/3c2aadc9-1746-4d7f-9093-a6053916b597" />| |Role mapping rule editor| <img width="300" src="https://github.com/user-attachments/assets/8a14e323-223d-43df-9dfb-edf8f6859c40" />|<img width="300" src="https://github.com/user-attachments/assets/68a9b37d-060d-4060-b2ad-b0b3319de78d" />| ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging. - [x] The risk of inexact conversion: verifying this PR requires manual checks to ensure that the conversion has not created any regressions in the style. --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com> Co-authored-by: Kurt <kc13greiner@users.noreply.github.com> Co-authored-by: Larry Gregory <larry.gregory@elastic.co> (cherry picked from commit 589c0b4) # Conflicts: # src/platform/plugins/private/interactive_setup/public/app.scss # src/platform/plugins/private/interactive_setup/public/app.tsx # x-pack/platform/plugins/shared/security/public/authentication/components/authentication_state_page/authentication_state_page.scss # x-pack/platform/plugins/shared/security/public/authentication/components/authentication_state_page/authentication_state_page.test.tsx # x-pack/platform/plugins/shared/security/public/authentication/components/authentication_state_page/authentication_state_page.tsx # x-pack/platform/plugins/shared/security/public/authentication/login/__snapshots__/login_page.test.tsx.snap # x-pack/platform/plugins/shared/security/public/authentication/login/components/login_form/__snapshots__/login_form.test.tsx.snap # x-pack/platform/plugins/shared/security/public/authentication/login/components/login_form/login_form.scss # x-pack/platform/plugins/shared/security/public/authentication/login/login_page.scss # x-pack/platform/plugins/shared/security/public/authentication/login/login_page.tsx # x-pack/platform/plugins/shared/security/public/authentication/overwritten_session/__snapshots__/overwritten_session_page.test.tsx.snap # x-pack/platform/plugins/shared/security/tsconfig.json
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation |
Closes #211652 ## Summary Part 2 of #211652 and follow up from #214798 Removed most SASS files from all platform security owned code. (Full checklist on parent issue) ### How to test Testing visual regression isn't super straightforward here. For my local testing, i started two instances of Kibana (main and this branch) On main: - Start es: ``` yarn es snapshot --license=trial -E http.port=9400 ``` - Start kibana with the following config (CLI or kibana.dev.yml) ``` server.port: 5602 elasticsearch.hosts: ["http://localhost:9400"] ``` Once started, in a private browsing window, you should have access to Kibana on main on `localhost:5602` On this PR: Start ES and Kibana normally (Kibana should be available on localhost:5601) This PR contains changes to the following parts of the Spaces plugin: - Access agreement page - Login page (see note below regarding testing) - Role mapping rule group editor For testing the full login page with different selectors, etc, you can start kibana with the following changes in the kibana.dev.yml file ``` xpack.security.authc.providers: basic.basic1: order: 0 hint: "Use your corporate username & password" accessAgreement: message: | **You are accessing a system with sensitive information** By logging in, you acknowledge that information system usage pki.pki1: order: 1 token.token1: order: 2 saml.saml1: order: 3 realm: saml1 oidc.oidc1: order: 4 realm: oidc1 ``` Ideally, you should see no visual regression between the two versions. ## Screenshots | Component | Main | PR | |--------|--------|--------| |Access agreement page|<img width="300" alt="Screenshot 2025-05-09 at 10 31 18" src="https://github.com/user-attachments/assets/483d9e47-e4a0-4e01-8282-9d205ba0bf6d" />|<img width="300" alt="Screenshot 2025-05-09 at 10 54 14" src="https://github.com/user-attachments/assets/62965843-5242-4d96-b300-812cdc349864" />| |Login page|<img width="300" alt="Screenshot 2025-05-08 at 17 05 23" src="https://github.com/user-attachments/assets/99536f62-75d8-46e2-ae3a-aba7b990a723" />|<img width="300" alt="Screenshot 2025-05-08 at 18 24 50" src="https://github.com/user-attachments/assets/3c2aadc9-1746-4d7f-9093-a6053916b597" />| |Role mapping rule editor| <img width="300" src="https://github.com/user-attachments/assets/8a14e323-223d-43df-9dfb-edf8f6859c40" />|<img width="300" src="https://github.com/user-attachments/assets/68a9b37d-060d-4060-b2ad-b0b3319de78d" />| ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging. - [x] The risk of inexact conversion: verifying this PR requires manual checks to ensure that the conversion has not created any regressions in the style. --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com> Co-authored-by: Kurt <kc13greiner@users.noreply.github.com> Co-authored-by: Larry Gregory <larry.gregory@elastic.co>
) Closes elastic#211652 ## Summary Part 2 of elastic#211652 and follow up from elastic#214798 Removed most SASS files from all platform security owned code. (Full checklist on parent issue) ### How to test Testing visual regression isn't super straightforward here. For my local testing, i started two instances of Kibana (main and this branch) On main: - Start es: ``` yarn es snapshot --license=trial -E http.port=9400 ``` - Start kibana with the following config (CLI or kibana.dev.yml) ``` server.port: 5602 elasticsearch.hosts: ["http://localhost:9400"] ``` Once started, in a private browsing window, you should have access to Kibana on main on `localhost:5602` On this PR: Start ES and Kibana normally (Kibana should be available on localhost:5601) This PR contains changes to the following parts of the Spaces plugin: - Access agreement page - Login page (see note below regarding testing) - Role mapping rule group editor For testing the full login page with different selectors, etc, you can start kibana with the following changes in the kibana.dev.yml file ``` xpack.security.authc.providers: basic.basic1: order: 0 hint: "Use your corporate username & password" accessAgreement: message: | **You are accessing a system with sensitive information** By logging in, you acknowledge that information system usage pki.pki1: order: 1 token.token1: order: 2 saml.saml1: order: 3 realm: saml1 oidc.oidc1: order: 4 realm: oidc1 ``` Ideally, you should see no visual regression between the two versions. ## Screenshots | Component | Main | PR | |--------|--------|--------| |Access agreement page|<img width="300" alt="Screenshot 2025-05-09 at 10 31 18" src="https://github.com/user-attachments/assets/483d9e47-e4a0-4e01-8282-9d205ba0bf6d" />|<img width="300" alt="Screenshot 2025-05-09 at 10 54 14" src="https://github.com/user-attachments/assets/62965843-5242-4d96-b300-812cdc349864" />| |Login page|<img width="300" alt="Screenshot 2025-05-08 at 17 05 23" src="https://github.com/user-attachments/assets/99536f62-75d8-46e2-ae3a-aba7b990a723" />|<img width="300" alt="Screenshot 2025-05-08 at 18 24 50" src="https://github.com/user-attachments/assets/3c2aadc9-1746-4d7f-9093-a6053916b597" />| |Role mapping rule editor| <img width="300" src="https://github.com/user-attachments/assets/8a14e323-223d-43df-9dfb-edf8f6859c40" />|<img width="300" src="https://github.com/user-attachments/assets/68a9b37d-060d-4060-b2ad-b0b3319de78d" />| ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging. - [x] The risk of inexact conversion: verifying this PR requires manual checks to ensure that the conversion has not created any regressions in the style. --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com> Co-authored-by: Kurt <kc13greiner@users.noreply.github.com> Co-authored-by: Larry Gregory <larry.gregory@elastic.co>
) Closes elastic#211652 ## Summary Part 2 of elastic#211652 and follow up from elastic#214798 Removed most SASS files from all platform security owned code. (Full checklist on parent issue) ### How to test Testing visual regression isn't super straightforward here. For my local testing, i started two instances of Kibana (main and this branch) On main: - Start es: ``` yarn es snapshot --license=trial -E http.port=9400 ``` - Start kibana with the following config (CLI or kibana.dev.yml) ``` server.port: 5602 elasticsearch.hosts: ["http://localhost:9400"] ``` Once started, in a private browsing window, you should have access to Kibana on main on `localhost:5602` On this PR: Start ES and Kibana normally (Kibana should be available on localhost:5601) This PR contains changes to the following parts of the Spaces plugin: - Access agreement page - Login page (see note below regarding testing) - Role mapping rule group editor For testing the full login page with different selectors, etc, you can start kibana with the following changes in the kibana.dev.yml file ``` xpack.security.authc.providers: basic.basic1: order: 0 hint: "Use your corporate username & password" accessAgreement: message: | **You are accessing a system with sensitive information** By logging in, you acknowledge that information system usage pki.pki1: order: 1 token.token1: order: 2 saml.saml1: order: 3 realm: saml1 oidc.oidc1: order: 4 realm: oidc1 ``` Ideally, you should see no visual regression between the two versions. ## Screenshots | Component | Main | PR | |--------|--------|--------| |Access agreement page|<img width="300" alt="Screenshot 2025-05-09 at 10 31 18" src="https://github.com/user-attachments/assets/483d9e47-e4a0-4e01-8282-9d205ba0bf6d" />|<img width="300" alt="Screenshot 2025-05-09 at 10 54 14" src="https://github.com/user-attachments/assets/62965843-5242-4d96-b300-812cdc349864" />| |Login page|<img width="300" alt="Screenshot 2025-05-08 at 17 05 23" src="https://github.com/user-attachments/assets/99536f62-75d8-46e2-ae3a-aba7b990a723" />|<img width="300" alt="Screenshot 2025-05-08 at 18 24 50" src="https://github.com/user-attachments/assets/3c2aadc9-1746-4d7f-9093-a6053916b597" />| |Role mapping rule editor| <img width="300" src="https://github.com/user-attachments/assets/8a14e323-223d-43df-9dfb-edf8f6859c40" />|<img width="300" src="https://github.com/user-attachments/assets/68a9b37d-060d-4060-b2ad-b0b3319de78d" />| ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) ### Identify risks Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss. Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging. - [x] The risk of inexact conversion: verifying this PR requires manual checks to ensure that the conversion has not created any regressions in the style. --------- Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com> Co-authored-by: Kurt <kc13greiner@users.noreply.github.com> Co-authored-by: Larry Gregory <larry.gregory@elastic.co>
Closes #211652
Summary
Part 2 of #211652 and follow up from #214798
Removed most SASS files from all platform security owned code. (Full checklist on parent issue)
How to test
Testing visual regression isn't super straightforward here. For my local testing, i started two instances of Kibana (main and this branch)
On main:
Once started, in a private browsing window, you should have access to Kibana on main on
localhost:5602On this PR:
Start ES and Kibana normally (Kibana should be available on localhost:5601)
This PR contains changes to the following parts of the Spaces plugin:
For testing the full login page with different selectors, etc, you can start kibana with the following changes in the kibana.dev.yml file
Ideally, you should see no visual regression between the two versions.
Screenshots
Checklist
Check the PR satisfies following conditions.
Reviewers should verify this PR satisfies this list as well.
release_note:*label is applied per the guidelinesIdentify risks
Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss.
Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging.