Out now! Check out the Poll results: Do you have a Shopify store?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Re: Dawn theme, javascript for login template

Dawn theme, javascript for login template

BigSkillet
Shopify Partner
21 0 19

Where I can find the javascript associated with templates/customers/login? Specifically, the forgot password toggle and recover_success message? I haven't found any references in global.js or any other theme files.

 

I also noticed the forgot password toggle and recover_success message work when javascript is disabled. Could it be that it doesn't required javascript and they achieved the functionality some other way?

 

I'm stumped...

Replies 8 (8)

PaulNewton
Shopify Partner
7450 657 1564

I don't have an exact answer for this due to time and not being sure what your seeking.

Overall the entire form processing process is poorly defined and documented and not conducive for testing.

Like if your trying to test form error/success messages you may need to disable captchas entirely.etc

So it can take some digging.

 

Dawn reference customer forms and files

 

The form tag and parameters

https://shopify.dev/api/liquid/tags/theme-tags#recover_customer_password 

 

Similar unanswered questions

https://community.shopify.com/c/shopify-design/how-to-show-successful-password-recovery-message/td-p... 

 

 

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org


BigSkillet
Shopify Partner
21 0 19

I'm building a theme from scratch and would like to reference the javascript for the login, but can't seem to find it anywhere. I'd like to see how it's changed since Timber, Debut, and Slate. Any idea where that might be located, if it exists at all?  

PaulNewton
Shopify Partner
7450 657 1564

You keep mentioning javascript but your not talking about the GOAL, what is the code your looking for doing?

What are you trying to do?

 

Finding any code across 3 very different code base for comparison is gonna be a lot of work.

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org


BigSkillet
Shopify Partner
21 0 19

The goal is to find the javascript for the forgot password toggle and recover_message associated with the login template. That's it – that's the goal. I've looked through every file in the Dawn theme and I'm not finding any reference to those items.

PaulNewton
Shopify Partner
7450 657 1564

Ah at least for the UI toggle between login & recover that is actually handled by CSS in some themes.

For dawn that should be in customer.css .

They use ::target psuedo selector to change styles based on the url hash/fragment : none, or #login or #recover .

 

You'd want to jump into browser devtools and inspect this off and on interaction flipping the display:none / display:block 

 

If by recovery message you mean the area/text after the recovery link is used from the recovery email I'm not sure we can intercept that besides maybe capturing the form body and parsing the form-body that's rendered?

Or maybe changing the text in locales.

Or maybe note that a lack of errors means success if trying to do liquid logic.

 

You could try pushing the form object into json and inspecting that output text on the frontend to see if something stands out.

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org


BigSkillet
Shopify Partner
21 0 19

Thanks, @PaulNewton

Just as I suspected – no javascript. Thanks for pointing that out in customer.css. It's exactly what I was looking for and I've learned something new with the :target selector!

 

Yes, when I say recovery message, I'm referring to the success message that appears after a password reset. I think that may be controlled by the #login, #recover :target as well, but I'll need to investigate further. Thanks again!

 

@Zworthkey,
I was referring to the password recovery message in the main/templates/customers/login template, not the main password page. I'm trying to understand how the recovery message works without javascript.

PaulNewton
Shopify Partner
7450 657 1564

 


@BigSkillet wrote:

Yes, when I say recovery message, I'm referring to the success message that appears after a password reset. I think that may be controlled by the #login, #recover :target as well, but I'll need to investigate further. Thanks again!

 


Expanded thread for context https://community.shopify.com/c/technical-q-a/trigger-if-form-posted-successfully-with-url/m-p/14274... 

 

Wouldn't the pattern there be ?recovery_posted=true , ?recover_posted=true , ?recover_password=true , ?reset_password=true etc ? , ?recover_success=true 

  Wild guess really the way they build some of this stuff.

 

I can't recall ever seeing a param for being able to trigger the success message but I have avoided form testing ironically because of how much it's undocumented. Just knowing about the contact_posted parameter for testing shopify forms puts you miles ahead of most on the forums in that regard. You may have noticed a lack of shopify response to liquid language queries unlike API stuff as well.

 

So if you need to keep digging I recommend:

 

 

 

@Zworthkey,
I was referring to the password recovery message in the main/templates/customers/login template, not the main password page. I'm trying to understand how the recovery message works without javascript.

While the template was wrong,  Note that response was about changing the translation locale strings of what text is actually displayed for such things. 

Which for dawn is {{ 'customer.recover_password.success' | t }} around line customers/login.liquid

 

 

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org


Zworthkey
Shopify Partner
5581 642 1583

Please go to Shopify dawn theme by following below path:-

dawn/sections/main-password-header.liquid

And search their shop.password_message

Hope rest you will manage at your own.

Thanks